Add latest changes from gitlab-org/gitlab@master

2 files changed, 63 insertions, 0 deletions

diff --git a/spec/frontend/saved_replies/components/__snapshots__/list_item_spec.js.snap b/spec/frontend/saved_replies/components/__snapshots__/list_item_spec.js.snap
index 3abdfcdaf20..154ce2bd089 100644
--- a/spec/frontend/saved_replies/components/__snapshots__/list_item_spec.js.snap
+++ b/spec/frontend/saved_replies/components/__snapshots__/list_item_spec.js.snap
@@ -10,6 +10,21 @@ exports[`Saved replies list item component renders list item 1`] = `
     <strong>
       test
     </strong>
+     
+    <div
+      class="gl-ml-auto"
+    >
+      <gl-button-stub
+        aria-label="Delete"
+        buttontextclasses=""
+        category="secondary"
+        data-testid="saved-reply-delete-btn"
+        icon="remove"
+        size="medium"
+        title="Delete"
+        variant="danger"
+      />
+    </div>
   </div>
    
   <div
@@ -17,5 +32,21 @@ exports[`Saved replies list item component renders list item 1`] = `
   >
     /assign_reviewer
   </div>
+   
+  <gl-modal-stub
+    actionprimary="[object Object]"
+    actionsecondary="[object Object]"
+    arialabel=""
+    dismisslabel="Close"
+    modalclass=""
+    modalid="delete-saved-reply-2"
+    size="sm"
+    title="Delete saved reply"
+    titletag="h4"
+  >
+    <gl-sprintf-stub
+      message="Are you sure you want to delete %{name}? This action cannot be undone."
+    />
+  </gl-modal-stub>
 </li>
 `;
diff --git a/spec/frontend/saved_replies/components/list_item_spec.js b/spec/frontend/saved_replies/components/list_item_spec.js
index cad1000473b..1d80844f30a 100644
--- a/spec/frontend/saved_replies/components/list_item_spec.js
+++ b/spec/frontend/saved_replies/components/list_item_spec.js
@@ -1,11 +1,31 @@
+import Vue from 'vue';
+import VueApollo from 'vue-apollo';
 import { shallowMount } from '@vue/test-utils';
+import { GlModal } from '@gitlab/ui';
+import createMockApollo from 'helpers/mock_apollo_helper';
+import { createMockDirective } from 'helpers/vue_mock_directive';
+import waitForPromises from 'helpers/wait_for_promises';
 import ListItem from '~/saved_replies/components/list_item.vue';
+import deleteSavedReplyMutation from '~/saved_replies/queries/delete_saved_reply.mutation.graphql';
 
 let wrapper;
+let deleteSavedReplyMutationResponse;
 
 function createComponent(propsData = {}) {
+  Vue.use(VueApollo);
+
+  deleteSavedReplyMutationResponse = jest
+    .fn()
+    .mockResolvedValue({ data: { savedReplyDestroy: { errors: [] } } });
+
   return shallowMount(ListItem, {
     propsData,
+    directives: {
+      GlModal: createMockDirective('gl-modal'),
+    },
+    apolloProvider: createMockApollo([
+      [deleteSavedReplyMutation, deleteSavedReplyMutationResponse],
+    ]),
   });
 }
 
@@ -19,4 +39,16 @@ describe('Saved replies list item component', () => {
 
     expect(wrapper.element).toMatchSnapshot();
   });
+
+  describe('delete button', () => {
+    it('calls Apollo mutate', async () => {
+      wrapper = createComponent({ reply: { name: 'test', content: '/assign_reviewer', id: 1 } });
+
+      wrapper.findComponent(GlModal).vm.$emit('primary');
+
+      await waitForPromises();
+
+      expect(deleteSavedReplyMutationResponse).toHaveBeenCalledWith({ id: 1 });
+    });
+  });
 });