Add latest changes from gitlab-org/gitlab@master

2 files changed, 148 insertions, 11 deletions

diff --git a/spec/frontend/vue_shared/components/mr_more_dropdown_spec.js b/spec/frontend/vue_shared/components/mr_more_dropdown_spec.js
new file mode 100644
index 00000000000..41639725f66
--- /dev/null
+++ b/spec/frontend/vue_shared/components/mr_more_dropdown_spec.js
@@ -0,0 +1,137 @@
+import { shallowMount } from '@vue/test-utils';
+import MRMoreActionsDropdown from '~/vue_shared/components/mr_more_dropdown.vue';
+
+describe('MR More actions sidebar', () => {
+  let wrapper;
+
+  const findNotificationToggle = () => wrapper.find('[data-testid="notification-toggle"]');
+  const findEditMergeRequestOption = () => wrapper.find('[data-testid="edit-merge-request"]');
+  const findMarkAsReadyAndDraftOption = () =>
+    wrapper.find('[data-testid="ready-and-draft-action"]');
+  const findCopyReferenceButton = () => wrapper.find('[data-testid="copy-reference"]');
+  const findReopenMergeRequestOption = () => wrapper.find('[data-testid="reopen-merge-request"]');
+  const findReportAbuseOption = () => wrapper.find('[data-testid="report-abuse-option"]');
+
+  const createComponent = ({
+    movedMrSidebarFlag = false,
+    isCurrentUser = true,
+    isLoggedIn = true,
+    open = false,
+    canUpdateMergeRequest = false,
+  } = {}) => {
+    wrapper = shallowMount(MRMoreActionsDropdown, {
+      propsData: {
+        mr: {
+          iid: 1,
+        },
+        isCurrentUser,
+        isLoggedIn,
+        open,
+        canUpdateMergeRequest,
+      },
+      provide: {
+        glFeatures: { movedMrSidebar: movedMrSidebarFlag },
+      },
+    });
+  };
+
+  describe('Notifications toggle', () => {
+    it.each`
+      movedMrSidebarFlag | isLoggedIn | showNotificationToggle
+      ${false}           | ${false}   | ${false}
+      ${false}           | ${true}    | ${false}
+      ${true}            | ${false}   | ${false}
+      ${true}            | ${true}    | ${true}
+    `(
+      "when the movedMrSidebar flag is '$movedMrSidebarFlag' and is isLoggedIn as '$isLoggedIn'",
+      ({ movedMrSidebarFlag, isLoggedIn, showNotificationToggle }) => {
+        createComponent({
+          isLoggedIn,
+          movedMrSidebarFlag,
+        });
+
+        expect(findNotificationToggle().exists()).toBe(showNotificationToggle);
+      },
+    );
+  });
+
+  describe('Edit/Draft/Reopen MR', () => {
+    it('should not have the edit option when `canUpdateMergeRequest` is false', () => {
+      createComponent();
+
+      expect(findEditMergeRequestOption().exists()).toBe(false);
+    });
+
+    it('should have the edit option when `canUpdateMergeRequest` is true', () => {
+      createComponent({
+        canUpdateMergeRequest: true,
+      });
+
+      expect(findEditMergeRequestOption().exists()).toBe(true);
+    });
+
+    it('should not have the ready and draft option when the the MR is open and `canUpdateMergeRequest` is false', () => {
+      createComponent({
+        open: true,
+        canUpdateMergeRequest: false,
+      });
+
+      expect(findMarkAsReadyAndDraftOption().exists()).toBe(false);
+    });
+
+    it('should have the ready and draft option when the the MR is open and `canUpdateMergeRequest` is true', () => {
+      createComponent({
+        open: true,
+        canUpdateMergeRequest: true,
+      });
+
+      expect(findMarkAsReadyAndDraftOption().exists()).toBe(true);
+    });
+
+    it('should have the reopen option when the the MR is closed and `canUpdateMergeRequest` is true', () => {
+      createComponent({
+        open: false,
+        canUpdateMergeRequest: true,
+      });
+
+      expect(findReopenMergeRequestOption().exists()).toBe(true);
+    });
+
+    it('should not have the reopen option when the the MR is closed and `canUpdateMergeRequest` is false', () => {
+      createComponent({
+        open: false,
+        canUpdateMergeRequest: false,
+      });
+
+      expect(findReopenMergeRequestOption().exists()).toBe(false);
+    });
+  });
+
+  describe('Copy reference', () => {
+    it('should not be visible by default', () => {
+      createComponent();
+
+      expect(findCopyReferenceButton().exists()).toBe(false);
+    });
+
+    it('should be visible when the movedMrSidebarFlag is on', () => {
+      createComponent({ movedMrSidebarFlag: true });
+
+      expect(findCopyReferenceButton().exists()).toBe(true);
+    });
+  });
+
+  describe('Report abuse action', () => {
+    it('should not have the option by default', () => {
+      createComponent();
+
+      expect(findReportAbuseOption().exists()).toBe(false);
+    });
+
+    it('should have the option when not the current user', () => {
+      createComponent({ isCurrentUser: false });
+
+      expect(findReportAbuseOption().exists()).toBe(true);
+    });
+  });
+});
diff --git a/spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js b/spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js
index 9b6f5ae3e38..a27877e7ba8 100644
--- a/spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js
+++ b/spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js
@@ -94,16 +94,15 @@ describe('AlertManagementEmptyState', () => {
   const ItemsTable = () => wrapper.find('.gl-table');
   const ErrorAlert = () => wrapper.findComponent(GlAlert);
   const Pagination = () => wrapper.findComponent(GlPagination);
-  const Tabs = () => wrapper.findComponent(GlTabs);
   const ActionButton = () => wrapper.find('.header-actions > button');
-  const Filters = () => wrapper.findComponent(FilteredSearchBar);
+  const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
   const findPagination = () => wrapper.findComponent(GlPagination);
   const findStatusFilterTabs = () => wrapper.findAllComponents(GlTab);
   const findStatusTabs = () => wrapper.findComponent(GlTabs);
   const findStatusFilterBadge = () => wrapper.findAllComponents(GlBadge);
 
   const handleFilterItems = (filters) => {
-    Filters().vm.$emit('onFilter', filters);
+    findFilteredSearchBar().vm.$emit('onFilter', filters);
     return nextTick();
   };
 
@@ -140,7 +139,7 @@ describe('AlertManagementEmptyState', () => {
         },
       });
 
-      expect(Tabs().exists()).toBe(true);
+      expect(findStatusTabs().exists()).toBe(true);
     });
 
     it('renders the header action buttons if present', () => {
@@ -176,7 +175,7 @@ describe('AlertManagementEmptyState', () => {
         props: { filterSearchTokens: [TOKEN_TYPE_ASSIGNEE] },
       });
 
-      expect(Filters().exists()).toBe(true);
+      expect(findFilteredSearchBar().exists()).toBe(true);
     });
   });
 
@@ -291,8 +290,9 @@ describe('AlertManagementEmptyState', () => {
     });
 
     it('renders the search component for incidents', () => {
-      expect(Filters().props('searchInputPlaceholder')).toBe('Search or filter results…');
-      expect(Filters().props('tokens')).toEqual([
+      const filteredSearchBar = findFilteredSearchBar();
+      expect(filteredSearchBar.props('searchInputPlaceholder')).toBe('Search or filter results…');
+      expect(filteredSearchBar.props('tokens')).toEqual([
         {
           type: TOKEN_TYPE_AUTHOR,
           icon: 'user',
@@ -316,14 +316,14 @@ describe('AlertManagementEmptyState', () => {
           fetchUsers: expect.any(Function),
         },
       ]);
-      expect(Filters().props('recentSearchesStorageKey')).toBe('items');
+      expect(filteredSearchBar.props('recentSearchesStorageKey')).toBe('items');
     });
 
     it('returns correctly applied filter search values', async () => {
       const searchTerm = 'foo';
       await handleFilterItems([{ type: 'filtered-search-term', value: { data: searchTerm } }]);
       await nextTick();
-      expect(Filters().props('initialFilterValue')).toEqual([searchTerm]);
+      expect(findFilteredSearchBar().props('initialFilterValue')).toEqual([searchTerm]);
     });
 
     it('updates props tied to getIncidents GraphQL query', async () => {
@@ -337,7 +337,7 @@ describe('AlertManagementEmptyState', () => {
           value: { data: assigneeUsername },
         },
         searchTerm,
-      ] = Filters().props('initialFilterValue');
+      ] = findFilteredSearchBar().props('initialFilterValue');
 
       expect(authorUsername).toBe('root');
       expect(assigneeUsername).toEqual('root2');
@@ -346,7 +346,7 @@ describe('AlertManagementEmptyState', () => {
 
     it('updates props `searchTerm` and `authorUsername` with empty values when passed filters param is empty', async () => {
       await handleFilterItems([]);
-      expect(Filters().props('initialFilterValue')).toEqual([]);
+      expect(findFilteredSearchBar().props('initialFilterValue')).toEqual([]);
     });
   });
 });