Add latest changes from gitlab-org/gitlab@13-8-stable-eev13.8.0-rc42

22 files changed, 60 insertions, 83 deletions

diff --git a/spec/frontend/sidebar/assignee_title_spec.js b/spec/frontend/sidebar/assignee_title_spec.js
index b5d1e5216f8..9f5d51c7795 100644
--- a/spec/frontend/sidebar/assignee_title_spec.js
+++ b/spec/frontend/sidebar/assignee_title_spec.js
@@ -6,7 +6,7 @@ import Component from '~/sidebar/components/assignees/assignee_title.vue';
 describe('AssigneeTitle component', () => {
   let wrapper;
 
-  const createComponent = props => {
+  const createComponent = (props) => {
     return shallowMount(Component, {
       propsData: {
         numberOfAssignees: 0,
diff --git a/spec/frontend/sidebar/assignees_spec.js b/spec/frontend/sidebar/assignees_spec.js
index d1810ada97a..23e82171fe9 100644
--- a/spec/frontend/sidebar/assignees_spec.js
+++ b/spec/frontend/sidebar/assignees_spec.js
@@ -1,9 +1,9 @@
 import { mount } from '@vue/test-utils';
 import { trimText } from 'helpers/text_helper';
 import { GlIcon } from '@gitlab/ui';
+import UsersMockHelper from 'helpers/user_mock_data_helper';
 import Assignee from '~/sidebar/components/assignees/assignees.vue';
 import UsersMock from './mock_data';
-import UsersMockHelper from '../helpers/user_mock_data_helper';
 
 describe('Assignee component', () => {
   const getDefaultProps = () => ({
diff --git a/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js b/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
index 907d6144415..8e158c99971 100644
--- a/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
+++ b/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
@@ -101,7 +101,7 @@ describe('CollapsedAssigneeList component', () => {
 
     beforeEach(() => {
       users = UsersMockHelper.createNumberRandomUsers(3);
-      userNames = users.map(x => x.name).join(', ');
+      userNames = users.map((x) => x.name).join(', ');
     });
 
     describe('default', () => {
diff --git a/spec/frontend/sidebar/components/assignees/collapsed_assignee_spec.js b/spec/frontend/sidebar/components/assignees/collapsed_assignee_spec.js
index 49a6d9e8ae6..ee1f8ed8d2b 100644
--- a/spec/frontend/sidebar/components/assignees/collapsed_assignee_spec.js
+++ b/spec/frontend/sidebar/components/assignees/collapsed_assignee_spec.js
@@ -28,12 +28,7 @@ describe('CollapsedAssignee assignee component', () => {
   it('has author name', () => {
     createComponent();
 
-    expect(
-      wrapper
-        .find('.author')
-        .text()
-        .trim(),
-    ).toEqual(TEST_USER.name);
+    expect(wrapper.find('.author').text().trim()).toEqual(TEST_USER.name);
   });
 
   it('has assignee avatar', () => {
diff --git a/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js b/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js
index 1cf0af48bef..da69f56d442 100644
--- a/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js
+++ b/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js
@@ -1,9 +1,9 @@
 import { mount } from '@vue/test-utils';
 import { TEST_HOST } from 'helpers/test_constants';
+import UsersMockHelper from 'helpers/user_mock_data_helper';
 import UncollapsedAssigneeList from '~/sidebar/components/assignees/uncollapsed_assignee_list.vue';
 import AssigneeAvatarLink from '~/sidebar/components/assignees/assignee_avatar_link.vue';
 import userDataMock from '../../user_data_mock';
-import UsersMockHelper from '../../../helpers/user_mock_data_helper';
 
 const DEFAULT_RENDER_COUNT = 5;
 
diff --git a/spec/frontend/sidebar/components/copy_email_to_clipboard_spec.js b/spec/frontend/sidebar/components/copy_email_to_clipboard_spec.js
new file mode 100644
index 00000000000..b9132fa4450
--- /dev/null
+++ b/spec/frontend/sidebar/components/copy_email_to_clipboard_spec.js
@@ -0,0 +1,22 @@
+import { mount } from '@vue/test-utils';
+import { getByText } from '@testing-library/dom';
+import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
+import CopyEmailToClipboard from '~/sidebar/components/copy_email_to_clipboard.vue';
+
+describe('CopyEmailToClipboard component', () => {
+  const sampleEmail = 'sample+email@test.com';
+
+  const wrapper = mount(CopyEmailToClipboard, {
+    propsData: {
+      copyText: sampleEmail,
+    },
+  });
+
+  it('renders the Issue email text with the forwardable email', () => {
+    expect(getByText(wrapper.element, `Issue email: ${sampleEmail}`)).not.toBeNull();
+  });
+
+  it('finds ClipboardButton with the correct props', () => {
+    expect(wrapper.find(ClipboardButton).props('text')).toBe(sampleEmail);
+  });
+});
diff --git a/spec/frontend/sidebar/components/severity/severity_spec.js b/spec/frontend/sidebar/components/severity/severity_spec.js
index b6690f11d6b..ba7cea0919c 100644
--- a/spec/frontend/sidebar/components/severity/severity_spec.js
+++ b/spec/frontend/sidebar/components/severity/severity_spec.js
@@ -24,7 +24,7 @@ describe('SeverityToken', () => {
   const findIcon = () => wrapper.find(GlIcon);
 
   it('renders severity token for each severity type', () => {
-    Object.values(INCIDENT_SEVERITY).forEach(severity => {
+    Object.values(INCIDENT_SEVERITY).forEach((severity) => {
       createComponent({ severity });
       expect(findIcon().classes()).toContain(`icon-${severity.icon}`);
       expect(findIcon().attributes('name')).toBe(`severity-${severity.icon}`);
diff --git a/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js b/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js
index 638d3706d12..fa40d75d4e9 100644
--- a/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js
+++ b/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js
@@ -94,7 +94,7 @@ describe('SidebarSeverity', () => {
       let resolvePromise;
       wrapper.vm.$apollo.mutate = jest.fn(
         () =>
-          new Promise(resolve => {
+          new Promise((resolve) => {
             resolvePromise = resolve;
           }),
       );
@@ -119,21 +119,11 @@ describe('SidebarSeverity', () => {
       });
 
       it('should display only icon with a tooltip', () => {
-        expect(
-          findSeverityToken()
-            .at(0)
-            .attributes('icononly'),
-        ).toBe('true');
-        expect(
-          findSeverityToken()
-            .at(0)
-            .attributes('iconsize'),
-        ).toBe('14');
-        expect(
-          findTooltip()
-            .text()
-            .replace(/\s+/g, ' '),
-        ).toContain(`Severity: ${INCIDENT_SEVERITY[severity].label}`);
+        expect(findSeverityToken().at(0).attributes('icononly')).toBe('true');
+        expect(findSeverityToken().at(0).attributes('iconsize')).toBe('14');
+        expect(findTooltip().text().replace(/\s+/g, ' ')).toContain(
+          `Severity: ${INCIDENT_SEVERITY[severity].label}`,
+        );
       });
 
       it('should expand the dropdown on collapsed icon click', async () => {
diff --git a/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js b/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js
index bcd2c14f2fa..0b6a2e6ceb9 100644
--- a/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js
+++ b/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js
@@ -1,11 +1,12 @@
 import { createMockDirective } from 'helpers/vue_mock_directive';
 import { mount } from '@vue/test-utils';
+import { stubTransition } from 'helpers/stub_transition';
 import TimeTracker from '~/sidebar/components/time_tracking/time_tracker.vue';
 
 describe('Issuable Time Tracker', () => {
   let wrapper;
 
-  const findByTestId = testId => wrapper.find(`[data-testid=${testId}]`);
+  const findByTestId = (testId) => wrapper.find(`[data-testid=${testId}]`);
   const findComparisonMeter = () => findByTestId('compareMeter').attributes('title');
   const findCollapsedState = () => findByTestId('collapsedState');
   const findTimeRemainingProgress = () => findByTestId('timeRemainingProgress');
@@ -22,6 +23,9 @@ describe('Issuable Time Tracker', () => {
     mount(TimeTracker, {
       propsData: { ...defaultProps, ...props },
       directives: { GlTooltip: createMockDirective() },
+      stubs: {
+        transition: stubTransition(),
+      },
     });
 
   afterEach(() => {
@@ -213,14 +217,12 @@ describe('Issuable Time Tracker', () => {
         findHelpButton().trigger('click');
         await wrapper.vm.$nextTick();
 
-        expect(findByTestId('helpPane').classes('help-state-toggle-enter')).toBe(true);
-        expect(findByTestId('helpPane').classes('help-state-toggle-leave')).toBe(false);
+        expect(findByTestId('helpPane').exists()).toBe(true);
 
         findCloseHelpButton().trigger('click');
         await wrapper.vm.$nextTick();
 
-        expect(findByTestId('helpPane').classes('help-state-toggle-leave')).toBe(true);
-        expect(findByTestId('helpPane').classes('help-state-toggle-enter')).toBe(false);
+        expect(findByTestId('helpPane').exists()).toBe(false);
       });
     });
   });
diff --git a/spec/frontend/sidebar/confidential/edit_form_spec.js b/spec/frontend/sidebar/confidential/edit_form_spec.js
index 56f163eecd1..6b571df10ae 100644
--- a/spec/frontend/sidebar/confidential/edit_form_spec.js
+++ b/spec/frontend/sidebar/confidential/edit_form_spec.js
@@ -6,7 +6,7 @@ describe('Edit Form Dropdown', () => {
   const toggleForm = () => {};
   const updateConfidentialAttribute = () => {};
 
-  const createComponent = props => {
+  const createComponent = (props) => {
     wrapper = shallowMount(EditForm, {
       propsData: {
         ...props,
diff --git a/spec/frontend/sidebar/lock/edit_form_buttons_spec.js b/spec/frontend/sidebar/lock/edit_form_buttons_spec.js
index 913646c8f8d..a14ca711204 100644
--- a/spec/frontend/sidebar/lock/edit_form_buttons_spec.js
+++ b/spec/frontend/sidebar/lock/edit_form_buttons_spec.js
@@ -15,7 +15,7 @@ describe('EditFormButtons', () => {
   let issuableType;
   let issuableDisplayName;
 
-  const setIssuableType = pageType => {
+  const setIssuableType = (pageType) => {
     issuableType = pageType;
     issuableDisplayName = issuableType.replace(/_/g, ' ');
   };
diff --git a/spec/frontend/sidebar/lock/edit_form_spec.js b/spec/frontend/sidebar/lock/edit_form_spec.js
index b1c3bfe3ef5..4ae9025ee39 100644
--- a/spec/frontend/sidebar/lock/edit_form_spec.js
+++ b/spec/frontend/sidebar/lock/edit_form_spec.js
@@ -7,7 +7,7 @@ describe('Edit Form Dropdown', () => {
   let issuableType; // Either ISSUABLE_TYPE_ISSUE or ISSUABLE_TYPE_MR
   let issuableDisplayName;
 
-  const setIssuableType = pageType => {
+  const setIssuableType = (pageType) => {
     issuableType = pageType;
     issuableDisplayName = issuableType.replace(/_/g, ' ');
   };
diff --git a/spec/frontend/sidebar/lock/issuable_lock_form_spec.js b/spec/frontend/sidebar/lock/issuable_lock_form_spec.js
index e8091dcb51d..92cdba4f1f2 100644
--- a/spec/frontend/sidebar/lock/issuable_lock_form_spec.js
+++ b/spec/frontend/sidebar/lock/issuable_lock_form_spec.js
@@ -12,7 +12,7 @@ describe('IssuableLockForm', () => {
   let store;
   let issuableType; // Either ISSUABLE_TYPE_ISSUE or ISSUABLE_TYPE_MR
 
-  const setIssuableType = pageType => {
+  const setIssuableType = (pageType) => {
     issuableType = pageType;
   };
 
@@ -23,7 +23,7 @@ describe('IssuableLockForm', () => {
   const findSidebarLockStatusTooltip = () =>
     getBinding(findSidebarCollapseIcon().element, 'gl-tooltip');
 
-  const initStore = isLocked => {
+  const initStore = (isLocked) => {
     if (issuableType === ISSUABLE_TYPE_ISSUE) {
       store = createStore();
       store.getters.getNoteableData.targetType = 'issue';
diff --git a/spec/frontend/sidebar/participants_spec.js b/spec/frontend/sidebar/participants_spec.js
index 93c9b3b84c3..1210f7c9531 100644
--- a/spec/frontend/sidebar/participants_spec.js
+++ b/spec/frontend/sidebar/participants_spec.js
@@ -21,7 +21,7 @@ describe('Participants', () => {
 
   const getCollapsedParticipantsCount = () => wrapper.find('[data-testid="collapsed-count"]');
 
-  const mountComponent = propsData =>
+  const mountComponent = (propsData) =>
     shallowMount(Participants, {
       propsData,
     });
diff --git a/spec/frontend/sidebar/reviewer_title_spec.js b/spec/frontend/sidebar/reviewer_title_spec.js
index eae266688d5..cbd36040579 100644
--- a/spec/frontend/sidebar/reviewer_title_spec.js
+++ b/spec/frontend/sidebar/reviewer_title_spec.js
@@ -6,7 +6,7 @@ import Component from '~/sidebar/components/reviewers/reviewer_title.vue';
 describe('ReviewerTitle component', () => {
   let wrapper;
 
-  const createComponent = props => {
+  const createComponent = (props) => {
     return shallowMount(Component, {
       propsData: {
         numberOfReviewers: 0,
@@ -41,27 +41,6 @@ describe('ReviewerTitle component', () => {
     });
   });
 
-  describe('gutter toggle', () => {
-    it('does not show toggle by default', () => {
-      wrapper = createComponent({
-        numberOfReviewers: 2,
-        editable: false,
-      });
-
-      expect(wrapper.vm.$el.querySelector('.gutter-toggle')).toBeNull();
-    });
-
-    it('shows toggle when showToggle is true', () => {
-      wrapper = createComponent({
-        numberOfReviewers: 2,
-        editable: false,
-        showToggle: true,
-      });
-
-      expect(wrapper.vm.$el.querySelector('.gutter-toggle')).toEqual(expect.any(Object));
-    });
-  });
-
   it('does not render spinner by default', () => {
     wrapper = createComponent({
       numberOfReviewers: 0,
diff --git a/spec/frontend/sidebar/reviewers_spec.js b/spec/frontend/sidebar/reviewers_spec.js
index effcac266f0..91f28e85f3b 100644
--- a/spec/frontend/sidebar/reviewers_spec.js
+++ b/spec/frontend/sidebar/reviewers_spec.js
@@ -1,9 +1,9 @@
 import { mount } from '@vue/test-utils';
 import { trimText } from 'helpers/text_helper';
 import { GlIcon } from '@gitlab/ui';
+import UsersMockHelper from 'helpers/user_mock_data_helper';
 import Reviewer from '~/sidebar/components/reviewers/reviewers.vue';
 import UsersMock from './mock_data';
-import UsersMockHelper from '../helpers/user_mock_data_helper';
 
 describe('Reviewer component', () => {
   const getDefaultProps = () => ({
diff --git a/spec/frontend/sidebar/sidebar_assignees_spec.js b/spec/frontend/sidebar/sidebar_assignees_spec.js
index dc4560d2ae8..f1c13a5f818 100644
--- a/spec/frontend/sidebar/sidebar_assignees_spec.js
+++ b/spec/frontend/sidebar/sidebar_assignees_spec.js
@@ -29,7 +29,7 @@ describe('sidebar assignees', () => {
         },
       },
       // Attaching to document is required because this component emits something from the parent element :/
-      attachToDocument: true,
+      attachTo: document.body,
     });
   };
 
diff --git a/spec/frontend/sidebar/sidebar_mediator_spec.js b/spec/frontend/sidebar/sidebar_mediator_spec.js
index 0892d452966..019ded87093 100644
--- a/spec/frontend/sidebar/sidebar_mediator_spec.js
+++ b/spec/frontend/sidebar/sidebar_mediator_spec.js
@@ -33,7 +33,7 @@ describe('Sidebar mediator', () => {
   it('saves assignees', () => {
     mock.onPut(mediatorMockData.endpoint).reply(200, {});
 
-    return mediator.saveAssignees('issue[assignee_ids]').then(resp => {
+    return mediator.saveAssignees('issue[assignee_ids]').then((resp) => {
       expect(resp.status).toEqual(200);
     });
   });
diff --git a/spec/frontend/sidebar/sidebar_move_issue_spec.js b/spec/frontend/sidebar/sidebar_move_issue_spec.js
index ad919f69546..24bb5a8e916 100644
--- a/spec/frontend/sidebar/sidebar_move_issue_spec.js
+++ b/spec/frontend/sidebar/sidebar_move_issue_spec.js
@@ -74,7 +74,7 @@ describe('SidebarMoveIssue', () => {
       expect(test.sidebarMoveIssue.$dropdownToggle.data('deprecatedJQueryDropdown')).toBeTruthy();
     });
 
-    it('escapes html from project name', done => {
+    it('escapes html from project name', (done) => {
       test.$toggleButton.dropdown('toggle');
 
       setImmediate(() => {
@@ -98,7 +98,7 @@ describe('SidebarMoveIssue', () => {
       expect(test.$confirmButton.hasClass('is-loading')).toBe(true);
     });
 
-    it('should remove loading state from confirm button on failure', done => {
+    it('should remove loading state from confirm button on failure', (done) => {
       jest.spyOn(window, 'Flash').mockImplementation(() => {});
       jest.spyOn(test.mediator, 'moveIssue').mockReturnValue(Promise.reject());
       test.mediator.setMoveToProjectId(7);
@@ -125,7 +125,7 @@ describe('SidebarMoveIssue', () => {
     });
   });
 
-  it('should set moveToProjectId on dropdown item "No project" click', done => {
+  it('should set moveToProjectId on dropdown item "No project" click', (done) => {
     jest.spyOn(test.mediator, 'setMoveToProjectId').mockImplementation(() => {});
 
     // Open the dropdown
@@ -133,10 +133,7 @@ describe('SidebarMoveIssue', () => {
 
     // Wait for the autocomplete request to finish
     setImmediate(() => {
-      test.$content
-        .find('.js-move-issue-dropdown-item')
-        .eq(0)
-        .trigger('click');
+      test.$content.find('.js-move-issue-dropdown-item').eq(0).trigger('click');
 
       expect(test.mediator.setMoveToProjectId).toHaveBeenCalledWith(0);
       expect(test.$confirmButton.prop('disabled')).toBeTruthy();
@@ -144,7 +141,7 @@ describe('SidebarMoveIssue', () => {
     });
   });
 
-  it('should set moveToProjectId on dropdown item click', done => {
+  it('should set moveToProjectId on dropdown item click', (done) => {
     jest.spyOn(test.mediator, 'setMoveToProjectId').mockImplementation(() => {});
 
     // Open the dropdown
@@ -152,10 +149,7 @@ describe('SidebarMoveIssue', () => {
 
     // Wait for the autocomplete request to finish
     setImmediate(() => {
-      test.$content
-        .find('.js-move-issue-dropdown-item')
-        .eq(1)
-        .trigger('click');
+      test.$content.find('.js-move-issue-dropdown-item').eq(1).trigger('click');
 
       expect(test.mediator.setMoveToProjectId).toHaveBeenCalledWith(20);
       expect(test.$confirmButton.attr('disabled')).toBe(undefined);
diff --git a/spec/frontend/sidebar/sidebar_store_spec.js b/spec/frontend/sidebar/sidebar_store_spec.js
index 7c18222f300..7b73dc868b7 100644
--- a/spec/frontend/sidebar/sidebar_store_spec.js
+++ b/spec/frontend/sidebar/sidebar_store_spec.js
@@ -1,6 +1,6 @@
+import UsersMockHelper from 'helpers/user_mock_data_helper';
 import SidebarStore from '~/sidebar/stores/sidebar_store';
 import Mock from './mock_data';
-import UsersMockHelper from '../helpers/user_mock_data_helper';
 
 const ASSIGNEE = {
   id: 2,
diff --git a/spec/frontend/sidebar/subscriptions_spec.js b/spec/frontend/sidebar/subscriptions_spec.js
index 428441656b3..043ffd972da 100644
--- a/spec/frontend/sidebar/subscriptions_spec.js
+++ b/spec/frontend/sidebar/subscriptions_spec.js
@@ -8,7 +8,7 @@ describe('Subscriptions', () => {
 
   const findToggleButton = () => wrapper.find(ToggleButton);
 
-  const mountComponent = propsData =>
+  const mountComponent = (propsData) =>
     shallowMount(Subscriptions, {
       propsData,
     });
diff --git a/spec/frontend/sidebar/todo_spec.js b/spec/frontend/sidebar/todo_spec.js
index b0e94f16dd7..4adfaf7ad7b 100644
--- a/spec/frontend/sidebar/todo_spec.js
+++ b/spec/frontend/sidebar/todo_spec.js
@@ -42,12 +42,7 @@ describe('SidebarTodo', () => {
     ({ isTodo, iconClass, label, icon }) => {
       createComponent({ isTodo });
 
-      expect(
-        wrapper
-          .find(GlIcon)
-          .classes()
-          .join(' '),
-      ).toStrictEqual(iconClass);
+      expect(wrapper.find(GlIcon).classes().join(' ')).toStrictEqual(iconClass);
       expect(wrapper.find(GlIcon).props('name')).toStrictEqual(icon);
       expect(wrapper.find('button').text()).toBe(label);
     },