Add latest changes from gitlab-org/gitlab@14-8-stable-eev14.8.0-rc42

3 files changed, 28 insertions, 24 deletions

diff --git a/spec/frontend/admin/users/components/modals/delete_user_modal_spec.js b/spec/frontend/admin/users/components/modals/delete_user_modal_spec.js
index 025ae825e0d..f875cd24ee1 100644
--- a/spec/frontend/admin/users/components/modals/delete_user_modal_spec.js
+++ b/spec/frontend/admin/users/components/modals/delete_user_modal_spec.js
@@ -1,5 +1,6 @@
 import { GlButton, GlFormInput, GlSprintf } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
+import { nextTick } from 'vue';
 import DeleteUserModal from '~/admin/users/components/modals/delete_user_modal.vue';
 import UserDeletionObstaclesList from '~/vue_shared/components/user_deletion_obstacles/user_deletion_obstacles_list.vue';
 import ModalStub from './stubs/modal_stub';
@@ -82,11 +83,11 @@ describe('User Operation confirmation modal', () => {
   });
 
   describe('with incorrect username', () => {
-    beforeEach(() => {
+    beforeEach(async () => {
       createComponent();
       setUsername(badUsername);
 
-      return wrapper.vm.$nextTick();
+      await nextTick();
     });
 
     it('shows incorrect username', () => {
@@ -100,11 +101,11 @@ describe('User Operation confirmation modal', () => {
   });
 
   describe('with correct username', () => {
-    beforeEach(() => {
+    beforeEach(async () => {
       createComponent();
       setUsername(username);
 
-      return wrapper.vm.$nextTick();
+      await nextTick();
     });
 
     it('shows correct username', () => {
@@ -117,10 +118,10 @@ describe('User Operation confirmation modal', () => {
     });
 
     describe('when primary action is submitted', () => {
-      beforeEach(() => {
+      beforeEach(async () => {
         findPrimaryButton().vm.$emit('click');
 
-        return wrapper.vm.$nextTick();
+        await nextTick();
       });
 
       it('clears the input', () => {
@@ -136,10 +137,10 @@ describe('User Operation confirmation modal', () => {
     });
 
     describe('when secondary action is submitted', () => {
-      beforeEach(() => {
+      beforeEach(async () => {
         findSecondaryButton().vm.$emit('click');
 
-        return wrapper.vm.$nextTick();
+        await nextTick();
       });
 
       it('has correct form attributes and calls submit', () => {
@@ -168,7 +169,7 @@ describe('User Operation confirmation modal', () => {
     it("shows enabled buttons when user's name is entered without whitespace", async () => {
       setUsername('John Smith');
 
-      await wrapper.vm.$nextTick();
+      await nextTick();
 
       expect(findPrimaryButton().attributes('disabled')).toBeUndefined();
       expect(findSecondaryButton().attributes('disabled')).toBeUndefined();
diff --git a/spec/frontend/admin/users/components/modals/user_modal_manager_spec.js b/spec/frontend/admin/users/components/modals/user_modal_manager_spec.js
index 65ce242662b..4786357faa1 100644
--- a/spec/frontend/admin/users/components/modals/user_modal_manager_spec.js
+++ b/spec/frontend/admin/users/components/modals/user_modal_manager_spec.js
@@ -1,4 +1,5 @@
 import { mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
 import UserModalManager from '~/admin/users/components/modals/user_modal_manager.vue';
 import ModalStub from './stubs/modal_stub';
 
@@ -50,20 +51,19 @@ describe('Users admin page Modal Manager', () => {
       expect(() => wrapper.vm.show({ glModalAction: 'action1' })).toThrow();
     });
 
-    it('renders modal with expected props when valid configuration is passed', () => {
+    it('renders modal with expected props when valid configuration is passed', async () => {
       createComponent();
       wrapper.vm.show({
         glModalAction: 'action1',
         extraProp: 'extraPropValue',
       });
 
-      return wrapper.vm.$nextTick().then(() => {
-        const modal = findModal();
-        expect(modal.exists()).toBeTruthy();
-        expect(modal.vm.$attrs.csrfToken).toEqual('dummyCSRF');
-        expect(modal.vm.$attrs.extraProp).toEqual('extraPropValue');
-        expect(modal.vm.showWasCalled).toBeTruthy();
-      });
+      await nextTick();
+      const modal = findModal();
+      expect(modal.exists()).toBeTruthy();
+      expect(modal.vm.$attrs.csrfToken).toEqual('dummyCSRF');
+      expect(modal.vm.$attrs.extraProp).toEqual('extraPropValue');
+      expect(modal.vm.showWasCalled).toBeTruthy();
     });
   });
 
@@ -101,7 +101,7 @@ describe('Users admin page Modal Manager', () => {
     it('renders the modal when the button is clicked', async () => {
       button.click();
 
-      await wrapper.vm.$nextTick();
+      await nextTick();
 
       expect(findModal().exists()).toBe(true);
     });
@@ -110,7 +110,7 @@ describe('Users admin page Modal Manager', () => {
       button.removeAttribute('data-gl-modal-action');
       button.click();
 
-      await wrapper.vm.$nextTick();
+      await nextTick();
 
       expect(findModal().exists()).toBe(false);
     });
@@ -118,7 +118,7 @@ describe('Users admin page Modal Manager', () => {
     it('does not render the modal when a button without the selector class is clicked', async () => {
       button2.click();
 
-      await wrapper.vm.$nextTick();
+      await nextTick();
 
       expect(findModal().exists()).toBe(false);
     });
diff --git a/spec/frontend/admin/users/components/users_table_spec.js b/spec/frontend/admin/users/components/users_table_spec.js
index 9ff5961c7ec..ad1c45495b5 100644
--- a/spec/frontend/admin/users/components/users_table_spec.js
+++ b/spec/frontend/admin/users/components/users_table_spec.js
@@ -3,6 +3,7 @@ import Vue from 'vue';
 import VueApollo from 'vue-apollo';
 
 import createMockApollo from 'helpers/mock_apollo_helper';
+import waitForPromises from 'helpers/wait_for_promises';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 
 import AdminUserActions from '~/admin/users/components/user_actions.vue';
@@ -106,8 +107,9 @@ describe('AdminUsersTable component', () => {
     });
 
     describe('when the data has been fetched', () => {
-      beforeEach(() => {
+      beforeEach(async () => {
         initComponent();
+        await waitForPromises();
       });
 
       it("renders the user's group count", () => {
@@ -115,8 +117,9 @@ describe('AdminUsersTable component', () => {
       });
 
       describe("and a user's group count is null", () => {
-        beforeEach(() => {
+        beforeEach(async () => {
           initComponent({}, createFetchGroupCount([{ id: user.id, groupCount: null }]));
+          await waitForPromises();
         });
 
         it("renders the user's group count as 0", () => {
@@ -126,12 +129,12 @@ describe('AdminUsersTable component', () => {
     });
 
     describe('when there is an error while fetching the data', () => {
-      beforeEach(() => {
+      beforeEach(async () => {
         initComponent({}, fetchGroupCountsError);
+        await waitForPromises();
       });
 
       it('creates a flash message and captures the error', () => {
-        expect(createFlash).toHaveBeenCalledTimes(1);
         expect(createFlash).toHaveBeenCalledWith({
           message: 'Could not load user group counts. Please refresh the page to try again.',
           captureError: true,