Add latest changes from gitlab-org/gitlab@master

6 files changed, 222 insertions, 214 deletions

diff --git a/spec/frontend/diffs/components/app_spec.js b/spec/frontend/diffs/components/app_spec.js
index 78e3ff4a60c..3a0354205f8 100644
--- a/spec/frontend/diffs/components/app_spec.js
+++ b/spec/frontend/diffs/components/app_spec.js
@@ -613,13 +613,7 @@ describe('diffs/components/app', () => {
       expect(wrapper.contains(CompareVersions)).toBe(true);
       expect(wrapper.find(CompareVersions).props()).toEqual(
         expect.objectContaining({
-          targetBranch: {
-            branchName: 'target-branch',
-            versionIndex: -1,
-            path: '',
-          },
           mergeRequestDiffs: diffsMockData,
-          mergeRequestDiff,
         }),
       );
     });
diff --git a/spec/frontend/diffs/components/compare_dropdown_layout_spec.js b/spec/frontend/diffs/components/compare_dropdown_layout_spec.js
new file mode 100644
index 00000000000..a163a43daf1
--- /dev/null
+++ b/spec/frontend/diffs/components/compare_dropdown_layout_spec.js
@@ -0,0 +1,91 @@
+import { shallowMount } from '@vue/test-utils';
+import { trimText } from 'helpers/text_helper';
+import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue';
+import CompareDropdownLayout from '~/diffs/components/compare_dropdown_layout.vue';
+
+const TEST_COMMIT_TEXT = '1 commit';
+const TEST_CREATED_AT = '2018-10-23T11:49:16.611Z';
+
+describe('CompareDropdownLayout', () => {
+  let wrapper;
+
+  const createVersion = ({ id, isHead, isBase, selected, commitsText, createdAt }) => ({
+    id,
+    href: `version/${id}`,
+    versionName: `version ${id}`,
+    isHead,
+    isBase,
+    short_commit_sha: `abcdef${id}`,
+    commitsText,
+    created_at: createdAt,
+    selected,
+  });
+
+  const createComponent = (propsData = {}) => {
+    wrapper = shallowMount(CompareDropdownLayout, {
+      propsData: {
+        ...propsData,
+      },
+    });
+  };
+
+  const findListItems = () => wrapper.findAll('li');
+  const findListItemsData = () =>
+    findListItems().wrappers.map(listItem => ({
+      href: listItem.find('a').attributes('href'),
+      text: trimText(listItem.text()),
+      createdAt: listItem.findAll(TimeAgo).wrappers[0]?.props('time'),
+      isActive: listItem.find('a.is-active').exists(),
+    }));
+
+  afterEach(() => {
+    wrapper.destroy();
+    wrapper = null;
+  });
+
+  describe('with versions', () => {
+    beforeEach(() => {
+      const versions = [
+        createVersion({
+          id: 1,
+          isHead: false,
+          isBase: true,
+          selected: true,
+          commitsText: TEST_COMMIT_TEXT,
+          createdAt: TEST_CREATED_AT,
+        }),
+        createVersion({ id: 2, isHead: true, isBase: false, selected: false }),
+        createVersion({ id: 3, isHead: false, isBase: false, selected: false }),
+      ];
+
+      createComponent({ versions });
+    });
+
+    it('renders the selected version name', () => {
+      expect(wrapper.text()).toContain('version 1');
+    });
+
+    it('renders versions in order', () => {
+      expect(findListItemsData()).toEqual([
+        {
+          href: 'version/1',
+          text: 'version 1 (base) abcdef1 1 commit',
+          createdAt: TEST_CREATED_AT,
+          isActive: true,
+        },
+        {
+          href: 'version/2',
+          text: 'version 2 (HEAD) abcdef2',
+          createdAt: undefined,
+          isActive: false,
+        },
+        {
+          href: 'version/3',
+          text: 'version 3 abcdef3',
+          createdAt: undefined,
+          isActive: false,
+        },
+      ]);
+    });
+  });
+});
diff --git a/spec/frontend/diffs/components/compare_versions_dropdown_spec.js b/spec/frontend/diffs/components/compare_versions_dropdown_spec.js
deleted file mode 100644
index 5033bdd9044..00000000000
--- a/spec/frontend/diffs/components/compare_versions_dropdown_spec.js
+++ /dev/null
@@ -1,179 +0,0 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils';
-import CompareVersionsDropdown from '~/diffs/components/compare_versions_dropdown.vue';
-import diffsMockData from '../mock_data/merge_request_diffs';
-import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue';
-import { TEST_HOST } from 'helpers/test_constants';
-
-const localVue = createLocalVue();
-const targetBranch = { branchName: 'tmp-wine-dev', versionIndex: -1 };
-const startVersion = { version_index: 4 };
-const mergeRequestVersion = {
-  version_path: '123',
-};
-const baseVersionPath = '/gnuwget/wget2/-/merge_requests/6/diffs?diff_id=37';
-
-describe('CompareVersionsDropdown', () => {
-  let wrapper;
-
-  const findSelectedVersion = () => wrapper.find('.dropdown-menu-toggle');
-  const findVersionsListElements = () => wrapper.findAll('li');
-  const findLinkElement = index =>
-    findVersionsListElements()
-      .at(index)
-      .find('a');
-  const findLastLink = () => findLinkElement(findVersionsListElements().length - 1);
-
-  const createComponent = (props = {}) => {
-    wrapper = shallowMount(localVue.extend(CompareVersionsDropdown), {
-      localVue,
-      propsData: { ...props },
-    });
-  };
-
-  afterEach(() => {
-    wrapper.destroy();
-  });
-
-  describe('selected version name', () => {
-    it('shows latest version when latest is selected', () => {
-      createComponent({
-        mergeRequestVersion,
-        startVersion,
-        otherVersions: diffsMockData,
-      });
-
-      expect(findSelectedVersion().text()).toBe('latest version');
-    });
-
-    it('shows target branch name for base branch', () => {
-      createComponent({
-        targetBranch,
-      });
-
-      expect(findSelectedVersion().text()).toBe('tmp-wine-dev');
-    });
-
-    it('shows correct version for non-base and non-latest branches', () => {
-      createComponent({
-        startVersion,
-        targetBranch,
-      });
-
-      expect(findSelectedVersion().text()).toBe(`version ${startVersion.version_index}`);
-    });
-  });
-
-  describe('target versions list', () => {
-    it('should have the same length as otherVersions if merge request version is present', () => {
-      createComponent({
-        mergeRequestVersion,
-        otherVersions: diffsMockData,
-      });
-
-      expect(findVersionsListElements().length).toEqual(diffsMockData.length);
-    });
-
-    it('should have an otherVersions length plus 1 if no merge request version is present', () => {
-      createComponent({
-        targetBranch,
-        otherVersions: diffsMockData,
-      });
-
-      expect(findVersionsListElements().length).toEqual(diffsMockData.length + 1);
-    });
-
-    it('should have base branch link as active on base branch', () => {
-      createComponent({
-        targetBranch,
-        otherVersions: diffsMockData,
-      });
-
-      expect(findLastLink().classes()).toContain('is-active');
-    });
-
-    it('should have correct branch link as active if start version present', () => {
-      createComponent({
-        targetBranch,
-        startVersion,
-        otherVersions: diffsMockData,
-      });
-
-      expect(findLinkElement(0).classes()).toContain('is-active');
-    });
-
-    it('should render a correct base version link', () => {
-      createComponent({
-        baseVersionPath,
-        otherVersions: diffsMockData.slice(1),
-        targetBranch,
-      });
-
-      expect(findLastLink().attributes('href')).toEqual(baseVersionPath);
-      expect(findLastLink().text()).toContain('(base)');
-      expect(findLastLink().text()).not.toContain('(HEAD)');
-    });
-
-    it('should render a correct head version link', () => {
-      Object.defineProperty(window, 'location', {
-        writable: true,
-        value: { href: `${TEST_HOST}?diff_head=true` },
-      });
-
-      createComponent({
-        baseVersionPath,
-        otherVersions: diffsMockData.slice(1),
-        targetBranch,
-      });
-
-      expect(findLastLink().attributes('href')).toEqual(baseVersionPath);
-      expect(findLastLink().text()).not.toContain('(base)');
-      expect(findLastLink().text()).toContain('(HEAD)');
-    });
-
-    it('should not render commits count if no showCommitsCount is passed', () => {
-      createComponent({
-        otherVersions: diffsMockData,
-        targetBranch,
-      });
-
-      const commitsCount = diffsMockData[0].commits_count;
-
-      expect(findLinkElement(0).text()).not.toContain(`${commitsCount} commit`);
-    });
-
-    it('should render correct commits count if showCommitsCount is passed', () => {
-      createComponent({
-        otherVersions: diffsMockData,
-        targetBranch,
-        showCommitCount: true,
-      });
-
-      const commitsCount = diffsMockData[0].commits_count;
-
-      expect(findLinkElement(0).text()).toContain(`${commitsCount} commit`);
-    });
-
-    it('should render correct commit sha', () => {
-      createComponent({
-        otherVersions: diffsMockData,
-        targetBranch,
-      });
-
-      const commitShaElement = findLinkElement(0).find('.commit-sha');
-
-      expect(commitShaElement.text()).toBe(diffsMockData[0].short_commit_sha);
-    });
-
-    it('should render correct time-ago ', () => {
-      createComponent({
-        otherVersions: diffsMockData,
-        targetBranch,
-      });
-
-      const timeAgoElement = findLinkElement(0).find(TimeAgo);
-
-      expect(timeAgoElement.exists()).toBe(true);
-      expect(timeAgoElement.props('time')).toBe(diffsMockData[0].created_at);
-    });
-  });
-});
diff --git a/spec/frontend/diffs/components/compare_versions_spec.js b/spec/frontend/diffs/components/compare_versions_spec.js
index ff92a12eaf6..7f69a6344c1 100644
--- a/spec/frontend/diffs/components/compare_versions_spec.js
+++ b/spec/frontend/diffs/components/compare_versions_spec.js
@@ -12,23 +12,25 @@ localVue.use(Vuex);
 
 describe('CompareVersions', () => {
   let wrapper;
-  const targetBranch = { branchName: 'tmp-wine-dev', versionIndex: -1 };
+  const targetBranchName = 'tmp-wine-dev';
 
   const createWrapper = props => {
     const store = createStore();
+    const mergeRequestDiff = diffsMockData[0];
 
     store.state.diffs.addedLines = 10;
     store.state.diffs.removedLines = 20;
     store.state.diffs.diffFiles.push('test');
+    store.state.diffs.targetBranchName = targetBranchName;
+    store.state.diffs.mergeRequestDiff = mergeRequestDiff;
+    store.state.diffs.mergeRequestDiffs = diffsMockData;
 
     wrapper = mount(CompareVersionsComponent, {
       localVue,
       store,
       propsData: {
         mergeRequestDiffs: diffsMockData,
-        mergeRequestDiff: diffsMockData[0],
         diffFilesLength: 0,
-        targetBranch,
         ...props,
       },
     });
@@ -59,7 +61,7 @@ describe('CompareVersions', () => {
       expect(sourceDropdown.exists()).toBe(true);
       expect(targetDropdown.exists()).toBe(true);
       expect(sourceDropdown.find('a span').html()).toContain('latest version');
-      expect(targetDropdown.find('a span').html()).toContain(targetBranch.branchName);
+      expect(targetDropdown.find('a span').html()).toContain(targetBranchName);
     });
 
     it('should not render comparison dropdowns if no mergeRequestDiffs are specified', () => {
@@ -119,21 +121,6 @@ describe('CompareVersions', () => {
     });
   });
 
-  describe('comparableDiffs', () => {
-    it('should not contain the first item in the mergeRequestDiffs property', () => {
-      const { comparableDiffs } = wrapper.vm;
-      const comparableDiffsMock = diffsMockData.slice(1);
-
-      expect(comparableDiffs).toEqual(comparableDiffsMock);
-    });
-  });
-
-  describe('baseVersionPath', () => {
-    it('should be set correctly from mergeRequestDiff', () => {
-      expect(wrapper.vm.baseVersionPath).toEqual(wrapper.vm.mergeRequestDiff.base_version_path);
-    });
-  });
-
   describe('commit', () => {
     beforeEach(done => {
       wrapper.vm.$store.state.diffs.commit = getDiffWithCommit().commit;
diff --git a/spec/frontend/diffs/store/getters_versions_dropdowns_spec.js b/spec/frontend/diffs/store/getters_versions_dropdowns_spec.js
new file mode 100644
index 00000000000..3e5ba66d5e4
--- /dev/null
+++ b/spec/frontend/diffs/store/getters_versions_dropdowns_spec.js
@@ -0,0 +1,100 @@
+import * as getters from '~/diffs/store/getters';
+import state from '~/diffs/store/modules/diff_state';
+import { DIFF_COMPARE_BASE_VERSION_INDEX } from '~/diffs/constants';
+import diffsMockData from '../mock_data/merge_request_diffs';
+
+describe('Compare diff version dropdowns', () => {
+  let localState;
+
+  beforeEach(() => {
+    localState = state();
+    localState.mergeRequestDiff = {
+      base_version_path: 'basePath',
+      head_version_path: 'headPath',
+      version_index: 1,
+    };
+    localState.targetBranchName = 'baseVersion';
+    localState.mergeRequestDiffs = diffsMockData;
+  });
+
+  describe('selectedTargetIndex', () => {
+    it('without startVersion', () => {
+      expect(getters.selectedTargetIndex(localState)).toEqual(DIFF_COMPARE_BASE_VERSION_INDEX);
+    });
+
+    it('with startVersion', () => {
+      const startVersion = { version_index: 1 };
+      localState.startVersion = startVersion;
+      expect(getters.selectedTargetIndex(localState)).toEqual(startVersion.version_index);
+    });
+  });
+
+  it('selectedSourceIndex', () => {
+    expect(getters.selectedSourceIndex(localState)).toEqual(
+      localState.mergeRequestDiff.version_index,
+    );
+  });
+
+  describe('diffCompareDropdownTargetVersions', () => {
+    // diffCompareDropdownTargetVersions slices the array at the first position
+    // and appends a "base" version which is why we use diffsMockData[1] below
+    // This is to display "base" at the end of the target dropdown
+    const expectedFirstVersion = {
+      ...diffsMockData[1],
+      href: expect.any(String),
+      versionName: expect.any(String),
+    };
+
+    const expectedBaseVersion = {
+      versionName: 'baseVersion',
+      version_index: DIFF_COMPARE_BASE_VERSION_INDEX,
+      href: 'basePath',
+      isBase: true,
+    };
+
+    it('base version selected', () => {
+      expectedFirstVersion.selected = false;
+      expectedBaseVersion.selected = true;
+
+      const targetVersions = getters.diffCompareDropdownTargetVersions(localState, {
+        selectedTargetIndex: DIFF_COMPARE_BASE_VERSION_INDEX,
+      });
+
+      const lastVersion = targetVersions[targetVersions.length - 1];
+      expect(targetVersions[0]).toEqual(expectedFirstVersion);
+      expect(lastVersion).toEqual(expectedBaseVersion);
+    });
+
+    it('first version selected', () => {
+      expectedFirstVersion.selected = true;
+      expectedBaseVersion.selected = false;
+
+      localState.startVersion = expectedFirstVersion;
+
+      const targetVersions = getters.diffCompareDropdownTargetVersions(localState, {
+        selectedTargetIndex: expectedFirstVersion.version_index,
+      });
+
+      const lastVersion = targetVersions[targetVersions.length - 1];
+      expect(targetVersions[0]).toEqual(expectedFirstVersion);
+      expect(lastVersion).toEqual(expectedBaseVersion);
+    });
+  });
+
+  it('diffCompareDropdownSourceVersions', () => {
+    const firstDiff = localState.mergeRequestDiffs[0];
+    const expectedShape = {
+      ...firstDiff,
+      href: firstDiff.version_path,
+      commitsText: `${firstDiff.commits_count} commits,`,
+      versionName: 'latest version',
+      selected: true,
+    };
+
+    const sourceVersions = getters.diffCompareDropdownSourceVersions(localState, {
+      selectedSourceIndex: expectedShape.version_index,
+    });
+    expect(sourceVersions[0]).toEqual(expectedShape);
+    expect(sourceVersions[1].selected).toBe(false);
+  });
+});
diff --git a/spec/frontend/notes/components/note_header_spec.js b/spec/frontend/notes/components/note_header_spec.js
index 6544ad3e1fe..642ab5138dc 100644
--- a/spec/frontend/notes/components/note_header_spec.js
+++ b/spec/frontend/notes/components/note_header_spec.js
@@ -1,6 +1,7 @@
 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import NoteHeader from '~/notes/components/note_header.vue';
+import GitlabTeamMemberBadge from '~/vue_shared/components/user_avatar/badges/gitlab_team_member_badge.vue';
 
 const localVue = createLocalVue();
 localVue.use(Vuex);
@@ -17,6 +18,15 @@ describe('NoteHeader component', () => {
   const findActionText = () => wrapper.find({ ref: 'actionText' });
   const findTimestamp = () => wrapper.find({ ref: 'noteTimestamp' });
 
+  const author = {
+    avatar_url: null,
+    id: 1,
+    name: 'Root',
+    path: '/root',
+    state: 'active',
+    username: 'root',
+  };
+
   const createComponent = props => {
     wrapper = shallowMount(NoteHeader, {
       localVue,
@@ -83,16 +93,7 @@ describe('NoteHeader component', () => {
   });
 
   it('renders an author link if author is passed to props', () => {
-    createComponent({
-      author: {
-        avatar_url: null,
-        id: 1,
-        name: 'Root',
-        path: '/root',
-        state: 'active',
-        username: 'root',
-      },
-    });
+    createComponent({ author });
 
     expect(wrapper.find('.js-user-link').exists()).toBe(true);
   });
@@ -138,4 +139,18 @@ describe('NoteHeader component', () => {
       expect(actions.setTargetNoteHash).toHaveBeenCalled();
     });
   });
+
+  test.each`
+    props                                                   | expected | message1            | message2
+    ${{ author: { ...author, is_gitlab_employee: true } }}  | ${true}  | ${'renders'}        | ${'true'}
+    ${{ author: { ...author, is_gitlab_employee: false } }} | ${false} | ${"doesn't render"} | ${'false'}
+    ${{ author }}                                           | ${false} | ${"doesn't render"} | ${'undefined'}
+  `(
+    '$message1 GitLab team member badge when `is_gitlab_employee` is $message2',
+    ({ props, expected }) => {
+      createComponent(props);
+
+      expect(wrapper.find(GitlabTeamMemberBadge).exists()).toBe(expected);
+    },
+  );
 });