1 files changed, 50 insertions, 11 deletions

diff --git a/spec/frontend/vue_shared/components/user_select_spec.js b/spec/frontend/vue_shared/components/user_select_spec.js
index 411a15e1c74..cb476910944 100644
--- a/spec/frontend/vue_shared/components/user_select_spec.js
+++ b/spec/frontend/vue_shared/components/user_select_spec.js
@@ -1,4 +1,4 @@
-import { GlSearchBoxByType, GlDropdown } from '@gitlab/ui';
+import { GlSearchBoxByType } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import { cloneDeep } from 'lodash';
 import Vue, { nextTick } from 'vue';
@@ -6,11 +6,14 @@ import VueApollo from 'vue-apollo';
 import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import searchUsersQuery from '~/graphql_shared/queries/users_search.query.graphql';
-import { ASSIGNEES_DEBOUNCE_DELAY } from '~/sidebar/constants';
+import searchUsersQueryOnMR from '~/graphql_shared/queries/users_search_with_mr_permissions.graphql';
+import { IssuableType } from '~/issues/constants';
+import { DEFAULT_DEBOUNCE_AND_THROTTLE_MS } from '~/lib/utils/constants';
 import getIssueParticipantsQuery from '~/vue_shared/components/sidebar/queries/get_issue_participants.query.graphql';
 import UserSelect from '~/vue_shared/components/user_select/user_select.vue';
 import {
   searchResponse,
+  searchResponseOnMR,
   projectMembersResponse,
   participantsQueryResponse,
 } from '../../sidebar/mock_data';
@@ -28,7 +31,7 @@ const assignee = {
 const mockError = jest.fn().mockRejectedValue('Error!');
 
 const waitForSearch = async () => {
-  jest.advanceTimersByTime(ASSIGNEES_DEBOUNCE_DELAY);
+  jest.advanceTimersByTime(DEFAULT_DEBOUNCE_AND_THROTTLE_MS);
   await nextTick();
   await waitForPromises();
 };
@@ -58,6 +61,7 @@ describe('User select dropdown', () => {
   } = {}) => {
     fakeApollo = createMockApollo([
       [searchUsersQuery, searchQueryHandler],
+      [searchUsersQueryOnMR, jest.fn().mockResolvedValue(searchResponseOnMR)],
       [getIssueParticipantsQuery, participantsQueryHandler],
     ]);
     wrapper = shallowMount(UserSelect, {
@@ -76,7 +80,18 @@ describe('User select dropdown', () => {
         ...props,
       },
       stubs: {
-        GlDropdown,
+        GlDropdown: {
+          template: `
+            <div>
+              <slot name="header"></slot>
+              <slot></slot>
+              <slot name="footer"></slot>
+            </div>
+          `,
+          methods: {
+            hide: jest.fn(),
+          },
+        },
       },
     });
   };
@@ -132,11 +147,19 @@ describe('User select dropdown', () => {
     expect(findSelectedParticipants()).toHaveLength(1);
   });
 
+  it('does not render a `Cannot merge` tooltip', async () => {
+    createComponent();
+    await waitForPromises();
+
+    expect(findUnselectedParticipants().at(0).attributes('title')).toBe('');
+  });
+
   describe('when search is empty', () => {
     it('renders a merged list of participants and project members', async () => {
       createComponent();
       await waitForPromises();
-      expect(findUnselectedParticipants()).toHaveLength(3);
+
+      expect(findUnselectedParticipants()).toHaveLength(4);
     });
 
     it('renders `Unassigned` link with the checkmark when there are no selected users', async () => {
@@ -162,7 +185,7 @@ describe('User select dropdown', () => {
         },
       });
       await waitForPromises();
-      findUnassignLink().vm.$emit('click');
+      findUnassignLink().trigger('click');
 
       expect(wrapper.emitted('input')).toEqual([[[]]]);
     });
@@ -175,7 +198,7 @@ describe('User select dropdown', () => {
       });
       await waitForPromises();
 
-      findSelectedParticipants().at(0).vm.$emit('click', new Event('click'));
+      findSelectedParticipants().at(0).trigger('click');
       expect(wrapper.emitted('input')).toEqual([[[]]]);
     });
 
@@ -187,8 +210,9 @@ describe('User select dropdown', () => {
       });
       await waitForPromises();
 
-      findUnselectedParticipants().at(0).vm.$emit('click');
-      expect(wrapper.emitted('input')).toEqual([
+      findUnselectedParticipants().at(0).trigger('click');
+
+      expect(wrapper.emitted('input')).toMatchObject([
         [
           [
             {
@@ -214,7 +238,7 @@ describe('User select dropdown', () => {
       });
       await waitForPromises();
 
-      findUnselectedParticipants().at(0).vm.$emit('click');
+      findUnselectedParticipants().at(0).trigger('click');
       expect(wrapper.emitted('input')[0][0]).toHaveLength(2);
     });
   });
@@ -232,7 +256,7 @@ describe('User select dropdown', () => {
       createComponent();
       await waitForPromises();
       findSearchField().vm.$emit('input', 'roo');
-      jest.advanceTimersByTime(ASSIGNEES_DEBOUNCE_DELAY);
+      jest.advanceTimersByTime(DEFAULT_DEBOUNCE_AND_THROTTLE_MS);
       await nextTick();
 
       expect(findParticipantsLoading().exists()).toBe(true);
@@ -273,4 +297,19 @@ describe('User select dropdown', () => {
       expect(findEmptySearchResults().exists()).toBe(true);
     });
   });
+
+  describe('when on merge request sidebar', () => {
+    beforeEach(() => {
+      createComponent({ props: { issuableType: IssuableType.MergeRequest, issuableId: 1 } });
+      return waitForPromises();
+    });
+
+    it('does not render a `Cannot merge` tooltip for a user that has merge permission', () => {
+      expect(findUnselectedParticipants().at(0).attributes('title')).toBe('');
+    });
+
+    it('renders a `Cannot merge` tooltip for a user that does not have merge permission', () => {
+      expect(findUnselectedParticipants().at(1).attributes('title')).toBe('Cannot merge');
+    });
+  });
 });