1 files changed, 35 insertions, 13 deletions

diff --git a/spec/frontend/projects/compare/components/revision_dropdown_spec.js b/spec/frontend/projects/compare/components/revision_dropdown_spec.js
index db4a1158996..1cf99f16601 100644
--- a/spec/frontend/projects/compare/components/revision_dropdown_spec.js
+++ b/spec/frontend/projects/compare/components/revision_dropdown_spec.js
@@ -2,13 +2,14 @@ import { GlDropdown, GlDropdownItem, GlSearchBoxByType } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import AxiosMockAdapter from 'axios-mock-adapter';
 import { nextTick } from 'vue';
-import { createAlert } from '~/flash';
+import waitForPromises from 'helpers/wait_for_promises';
+import { createAlert } from '~/alert';
 import axios from '~/lib/utils/axios_utils';
 import { HTTP_STATUS_NOT_FOUND, HTTP_STATUS_OK } from '~/lib/utils/http_status';
 import RevisionDropdown from '~/projects/compare/components/revision_dropdown.vue';
 import { revisionDropdownDefaultProps as defaultProps } from './mock_data';
 
-jest.mock('~/flash');
+jest.mock('~/alert');
 
 describe('RevisionDropdown component', () => {
   let wrapper;
@@ -32,12 +33,15 @@ describe('RevisionDropdown component', () => {
   });
 
   afterEach(() => {
-    wrapper.destroy();
     axiosMock.restore();
   });
 
   const findGlDropdown = () => wrapper.findComponent(GlDropdown);
   const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
+  const findBranchesDropdownItem = () =>
+    wrapper.findAllComponents('[data-testid="branches-dropdown-item"]');
+  const findTagsDropdownItem = () =>
+    wrapper.findAllComponents('[data-testid="tags-dropdown-item"]');
 
   it('sets hidden input', () => {
     createComponent();
@@ -57,17 +61,29 @@ describe('RevisionDropdown component', () => {
 
     createComponent();
 
-    await axios.waitForAll();
-    expect(wrapper.vm.branches).toEqual(Branches);
-    expect(wrapper.vm.tags).toEqual(Tags);
+    expect(findBranchesDropdownItem()).toHaveLength(0);
+    expect(findTagsDropdownItem()).toHaveLength(0);
+
+    await waitForPromises();
+
+    expect(findBranchesDropdownItem()).toHaveLength(Branches.length);
+    expect(findTagsDropdownItem()).toHaveLength(Tags.length);
+
+    Branches.forEach((branch, index) => {
+      expect(findBranchesDropdownItem().at(index).text()).toBe(branch);
+    });
+
+    Tags.forEach((tag, index) => {
+      expect(findTagsDropdownItem().at(index).text()).toBe(tag);
+    });
   });
 
-  it('shows flash message on error', async () => {
+  it('shows an alert on error', async () => {
     axiosMock.onGet('some/invalid/path').replyOnce(HTTP_STATUS_NOT_FOUND);
 
     createComponent();
+    await waitForPromises();
 
-    await wrapper.vm.fetchBranchesAndTags();
     expect(createAlert).toHaveBeenCalled();
   });
 
@@ -83,17 +99,17 @@ describe('RevisionDropdown component', () => {
       refsProjectPath: newRefsProjectPath,
     });
 
-    await axios.waitForAll();
+    await waitForPromises();
     expect(axios.get).toHaveBeenLastCalledWith(newRefsProjectPath);
   });
 
   describe('search', () => {
-    it('shows flash message on error', async () => {
+    it('shows alert on error', async () => {
       axiosMock.onGet('some/invalid/path').replyOnce(HTTP_STATUS_NOT_FOUND);
 
       createComponent();
+      await waitForPromises();
 
-      await wrapper.vm.searchBranchesAndTags();
       expect(createAlert).toHaveBeenCalled();
     });
 
@@ -108,7 +124,7 @@ describe('RevisionDropdown component', () => {
       const mockSearchTerm = 'foobar';
       createComponent();
       findSearchBox().vm.$emit('input', mockSearchTerm);
-      await axios.waitForAll();
+      await waitForPromises();
 
       expect(axios.get).toHaveBeenCalledWith(
         defaultProps.refsProjectPath,
@@ -141,8 +157,14 @@ describe('RevisionDropdown component', () => {
   });
 
   it('emits `selectRevision` event when another revision is selected', async () => {
+    jest.spyOn(axios, 'get').mockResolvedValue({
+      data: {
+        Branches: ['some-branch'],
+        Tags: [],
+      },
+    });
+
     createComponent();
-    wrapper.vm.branches = ['some-branch'];
     await nextTick();
 
     findGlDropdown().findAllComponents(GlDropdownItem).at(0).vm.$emit('click');