Add latest changes from gitlab-org/gitlab@master

2 files changed, 66 insertions, 14 deletions

diff --git a/spec/frontend/projects/compare/components/app_legacy_spec.js b/spec/frontend/projects/compare/components/app_legacy_spec.js
index 4c7f0d5cccc..93e96c8b9f7 100644
--- a/spec/frontend/projects/compare/components/app_legacy_spec.js
+++ b/spec/frontend/projects/compare/components/app_legacy_spec.js
@@ -8,7 +8,7 @@ jest.mock('~/lib/utils/csrf', () => ({ token: 'mock-csrf-token' }));
 const projectCompareIndexPath = 'some/path';
 const refsProjectPath = 'some/refs/path';
 const paramsFrom = 'master';
-const paramsTo = 'master';
+const paramsTo = 'some-other-branch';
 
 describe('CompareApp component', () => {
   let wrapper;
@@ -36,6 +36,9 @@ describe('CompareApp component', () => {
     createComponent();
   });
 
+  const findSourceDropdown = () => wrapper.find('[data-testid="sourceRevisionDropdown"]');
+  const findTargetDropdown = () => wrapper.find('[data-testid="targetRevisionDropdown"]');
+
   it('renders component with prop', () => {
     expect(wrapper.props()).toEqual(
       expect.objectContaining({
@@ -62,12 +65,31 @@ describe('CompareApp component', () => {
     expect(wrapper.find('[data-testid="ellipsis"]').exists()).toBe(true);
   });
 
-  it('render Source and Target BranchDropdown components', () => {
-    const branchDropdowns = wrapper.findAll(RevisionDropdown);
+  describe('Source and Target BranchDropdown components', () => {
+    const findAllBranchDropdowns = () => wrapper.findAll(RevisionDropdown);
+
+    it('renders the components with the correct props', () => {
+      expect(findAllBranchDropdowns().length).toBe(2);
+      expect(findSourceDropdown().props('revisionText')).toBe('Source');
+      expect(findTargetDropdown().props('revisionText')).toBe('Target');
+    });
+
+    it('sets the revision when the "selectRevision" event is emitted', async () => {
+      findSourceDropdown().vm.$emit('selectRevision', {
+        direction: 'to',
+        revision: 'some-source-revision',
+      });
+
+      findTargetDropdown().vm.$emit('selectRevision', {
+        direction: 'from',
+        revision: 'some-target-revision',
+      });
+
+      await wrapper.vm.$nextTick();
 
-    expect(branchDropdowns.length).toBe(2);
-    expect(branchDropdowns.at(0).props('revisionText')).toBe('Source');
-    expect(branchDropdowns.at(1).props('revisionText')).toBe('Target');
+      expect(findTargetDropdown().props('paramsBranch')).toBe('some-target-revision');
+      expect(findSourceDropdown().props('paramsBranch')).toBe('some-source-revision');
+    });
   });
 
   describe('compare button', () => {
@@ -87,6 +109,27 @@ describe('CompareApp component', () => {
     });
   });
 
+  describe('swap revisions button', () => {
+    const findSwapRevisionsButton = () => wrapper.find('[data-testid="swapRevisionsButton"]');
+
+    it('renders the swap revisions button', () => {
+      expect(findSwapRevisionsButton().exists()).toBe(true);
+    });
+
+    it('has the correct text', () => {
+      expect(findSwapRevisionsButton().text()).toBe('Swap revisions');
+    });
+
+    it('swaps revisions when clicked', async () => {
+      findSwapRevisionsButton().vm.$emit('click');
+
+      await wrapper.vm.$nextTick();
+
+      expect(findTargetDropdown().props('paramsBranch')).toBe(paramsTo);
+      expect(findSourceDropdown().props('paramsBranch')).toBe(paramsFrom);
+    });
+  });
+
   describe('merge request buttons', () => {
     const findProjectMrButton = () => wrapper.find('[data-testid="projectMrButton"]');
     const findCreateMrButton = () => wrapper.find('[data-testid="createMrButton"]');
diff --git a/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js b/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
index 270c89e674c..ca208395e82 100644
--- a/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
+++ b/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
@@ -1,4 +1,4 @@
-import { GlDropdown } from '@gitlab/ui';
+import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import AxiosMockAdapter from 'axios-mock-adapter';
 import createFlash from '~/flash';
@@ -29,6 +29,7 @@ describe('RevisionDropdown component', () => {
 
   beforeEach(() => {
     axiosMock = new AxiosMockAdapter(axios);
+    createComponent();
   });
 
   afterEach(() => {
@@ -39,7 +40,6 @@ describe('RevisionDropdown component', () => {
   const findGlDropdown = () => wrapper.find(GlDropdown);
 
   it('sets hidden input', () => {
-    createComponent();
     expect(wrapper.find('input[type="hidden"]').attributes('value')).toBe(
       defaultProps.paramsBranch,
     );
@@ -68,8 +68,6 @@ describe('RevisionDropdown component', () => {
       Tags: undefined,
     });
 
-    createComponent();
-
     await axios.waitForAll();
 
     expect(wrapper.vm.branches).toEqual([]);
@@ -79,15 +77,12 @@ describe('RevisionDropdown component', () => {
   it('shows flash message on error', async () => {
     axiosMock.onGet('some/invalid/path').replyOnce(404);
 
-    createComponent();
-
     await wrapper.vm.fetchBranchesAndTags();
     expect(createFlash).toHaveBeenCalled();
   });
 
   describe('GlDropdown component', () => {
     it('renders props', () => {
-      createComponent();
       expect(wrapper.props()).toEqual(expect.objectContaining(defaultProps));
     });
 
@@ -99,8 +94,22 @@ describe('RevisionDropdown component', () => {
     });
 
     it('display params branch text', () => {
-      createComponent();
       expect(findGlDropdown().props('text')).toBe(defaultProps.paramsBranch);
     });
+
+    it('emits a "selectRevision" event when a revision is selected', async () => {
+      const findGlDropdownItems = () => wrapper.findAll(GlDropdownItem);
+      const findFirstGlDropdownItem = () => findGlDropdownItems().at(0);
+
+      wrapper.setData({ branches: ['some-branch'] });
+
+      await wrapper.vm.$nextTick();
+
+      findFirstGlDropdownItem().vm.$emit('click');
+
+      expect(wrapper.emitted()).toEqual({
+        selectRevision: [[{ direction: 'from', revision: 'some-branch' }]],
+      });
+    });
   });
 });