1 files changed, 15 insertions, 18 deletions

diff --git a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/labels_select_root_spec.js b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/labels_select_root_spec.js
index 4b0ba075eda..31819d0e2f7 100644
--- a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/labels_select_root_spec.js
+++ b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/labels_select_root_spec.js
@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import Vue from 'vue';
+import Vue, { nextTick } from 'vue';
 import Vuex from 'vuex';
 
 import { isInViewport } from '~/lib/utils/common_utils';
@@ -139,27 +139,26 @@ describe('LabelsSelectRoot', () => {
       ${'embedded'}   | ${'is-embedded'}
     `(
       'renders component root element with CSS class `$cssClass` when `state.variant` is "$variant"',
-      ({ variant, cssClass }) => {
+      async ({ variant, cssClass }) => {
         createComponent({
           ...mockConfig,
           variant,
         });
 
-        return wrapper.vm.$nextTick(() => {
-          expect(wrapper.classes()).toContain(cssClass);
-        });
+        await nextTick();
+        expect(wrapper.classes()).toContain(cssClass);
       },
     );
 
     it('renders `dropdown-value-collapsed` component when `allowLabelCreate` prop is `true`', async () => {
       createComponent();
-      await wrapper.vm.$nextTick;
+      await nextTick;
       expect(wrapper.find(DropdownValueCollapsed).exists()).toBe(true);
     });
 
     it('renders `dropdown-title` component', async () => {
       createComponent();
-      await wrapper.vm.$nextTick;
+      await nextTick;
       expect(wrapper.find(DropdownTitle).exists()).toBe(true);
     });
 
@@ -167,7 +166,7 @@ describe('LabelsSelectRoot', () => {
       createComponent(mockConfig, {
         default: 'None',
       });
-      await wrapper.vm.$nextTick;
+      await nextTick;
 
       const valueComp = wrapper.find(DropdownValue);
 
@@ -178,14 +177,14 @@ describe('LabelsSelectRoot', () => {
     it('renders `dropdown-button` component when `showDropdownButton` prop is `true`', async () => {
       createComponent();
       wrapper.vm.$store.dispatch('toggleDropdownButton');
-      await wrapper.vm.$nextTick;
+      await nextTick;
       expect(wrapper.find(DropdownButton).exists()).toBe(true);
     });
 
     it('renders `dropdown-contents` component when `showDropdownButton` & `showDropdownContents` prop is `true`', async () => {
       createComponent();
       wrapper.vm.$store.dispatch('toggleDropdownContents');
-      await wrapper.vm.$nextTick;
+      await nextTick;
       expect(wrapper.find(DropdownContents).exists()).toBe(true);
     });
 
@@ -198,22 +197,20 @@ describe('LabelsSelectRoot', () => {
             wrapper.vm.$store.dispatch('toggleDropdownContents');
           });
 
-          it('set direction when out of viewport', () => {
+          it('set direction when out of viewport', async () => {
             isInViewport.mockImplementation(() => false);
             wrapper.vm.setContentIsOnViewport(wrapper.vm.$store.state);
 
-            return wrapper.vm.$nextTick().then(() => {
-              expect(wrapper.find(DropdownContents).props('renderOnTop')).toBe(true);
-            });
+            await nextTick();
+            expect(wrapper.find(DropdownContents).props('renderOnTop')).toBe(true);
           });
 
-          it('does not set direction when inside of viewport', () => {
+          it('does not set direction when inside of viewport', async () => {
             isInViewport.mockImplementation(() => true);
             wrapper.vm.setContentIsOnViewport(wrapper.vm.$store.state);
 
-            return wrapper.vm.$nextTick().then(() => {
-              expect(wrapper.find(DropdownContents).props('renderOnTop')).toBe(false);
-            });
+            await nextTick();
+            expect(wrapper.find(DropdownContents).props('renderOnTop')).toBe(false);
           });
         },
       );