Add latest changes from gitlab-org/gitlab@master

spec/frontend/clusters/components/knative_domain_editor_spec.js

@@ -25,6 +25,7 @@ describe('KnativeDomainEditor', () => {
 
   afterEach(() => {
     wrapper.destroy();
+    wrapper = null;
   });
 
   describe('knative has an assigned IP address', () => {
@@ -101,13 +102,17 @@ describe('KnativeDomainEditor', () => {
 
   describe('when knative domain name input changes', () => {
     it('emits "set" event with updated domain name', () => {
+      createComponent({ knative });
+
       const newHostname = 'newhostname.com';
 
       wrapper.setData({ knativeHostname: newHostname });
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('set')[0]).toEqual([newHostname]);
       });
     });
+  });
 
   describe('when updating knative domain name failed', () => {
     beforeEach(() => {

spec/frontend/create_cluster/eks_cluster/components/cluster_form_dropdown_spec.js

@@ -61,10 +61,15 @@ describe('ClusterFormDropdown', () => {
 
     beforeEach(() => {
       vm.setProps({ items, multiple: true, value });
-      return vm.vm.$nextTick().then(() => {
+      return vm.vm
+        .$nextTick()
+        .then(() => {
           vm.findAll('.js-dropdown-item')
             .at(0)
             .trigger('click');
+          return vm.vm.$nextTick();
+        })
+        .then(() => {
           vm.findAll('.js-dropdown-item')
             .at(1)
             .trigger('click');
@@ -198,9 +203,11 @@ describe('ClusterFormDropdown', () => {
     vm.setProps({ items });
     vm.setData({ searchQuery });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.findAll('.js-dropdown-item').length).toEqual(1);
       expect(vm.find('.js-dropdown-item').text()).toEqual(secondItem.name);
     });
+  });
 
   it('focuses dropdown search input when dropdown is displayed', () => {
     const dropdownEl = vm.find('.dropdown').element;

spec/frontend/create_cluster/eks_cluster/components/service_credentials_form_spec.js

@@ -72,8 +72,10 @@ describe('ServiceCredentialsForm', () => {
   it('enables submit button when role ARN is not provided', () => {
     vm.setData({ roleArn: '123' });
 
+    return vm.vm.$nextTick().then(() => {
       expect(findSubmitButton().attributes('disabled')).toBeFalsy();
     });
+  });
 
   it('dispatches createRole action when form is submitted', () => {
     findForm().trigger('submit');
@@ -86,6 +88,8 @@ describe('ServiceCredentialsForm', () => {
       vm.setData({ roleArn: '123' }); // set role ARN to enable button
 
       state.isCreatingRole = true;
+
+      return vm.vm.$nextTick();
     });
 
     it('disables submit button', () => {

spec/frontend/cycle_analytics/stage_nav_item_spec.js

@@ -92,9 +92,11 @@ describe('StageNavItem', () => {
     it('emits the `select` event when clicked', () => {
       expect(wrapper.emitted().select).toBeUndefined();
       wrapper.trigger('click');
+      return wrapper.vm.$nextTick(() => {
         expect(wrapper.emitted().select.length).toBe(1);
       });
     });
+  });
 
   describe('User does not have access', () => {
     beforeEach(() => {

spec/frontend/diffs/components/diff_file_header_spec.js

@@ -117,8 +117,11 @@ describe('DiffFileHeader component', () => {
   it('when header is clicked emits toggleFile', () => {
     createComponent();
     findHeader().trigger('click');
+
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().toggleFile).toBeDefined();
     });
+  });
 
   it('when collapseIcon is clicked emits toggleFile', () => {
     createComponent({ collapsible: true });
@@ -129,8 +132,11 @@ describe('DiffFileHeader component', () => {
   it('when other element in header is clicked does not emits toggleFile', () => {
     createComponent({ collapsible: true });
     findTitleLink().trigger('click');
+
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().toggleFile).not.toBeDefined();
     });
+  });
 
   it('displays a copy to clipboard button', () => {
     createComponent();

spec/frontend/diffs/components/diff_gutter_avatars_spec.js

@@ -42,9 +42,11 @@ describe('DiffGutterAvatars', () => {
     it('should emit toggleDiscussions event on button click', () => {
       findCollapseButton().trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
       });
     });
+  });
 
   describe('when collapsed', () => {
     beforeEach(() => {
@@ -72,15 +74,19 @@ describe('DiffGutterAvatars', () => {
         .at(0)
         .trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
       });
+    });
 
     it('should emit toggleDiscussions event on more count text click', () => {
       findMoreCount().trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
       });
     });
+  });
 
   it('renders an empty more count string if there are no discussions', () => {
     createComponent({

spec/frontend/diffs/components/edit_button_spec.js

@@ -36,8 +36,10 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted('showForkMessage')).toBeTruthy();
     });
+  });
 
   it('doesnt emit a show fork message event if current user cannot fork', () => {
     createComponent({
@@ -46,8 +48,10 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted('showForkMessage')).toBeFalsy();
     });
+  });
 
   it('doesnt emit a show fork message event if current user can modify blob', () => {
     createComponent({
@@ -57,6 +61,8 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted('showForkMessage')).toBeFalsy();
     });
+  });
 });

spec/frontend/ide/components/error_message_spec.js

@@ -90,9 +90,14 @@ describe('IDE error message component', () => {
     it('does not dispatch action when already loading', () => {
       wrapper.find('button').trigger('click');
       actionMock.mockReset();
+      return wrapper.vm.$nextTick(() => {
         wrapper.find('button').trigger('click');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(actionMock).not.toHaveBeenCalled();
         });
+      });
+    });
 
     it('shows loading icon when loading', () => {
       let resolveAction;

spec/frontend/ide/components/file_templates/dropdown_spec.js

@@ -62,8 +62,10 @@ describe('IDE file templates dropdown component', () => {
     const item = findItemButtons().at(0);
     item.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().click[0][0]).toBe(itemData);
     });
+  });
 
   it('renders dropdown title', () => {
     const title = 'Test title';

spec/frontend/ide/components/jobs/stage_spec.js

@@ -52,8 +52,11 @@ describe('IDE pipeline stage', () => {
     const id = 5;
     createComponent({ stage: { ...defaultProps.stage, id } });
     findHeader().trigger('click');
+
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().toggleCollapsed[0][0]).toBe(id);
     });
+  });
 
   it('emits clickViewLog entity with job', () => {
     const [job] = defaultProps.stage.jobs;

spec/frontend/issuable_suggestions/components/app_spec.js

@@ -42,15 +42,19 @@ describe('Issuable suggestions app component', () => {
     it('renders component', () => {
       wrapper.setData(data);
 
+      return wrapper.vm.$nextTick(() => {
         expect(wrapper.isEmpty()).toBe(false);
       });
+    });
 
     it('does not render with empty search', () => {
       wrapper.setProps({ search: '' });
       wrapper.setData(data);
 
+      return wrapper.vm.$nextTick(() => {
         expect(wrapper.isVisible()).toBe(false);
       });
+    });
 
     it('does not render when loading', () => {
       wrapper.setData({
@@ -58,14 +62,18 @@ describe('Issuable suggestions app component', () => {
         loading: 1,
       });
 
+      return wrapper.vm.$nextTick(() => {
         expect(wrapper.isVisible()).toBe(false);
       });
+    });
 
     it('does not render with empty issues data', () => {
       wrapper.setData({ issues: [] });
 
+      return wrapper.vm.$nextTick(() => {
         expect(wrapper.isVisible()).toBe(false);
       });
+    });
 
     it('renders list of issues', () => {
       wrapper.setData(data);

spec/frontend/issuables_list/components/issuable_spec.js

@@ -339,8 +339,10 @@ describe('Issuable component', () => {
 
         findBulkCheckbox().trigger('click');
 
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.emitted().select).toEqual([[{ issuable, selected: !selected }]]);
         });
       });
     });
+  });
 });

spec/frontend/jobs/components/log/collapsible_section_spec.js

@@ -68,6 +68,9 @@ describe('Job Log Collapsible Section', () => {
     });
 
     findCollapsibleLine().trigger('click');
+
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
     });
+  });
 });

spec/frontend/jobs/components/log/line_header_spec.js

@@ -79,9 +79,11 @@ describe('Job Log Header Line', () => {
     it('emits toggleLine event', () => {
       wrapper.trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().toggleLine.length).toBe(1);
       });
     });
+  });
 
   describe('with duration', () => {
     beforeEach(() => {

spec/frontend/monitoring/components/charts/time_series_spec.js

@@ -348,11 +348,10 @@ describe('Time series component', () => {
     glChartComponents.forEach(dynamicComponent => {
       describe(`GitLab UI: ${dynamicComponent.chartType}`, () => {
         let timeSeriesAreaChart;
-        let glChart;
+        const findChart = () => timeSeriesAreaChart.find(dynamicComponent.component);
 
         beforeEach(done => {
           timeSeriesAreaChart = makeTimeSeriesChart(mockGraphData, dynamicComponent.chartType);
-          glChart = timeSeriesAreaChart.find(dynamicComponent.component);
           timeSeriesAreaChart.vm.$nextTick(done);
         });
 
@@ -361,12 +360,12 @@ describe('Time series component', () => {
         });
 
         it('is a Vue instance', () => {
-          expect(glChart.exists()).toBe(true);
-          expect(glChart.isVueInstance()).toBe(true);
+          expect(findChart().exists()).toBe(true);
+          expect(findChart().isVueInstance()).toBe(true);
         });
 
         it('receives data properties needed for proper chart render', () => {
-          const props = glChart.props();
+          const props = findChart().props();
 
           expect(props.data).toBe(timeSeriesAreaChart.vm.chartData);
           expect(props.option).toBe(timeSeriesAreaChart.vm.chartOptions);
@@ -379,7 +378,9 @@ describe('Time series component', () => {
           timeSeriesAreaChart.vm.tooltip.title = mockTitle;
 
           timeSeriesAreaChart.vm.$nextTick(() => {
-            expect(shallowWrapperContainsSlotText(glChart, 'tooltipTitle', mockTitle)).toBe(true);
+            expect(shallowWrapperContainsSlotText(findChart(), 'tooltipTitle', mockTitle)).toBe(
+              true,
+            );
             done();
           });
         });
@@ -394,7 +395,9 @@ describe('Time series component', () => {
           });
 
           it('uses deployment title', () => {
-            expect(shallowWrapperContainsSlotText(glChart, 'tooltipTitle', 'Deployed')).toBe(true);
+            expect(shallowWrapperContainsSlotText(findChart(), 'tooltipTitle', 'Deployed')).toBe(
+              true,
+            );
           });
 
           it('renders clickable commit sha in tooltip content', done => {

spec/frontend/monitoring/components/date_time_picker/date_time_picker_input_spec.js

@@ -58,8 +58,9 @@ describe('DateTimePickerInput', () => {
   it('input event is emitted when focus is lost', () => {
     createComponent();
     jest.spyOn(wrapper.vm, '$emit');
-    wrapper.find('input').setValue(inputValue);
-    wrapper.find('input').trigger('blur');
+    const input = wrapper.find('input');
+    input.setValue(inputValue);
+    input.trigger('blur');
 
     expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', inputValue);
   });

spec/frontend/monitoring/components/date_time_picker/date_time_picker_spec.js

@@ -18,7 +18,10 @@ describe('DateTimePicker', () => {
   const cancelButtonElement = () => dateTimePicker.find('button.btn-secondary').element;
   const fillInputAndBlur = (input, val) => {
     dateTimePicker.find(input).setValue(val);
+    return dateTimePicker.vm.$nextTick().then(() => {
       dateTimePicker.find(input).trigger('blur');
+      return dateTimePicker.vm.$nextTick();
+    });
   };
 
   const createComponent = props => {
@@ -103,43 +106,44 @@ describe('DateTimePicker', () => {
 
   it('displays inline error message if custom time range inputs are invalid', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01abc');
-    fillInputAndBlur('#custom-time-to', '2019-10-10abc');
-
-    dateTimePicker.vm.$nextTick(() => {
+    fillInputAndBlur('#custom-time-from', '2019-10-01abc')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-10abc'))
+      .then(() => {
         expect(dateTimePicker.findAll('.invalid-feedback').length).toBe(2);
         done();
-    });
+      })
+      .catch(done);
   });
 
   it('keeps apply button disabled with invalid custom time range inputs', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01abc');
-    fillInputAndBlur('#custom-time-to', '2019-09-19');
-
-    dateTimePicker.vm.$nextTick(() => {
+    fillInputAndBlur('#custom-time-from', '2019-10-01abc')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-09-19'))
+      .then(() => {
         expect(applyButtonElement().getAttribute('disabled')).toBe('disabled');
         done();
-    });
+      })
+      .catch(done);
   });
 
   it('enables apply button with valid custom time range inputs', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01');
-    fillInputAndBlur('#custom-time-to', '2019-10-19');
-
+    fillInputAndBlur('#custom-time-from', '2019-10-01')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-19'))
+      .then(() => {
         dateTimePicker.vm.$nextTick(() => {
           expect(applyButtonElement().getAttribute('disabled')).toBeNull();
           done();
         });
+      })
+      .catch(done);
   });
 
   it('returns an object when apply is clicked', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01');
-    fillInputAndBlur('#custom-time-to', '2019-10-19');
-
-    dateTimePicker.vm.$nextTick(() => {
+    fillInputAndBlur('#custom-time-from', '2019-10-01')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-19'))
+      .then(() => {
         jest.spyOn(dateTimePicker.vm, '$emit');
         applyButtonElement().click();
 
@@ -148,7 +152,8 @@ describe('DateTimePicker', () => {
           start: '2019-10-01T00:00:00Z',
         });
         done();
-    });
+      })
+      .catch(done);
   });
 
   it('hides the popover with cancel button', done => {

spec/frontend/mr_popover/mr_popover_spec.js

@@ -41,8 +41,10 @@ describe('MR Popover', () => {
         },
       });
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.element).toMatchSnapshot();
       });
+    });
 
     it('does not show CI Icon if there is no pipeline data', () => {
       wrapper.setData({
@@ -55,7 +57,9 @@ describe('MR Popover', () => {
         },
       });
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.contains('ciicon-stub')).toBe(false);
       });
     });
+  });
 });

spec/frontend/notes/components/discussion_jump_to_next_button_spec.js

@@ -24,7 +24,9 @@ describe('JumpToNextDiscussionButton', () => {
 
     button.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().onClick).toBeTruthy();
       expect(wrapper.emitted().onClick.length).toBe(1);
     });
+  });
 });

spec/frontend/notes/components/discussion_reply_placeholder_spec.js

@@ -25,10 +25,12 @@ describe('ReplyPlaceholder', () => {
   it('emits onClick even on button click', () => {
     findButton().trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted()).toEqual({
         onClick: [[]],
       });
     });
+  });
 
   it('should render reply button', () => {
     expect(findButton().text()).toEqual(buttonText);

spec/frontend/notes/components/discussion_resolve_button_spec.js

@@ -33,10 +33,12 @@ describe('resolveDiscussionButton', () => {
 
     button.trigger('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted()).toEqual({
         onClick: [[]],
       });
     });
+  });
 
   it('should contain the provided button title', () => {
     const button = wrapper.find({ ref: 'button' });

spec/frontend/notes/components/note_app_spec.js

@@ -290,9 +290,12 @@ describe('note_app', () => {
     it('should not render quick actions docs url', () => {
       wrapper.find('.js-note-edit').trigger('click');
       const { quickActionsDocsPath } = mockData.notesDataMock;
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.find(`.edit-note a[href="${quickActionsDocsPath}"]`).exists()).toBe(false);
       });
     });
+  });
 
   describe('emoji awards', () => {
     beforeEach(() => {

spec/frontend/performance_bar/components/add_request_spec.js

@@ -19,6 +19,7 @@ describe('add request form', () => {
   describe('when clicking the button', () => {
     beforeEach(() => {
       wrapper.find('button').trigger('click');
+      return wrapper.vm.$nextTick();
     });
 
     it('shows the form', () => {
@@ -28,6 +29,7 @@ describe('add request form', () => {
     describe('when pressing escape', () => {
       beforeEach(() => {
         wrapper.find('input').trigger('keyup.esc');
+        return wrapper.vm.$nextTick();
       });
 
       it('hides the input', () => {
@@ -38,7 +40,10 @@ describe('add request form', () => {
     describe('when submitting the form', () => {
       beforeEach(() => {
         wrapper.find('input').setValue('http://gitlab.example.com/users/root/calendar.json');
+        return wrapper.vm.$nextTick().then(() => {
           wrapper.find('input').trigger('keyup.enter');
+          return wrapper.vm.$nextTick();
+        });
       });
 
       it('emits an event to add the request', () => {
@@ -54,9 +59,10 @@ describe('add request form', () => {
 
       it('clears the value for next time', () => {
         wrapper.find('button').trigger('click');
-
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.find('input').text()).toEqual('');
         });
       });
     });
+  });
 });

spec/frontend/registry/list/components/table_registry_spec.js

@@ -97,10 +97,10 @@ describe('table registry', () => {
 
     it('selecting all checkbox should select all rows and enable delete button', done => {
       const selectAll = findSelectAllCheckbox();
-      const checkboxes = findSelectCheckboxes();
       selectAll.trigger('click');
 
       Vue.nextTick(() => {
+        const checkboxes = findSelectCheckboxes();
         const checked = checkboxes.filter(w => w.element.checked);
         expect(checked.length).toBe(checkboxes.length);
         done();
@@ -162,6 +162,7 @@ describe('table registry', () => {
   describe('delete registry', () => {
     beforeEach(() => {
       wrapper.setData({ selectedItems: [0] });
+      return wrapper.vm.$nextTick();
     });
 
     it('should be possible to delete a registry', () => {
@@ -317,6 +318,7 @@ describe('table registry', () => {
     describe('single tag delete', () => {
       beforeEach(() => {
         wrapper.setData({ itemsToBeDeleted: [0] });
+        return wrapper.vm.$nextTick();
       });
 
       it('send an event when delete button is clicked', () => {
@@ -345,6 +347,7 @@ describe('table registry', () => {
       beforeEach(() => {
         const items = [0, 1, 2];
         wrapper.setData({ itemsToBeDeleted: items, selectedItems: items });
+        return wrapper.vm.$nextTick();
       });
 
       it('send an event when delete button is clicked', () => {

spec/frontend/releases/list/components/evidence_block_spec.js

@@ -53,9 +53,12 @@ describe('Evidence Block', () => {
 
     it('renders the long sha after expansion', () => {
       wrapper.find('.js-text-expander-prepend').trigger('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.find('.js-expanded').text()).toBe(release.evidence_sha);
       });
     });
+  });
 
   describe('copy to clipboard button', () => {
     it('renders button', () => {

spec/frontend/repository/components/breadcrumbs_spec.js

@@ -49,14 +49,18 @@ describe('Repository breadcrumbs component', () => {
 
     vm.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } });
 
+    return vm.vm.$nextTick(() => {
       expect(vm.find(GlDropdown).exists()).toBe(false);
     });
+  });
 
   it('renders add to tree dropdown when permissions are true', () => {
     factory('/', { canCollaborate: true });
 
     vm.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } });
 
+    return vm.vm.$nextTick(() => {
       expect(vm.find(GlDropdown).exists()).toBe(true);
     });
+  });
 });

spec/frontend/repository/components/last_commit_spec.js

@@ -58,8 +58,10 @@ describe('Repository last commit component', () => {
   `('$label when loading icon $loading is true', ({ loading }) => {
     factory(createCommitData(), loading);
 
+    return vm.vm.$nextTick(() => {
       expect(vm.find(GlLoadingIcon).exists()).toBe(loading);
     });
+  });
 
   it('renders commit widget', () => {
     factory();

spec/frontend/repository/components/preview/index_spec.js

@@ -33,8 +33,10 @@ describe('Repository file preview component', () => {
 
     vm.setData({ readme: { html: '<div class="blob">test</div>' } });
 
+    return vm.vm.$nextTick(() => {
       expect(vm.element).toMatchSnapshot();
     });
+  });
 
   it('renders loading icon', () => {
     factory({
@@ -44,6 +46,8 @@ describe('Repository file preview component', () => {
 
     vm.setData({ loading: 1 });
 
+    return vm.vm.$nextTick(() => {
       expect(vm.find(GlLoadingIcon).exists()).toBe(true);
     });
+  });
 });

spec/frontend/repository/components/table/index_spec.js

@@ -53,10 +53,12 @@ describe('Repository table component', () => {
 
     vm.setData({ ref });
 
+    return vm.vm.$nextTick(() => {
       expect(vm.find('.table').attributes('aria-label')).toEqual(
         `Files, directories, and submodules in the path ${path} for commit reference ${ref}`,
       );
     });
+  });
 
   it('shows loading icon', () => {
     factory({ path: '/', isLoading: true });

spec/frontend/repository/components/table/row_spec.js

@@ -46,8 +46,10 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.element).toMatchSnapshot();
     });
+  });
 
   it.each`
     type        | component         | componentName
@@ -63,8 +65,10 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find(component).exists()).toBe(true);
     });
+  });
 
   it.each`
     type        | pushes
@@ -80,6 +84,7 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       vm.trigger('click');
 
       if (pushes) {
@@ -88,6 +93,7 @@ describe('Repository table row component', () => {
         expect($router.push).not.toHaveBeenCalled();
       }
     });
+  });
 
   it.each`
     type        | pushes
@@ -103,6 +109,7 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       vm.trigger('click');
 
       if (pushes) {
@@ -113,6 +120,7 @@ describe('Repository table row component', () => {
         expect(external).toBeFalsy();
       }
     });
+  });
 
   it('renders commit ID for submodule', () => {
     factory({
@@ -123,8 +131,10 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find('.commit-sha').text()).toContain('1');
     });
+  });
 
   it('renders link with href', () => {
     factory({
@@ -136,8 +146,10 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find('a').attributes('href')).toEqual('https://test.com');
     });
+  });
 
   it('renders LFS badge', () => {
     factory({
@@ -149,8 +161,10 @@ describe('Repository table row component', () => {
       lfsOid: '1',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find(GlBadge).exists()).toBe(true);
     });
+  });
 
   it('renders commit and web links with href for submodule', () => {
     factory({
@@ -163,9 +177,11 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find('a').attributes('href')).toEqual('https://test.com');
       expect(vm.find(GlLink).attributes('href')).toEqual('https://test.com/commit');
     });
+  });
 
   it('renders lock icon', () => {
     factory({
@@ -178,6 +194,8 @@ describe('Repository table row component', () => {
 
     vm.setData({ commit: { lockLabel: 'Locked by Root', committedDate: '2019-01-01' } });
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find(Icon).exists()).toBe(true);
     });
+  });
 });

spec/frontend/sidebar/assignees_spec.js

@@ -65,9 +65,11 @@ describe('Assignee component', () => {
       jest.spyOn(wrapper.vm, '$emit');
       wrapper.find('.assign-yourself .btn-link').trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('assign-self')).toBeTruthy();
       });
     });
+  });
 
   describe('One assignee/user', () => {
     it('displays one assignee icon when collapsed', () => {

spec/frontend/sidebar/confidential_issue_sidebar_spec.js

@@ -78,9 +78,13 @@ describe('Confidential Issue Sidebar Block', () => {
     it('displays the edit form when editable', () => {
       wrapper.setData({ edit: false });
 
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
           wrapper.find({ ref: 'editLink' }).trigger('click');
-
-      return wrapper.vm.$nextTick().then(() => {
+          return wrapper.vm.$nextTick();
+        })
+        .then(() => {
           expect(wrapper.find(EditForm).exists()).toBe(true);
         });
     });
@@ -88,9 +92,13 @@ describe('Confidential Issue Sidebar Block', () => {
     it('displays the edit form when opened from collapsed state', () => {
       wrapper.setData({ edit: false });
 
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
           wrapper.find({ ref: 'collapseIcon' }).trigger('click');
-
-      return wrapper.vm.$nextTick().then(() => {
+          return wrapper.vm.$nextTick();
+        })
+        .then(() => {
           expect(wrapper.find(EditForm).exists()).toBe(true);
         });
     });

spec/frontend/sidebar/todo_spec.js

@@ -60,8 +60,10 @@ describe('SidebarTodo', () => {
       createComponent();
       wrapper.find('button').trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().toggleTodo).toBeTruthy();
       });
+    });
 
     it('renders component container element with proper data attributes', () => {
       createComponent({

spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js

@@ -42,6 +42,7 @@ describe('Merge Request Collapsible Extension', () => {
     describe('onClick', () => {
       beforeEach(() => {
         wrapper.find('button').trigger('click');
+        return wrapper.vm.$nextTick();
       });
 
       it('rendes the provided slot', () => {

spec/frontend/vue_mr_widget/components/states/commit_edit_spec.js

@@ -55,10 +55,12 @@ describe('Commits edit component', () => {
       findTextarea().element.value = changedCommitMessage;
       findTextarea().trigger('input');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().input[0]).toEqual([changedCommitMessage]);
         expect(findTextarea().element.value).toBe(changedCommitMessage);
       });
     });
+  });
 
   describe('when slots are present', () => {
     beforeEach(() => {

spec/frontend/vue_mr_widget/components/states/mr_widget_commits_header_spec.js

@@ -64,8 +64,10 @@ describe('Commits header component', () => {
       createComponent();
       wrapper.setData({ expanded: false });
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(findIcon().props('name')).toBe('chevron-right');
       });
+    });
 
     describe('when squash is disabled', () => {
       beforeEach(() => {

spec/frontend/vue_shared/components/expand_button_spec.js

@@ -136,8 +136,11 @@ describe('Expand button', () => {
     it('clicking hides itself and shows prepend', () => {
       expect(expanderAppendEl().isVisible()).toBe(true);
       expanderAppendEl().trigger('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(expanderPrependEl().isVisible()).toBe(true);
       });
+    });
 
     it('clicking hides expanded text', () => {
       expect(
@@ -147,6 +150,8 @@ describe('Expand button', () => {
           .trim(),
       ).toBe(text.expanded);
       expanderAppendEl().trigger('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(
           wrapper
             .find(ExpandButton)
@@ -154,6 +159,7 @@ describe('Expand button', () => {
             .trim(),
         ).not.toBe(text.expanded);
       });
+    });
 
     describe('when short text is provided', () => {
       beforeEach(done => {
@@ -176,6 +182,8 @@ describe('Expand button', () => {
             .trim(),
         ).toBe(text.expanded);
         expanderAppendEl().trigger('click');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(
             wrapper
               .find(ExpandButton)
@@ -185,4 +193,5 @@ describe('Expand button', () => {
         });
       });
     });
+  });
 });

spec/frontend/vue_shared/components/issue/related_issuable_item_spec.js

@@ -192,10 +192,12 @@ describe('RelatedIssuableItem', () => {
     it('triggers onRemoveRequest when clicked', () => {
       removeBtn.trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         const { relatedIssueRemoveRequest } = wrapper.emitted();
 
         expect(relatedIssueRemoveRequest.length).toBe(1);
         expect(relatedIssueRemoveRequest[0]).toEqual([props.idKey]);
       });
     });
+  });
 });

spec/frontend/vue_shared/components/loading_button_spec.js

@@ -80,8 +80,10 @@ describe('LoadingButton', () => {
 
       wrapper.trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('click')).toBeTruthy();
       });
+    });
 
     it('does not call given callback when disabled because of loading', () => {
       buildWrapper({
@@ -90,7 +92,9 @@ describe('LoadingButton', () => {
 
       wrapper.trigger('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('click')).toBeFalsy();
       });
     });
+  });
 });

spec/frontend/vue_shared/components/markdown/header_spec.js

@@ -66,12 +66,18 @@ describe('Markdown field header component', () => {
   it('emits toggle markdown event when clicking preview', () => {
     wrapper.find('.js-preview-link').trigger('click');
 
+    return wrapper.vm
+      .$nextTick()
+      .then(() => {
         expect(wrapper.emitted('preview-markdown').length).toEqual(1);
 
         wrapper.find('.js-write-link').trigger('click');
-
+        return wrapper.vm.$nextTick();
+      })
+      .then(() => {
         expect(wrapper.emitted('write-markdown').length).toEqual(1);
       });
+  });
 
   it('does not emit toggle markdown event when triggered from another form', () => {
     $(document).triggerHandler('markdown-preview:show', [

spec/frontend/vue_shared/components/modal_copy_button_spec.js

@@ -29,14 +29,20 @@ describe('modal copy button', () => {
         removeAllRanges: jest.fn(),
       }));
       wrapper.trigger('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().success).not.toBeEmpty();
         expect(document.execCommand).toHaveBeenCalledWith('copy');
       });
+    });
     it("should propagate the clipboard error event if execCommand doesn't work", () => {
       document.execCommand = jest.fn(() => false);
       wrapper.trigger('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().error).not.toBeEmpty();
         expect(document.execCommand).toHaveBeenCalledWith('copy');
       });
     });
+  });
 });

spec/frontend/vue_shared/directives/track_event_spec.js

@@ -43,7 +43,10 @@ describe('Error Tracking directive', () => {
 
     wrapper.setData({ trackingOptions });
     const { category, action, label, property, value } = trackingOptions;
+
+    return wrapper.vm.$nextTick(() => {
       button.trigger('click');
       expect(Tracking.event).toHaveBeenCalledWith(category, action, { label, property, value });
     });
+  });
 });

spec/javascripts/diffs/components/app_spec.js

@@ -68,7 +68,7 @@ describe('diffs/components/app', () => {
   });
 
   describe('fetch diff methods', () => {
-    beforeEach(() => {
+    beforeEach(done => {
       const fetchResolver = () => {
         store.state.diffs.retrievingBatches = false;
         return Promise.resolve();
@@ -82,6 +82,7 @@ describe('diffs/components/app', () => {
       spyOn(wrapper.vm, 'startRenderDiffsQueue');
       spyOn(wrapper.vm, 'unwatchDiscussions');
       store.state.diffs.retrievingBatches = true;
+      wrapper.vm.$nextTick(done);
     });
 
     it('calls fetchDiffFiles if diffsBatchLoad is not enabled', done => {
@@ -99,30 +100,32 @@ describe('diffs/components/app', () => {
       });
     });
 
-    it('calls batch methods if diffsBatchLoad is enabled, and not latest version', () => {
+    it('calls batch methods if diffsBatchLoad is enabled, and not latest version', done => {
       wrapper.vm.glFeatures.diffsBatchLoad = true;
       wrapper.vm.isLatestVersion = () => false;
       wrapper.vm.fetchData(false);
 
       expect(wrapper.vm.fetchDiffFiles).not.toHaveBeenCalled();
-      wrapper.vm.$nextTick(() => {
+      setTimeout(() => {
         expect(wrapper.vm.startRenderDiffsQueue).toHaveBeenCalled();
         expect(wrapper.vm.fetchDiffFilesMeta).toHaveBeenCalled();
         expect(wrapper.vm.fetchDiffFilesBatch).toHaveBeenCalled();
         expect(wrapper.vm.unwatchDiscussions).toHaveBeenCalled();
+        done();
       });
     });
 
-    it('calls batch methods if diffsBatchLoad is enabled, and latest version', () => {
+    it('calls batch methods if diffsBatchLoad is enabled, and latest version', done => {
       wrapper.vm.glFeatures.diffsBatchLoad = true;
       wrapper.vm.fetchData(false);
 
       expect(wrapper.vm.fetchDiffFiles).not.toHaveBeenCalled();
-      wrapper.vm.$nextTick(() => {
+      setTimeout(() => {
         expect(wrapper.vm.startRenderDiffsQueue).toHaveBeenCalled();
         expect(wrapper.vm.fetchDiffFilesMeta).toHaveBeenCalled();
         expect(wrapper.vm.fetchDiffFilesBatch).toHaveBeenCalled();
         expect(wrapper.vm.unwatchDiscussions).toHaveBeenCalled();
+        done();
       });
     });
   });