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,11 +102,15 @@ 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 });
 
-      expect(wrapper.emitted('set')[0]).toEqual([newHostname]);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('set')[0]).toEqual([newHostname]);
+      });
     });
   });
 

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

@@ -61,15 +61,20 @@ describe('ClusterFormDropdown', () => {
 
     beforeEach(() => {
       vm.setProps({ items, multiple: true, value });
-      return vm.vm.$nextTick().then(() => {
-        vm.findAll('.js-dropdown-item')
-          .at(0)
-          .trigger('click');
-        vm.findAll('.js-dropdown-item')
-          .at(1)
-          .trigger('click');
-        return vm.vm.$nextTick();
-      });
+      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');
+          return vm.vm.$nextTick();
+        });
     });
 
     it('emits input event with an array of selected items', () => {
@@ -198,8 +203,10 @@ describe('ClusterFormDropdown', () => {
     vm.setProps({ items });
     vm.setData({ searchQuery });
 
-    expect(vm.findAll('.js-dropdown-item').length).toEqual(1);
-    expect(vm.find('.js-dropdown-item').text()).toEqual(secondItem.name);
+    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', () => {

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

@@ -72,7 +72,9 @@ describe('ServiceCredentialsForm', () => {
   it('enables submit button when role ARN is not provided', () => {
     vm.setData({ roleArn: '123' });
 
-    expect(findSubmitButton().attributes('disabled')).toBeFalsy();
+    return vm.vm.$nextTick().then(() => {
+      expect(findSubmitButton().attributes('disabled')).toBeFalsy();
+    });
   });
 
   it('dispatches createRole action when form is submitted', () => {
@@ -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,7 +92,9 @@ describe('StageNavItem', () => {
     it('emits the `select` event when clicked', () => {
       expect(wrapper.emitted().select).toBeUndefined();
       wrapper.trigger('click');
-      expect(wrapper.emitted().select.length).toBe(1);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.emitted().select.length).toBe(1);
+      });
     });
   });
 

spec/frontend/diffs/components/diff_file_header_spec.js

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

spec/frontend/diffs/components/diff_gutter_avatars_spec.js

@@ -42,7 +42,9 @@ describe('DiffGutterAvatars', () => {
     it('should emit toggleDiscussions event on button click', () => {
       findCollapseButton().trigger('click');
 
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
   });
 
@@ -72,13 +74,17 @@ describe('DiffGutterAvatars', () => {
         .at(0)
         .trigger('click');
 
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
 
     it('should emit toggleDiscussions event on more count text click', () => {
       findMoreCount().trigger('click');
 
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
   });
 

spec/frontend/diffs/components/edit_button_spec.js

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

spec/frontend/ide/components/error_message_spec.js

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

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

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

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

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

spec/frontend/issuable_suggestions/components/app_spec.js

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

spec/frontend/issuables_list/components/issuable_spec.js

@@ -339,7 +339,9 @@ describe('Issuable component', () => {
 
         findBulkCheckbox().trigger('click');
 
-        expect(wrapper.emitted().select).toEqual([[{ issuable, selected: !selected }]]);
+        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');
-    expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
+    });
   });
 });

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

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

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);
-    dateTimePicker.find(input).trigger('blur');
+    return dateTimePicker.vm.$nextTick().then(() => {
+      dateTimePicker.find(input).trigger('blur');
+      return dateTimePicker.vm.$nextTick();
+    });
   };
 
   const createComponent = props => {
@@ -103,52 +106,54 @@ 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(() => {
-      expect(dateTimePicker.findAll('.invalid-feedback').length).toBe(2);
-      done();
-    });
+    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(() => {
-      expect(applyButtonElement().getAttribute('disabled')).toBe('disabled');
-      done();
-    });
+    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');
-
-    dateTimePicker.vm.$nextTick(() => {
-      expect(applyButtonElement().getAttribute('disabled')).toBeNull();
-      done();
-    });
+    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(() => {
-      jest.spyOn(dateTimePicker.vm, '$emit');
-      applyButtonElement().click();
-
-      expect(dateTimePicker.vm.$emit).toHaveBeenCalledWith('onApply', {
-        end: '2019-10-19T00:00:00Z',
-        start: '2019-10-01T00:00:00Z',
-      });
-      done();
-    });
+    fillInputAndBlur('#custom-time-from', '2019-10-01')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-19'))
+      .then(() => {
+        jest.spyOn(dateTimePicker.vm, '$emit');
+        applyButtonElement().click();
+
+        expect(dateTimePicker.vm.$emit).toHaveBeenCalledWith('onApply', {
+          end: '2019-10-19T00:00:00Z',
+          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,7 +41,9 @@ describe('MR Popover', () => {
         },
       });
 
-      expect(wrapper.element).toMatchSnapshot();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
     });
 
     it('does not show CI Icon if there is no pipeline data', () => {
@@ -55,7 +57,9 @@ describe('MR Popover', () => {
         },
       });
 
-      expect(wrapper.contains('ciicon-stub')).toBe(false);
+      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');
 
-    expect(wrapper.emitted().onClick).toBeTruthy();
-    expect(wrapper.emitted().onClick.length).toBe(1);
+    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,8 +25,10 @@ describe('ReplyPlaceholder', () => {
   it('emits onClick even on button click', () => {
     findButton().trigger('click');
 
-    expect(wrapper.emitted()).toEqual({
-      onClick: [[]],
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted()).toEqual({
+        onClick: [[]],
+      });
     });
   });
 

spec/frontend/notes/components/discussion_resolve_button_spec.js

@@ -33,8 +33,10 @@ describe('resolveDiscussionButton', () => {
 
     button.trigger('click');
 
-    expect(wrapper.emitted()).toEqual({
-      onClick: [[]],
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted()).toEqual({
+        onClick: [[]],
+      });
     });
   });
 

spec/frontend/notes/components/note_app_spec.js

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

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');
-        wrapper.find('input').trigger('keyup.enter');
+        return wrapper.vm.$nextTick().then(() => {
+          wrapper.find('input').trigger('keyup.enter');
+          return wrapper.vm.$nextTick();
+        });
       });
 
       it('emits an event to add the request', () => {
@@ -54,8 +59,9 @@ describe('add request form', () => {
 
       it('clears the value for next time', () => {
         wrapper.find('button').trigger('click');
-
-        expect(wrapper.find('input').text()).toEqual('');
+        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,7 +53,10 @@ describe('Evidence Block', () => {
 
     it('renders the long sha after expansion', () => {
       wrapper.find('.js-text-expander-prepend').trigger('click');
-      expect(wrapper.find('.js-expanded').text()).toBe(release.evidence_sha);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.find('.js-expanded').text()).toBe(release.evidence_sha);
+      });
     });
   });
 

spec/frontend/repository/components/breadcrumbs_spec.js

@@ -49,7 +49,9 @@ describe('Repository breadcrumbs component', () => {
 
     vm.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } });
 
-    expect(vm.find(GlDropdown).exists()).toBe(false);
+    return vm.vm.$nextTick(() => {
+      expect(vm.find(GlDropdown).exists()).toBe(false);
+    });
   });
 
   it('renders add to tree dropdown when permissions are true', () => {
@@ -57,6 +59,8 @@ describe('Repository breadcrumbs component', () => {
 
     vm.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } });
 
-    expect(vm.find(GlDropdown).exists()).toBe(true);
+    return vm.vm.$nextTick(() => {
+      expect(vm.find(GlDropdown).exists()).toBe(true);
+    });
   });
 });

spec/frontend/repository/components/last_commit_spec.js

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

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

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

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

@@ -53,9 +53,11 @@ describe('Repository table component', () => {
 
     vm.setData({ ref });
 
-    expect(vm.find('.table').attributes('aria-label')).toEqual(
-      `Files, directories, and submodules in the path ${path} for commit reference ${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', () => {

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

@@ -46,7 +46,9 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    expect(vm.element).toMatchSnapshot();
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.element).toMatchSnapshot();
+    });
   });
 
   it.each`
@@ -63,7 +65,9 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    expect(vm.find(component).exists()).toBe(true);
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find(component).exists()).toBe(true);
+    });
   });
 
   it.each`
@@ -80,13 +84,15 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    vm.trigger('click');
+    return vm.vm.$nextTick().then(() => {
+      vm.trigger('click');
 
-    if (pushes) {
-      expect($router.push).toHaveBeenCalledWith({ path: '/tree/master/test' });
-    } else {
-      expect($router.push).not.toHaveBeenCalled();
-    }
+      if (pushes) {
+        expect($router.push).toHaveBeenCalledWith({ path: '/tree/master/test' });
+      } else {
+        expect($router.push).not.toHaveBeenCalled();
+      }
+    });
   });
 
   it.each`
@@ -103,15 +109,17 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    vm.trigger('click');
+    return vm.vm.$nextTick().then(() => {
+      vm.trigger('click');
 
-    if (pushes) {
-      expect(visitUrl).not.toHaveBeenCalled();
-    } else {
-      const [url, external] = visitUrl.mock.calls[0];
-      expect(url).toBe('https://test.com');
-      expect(external).toBeFalsy();
-    }
+      if (pushes) {
+        expect(visitUrl).not.toHaveBeenCalled();
+      } else {
+        const [url, external] = visitUrl.mock.calls[0];
+        expect(url).toBe('https://test.com');
+        expect(external).toBeFalsy();
+      }
+    });
   });
 
   it('renders commit ID for submodule', () => {
@@ -123,7 +131,9 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    expect(vm.find('.commit-sha').text()).toContain('1');
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find('.commit-sha').text()).toContain('1');
+    });
   });
 
   it('renders link with href', () => {
@@ -136,7 +146,9 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    expect(vm.find('a').attributes('href')).toEqual('https://test.com');
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find('a').attributes('href')).toEqual('https://test.com');
+    });
   });
 
   it('renders LFS badge', () => {
@@ -149,7 +161,9 @@ describe('Repository table row component', () => {
       lfsOid: '1',
     });
 
-    expect(vm.find(GlBadge).exists()).toBe(true);
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find(GlBadge).exists()).toBe(true);
+    });
   });
 
   it('renders commit and web links with href for submodule', () => {
@@ -163,8 +177,10 @@ describe('Repository table row component', () => {
       currentPath: '/',
     });
 
-    expect(vm.find('a').attributes('href')).toEqual('https://test.com');
-    expect(vm.find(GlLink).attributes('href')).toEqual('https://test.com/commit');
+    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', () => {
@@ -178,6 +194,8 @@ describe('Repository table row component', () => {
 
     vm.setData({ commit: { lockLabel: 'Locked by Root', committedDate: '2019-01-01' } });
 
-    expect(vm.find(Icon).exists()).toBe(true);
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.find(Icon).exists()).toBe(true);
+    });
   });
 });

spec/frontend/sidebar/assignees_spec.js

@@ -65,7 +65,9 @@ describe('Assignee component', () => {
       jest.spyOn(wrapper.vm, '$emit');
       wrapper.find('.assign-yourself .btn-link').trigger('click');
 
-      expect(wrapper.emitted('assign-self')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('assign-self')).toBeTruthy();
+      });
     });
   });
 

spec/frontend/sidebar/confidential_issue_sidebar_spec.js

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

spec/frontend/sidebar/todo_spec.js

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

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,8 +55,10 @@ describe('Commits edit component', () => {
       findTextarea().element.value = changedCommitMessage;
       findTextarea().trigger('input');
 
-      expect(wrapper.emitted().input[0]).toEqual([changedCommitMessage]);
-      expect(findTextarea().element.value).toBe(changedCommitMessage);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().input[0]).toEqual([changedCommitMessage]);
+        expect(findTextarea().element.value).toBe(changedCommitMessage);
+      });
     });
   });
 

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

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

spec/frontend/vue_shared/components/expand_button_spec.js

@@ -136,7 +136,10 @@ describe('Expand button', () => {
     it('clicking hides itself and shows prepend', () => {
       expect(expanderAppendEl().isVisible()).toBe(true);
       expanderAppendEl().trigger('click');
-      expect(expanderPrependEl().isVisible()).toBe(true);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(expanderPrependEl().isVisible()).toBe(true);
+      });
     });
 
     it('clicking hides expanded text', () => {
@@ -147,12 +150,15 @@ describe('Expand button', () => {
           .trim(),
       ).toBe(text.expanded);
       expanderAppendEl().trigger('click');
-      expect(
-        wrapper
-          .find(ExpandButton)
-          .text()
-          .trim(),
-      ).not.toBe(text.expanded);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(
+          wrapper
+            .find(ExpandButton)
+            .text()
+            .trim(),
+        ).not.toBe(text.expanded);
+      });
     });
 
     describe('when short text is provided', () => {
@@ -176,12 +182,15 @@ describe('Expand button', () => {
             .trim(),
         ).toBe(text.expanded);
         expanderAppendEl().trigger('click');
-        expect(
-          wrapper
-            .find(ExpandButton)
-            .text()
-            .trim(),
-        ).toBe(text.short);
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(
+            wrapper
+              .find(ExpandButton)
+              .text()
+              .trim(),
+          ).toBe(text.short);
+        });
       });
     });
   });

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');
 
-      const { relatedIssueRemoveRequest } = wrapper.emitted();
+      return wrapper.vm.$nextTick().then(() => {
+        const { relatedIssueRemoveRequest } = wrapper.emitted();
 
-      expect(relatedIssueRemoveRequest.length).toBe(1);
-      expect(relatedIssueRemoveRequest[0]).toEqual([props.idKey]);
+        expect(relatedIssueRemoveRequest.length).toBe(1);
+        expect(relatedIssueRemoveRequest[0]).toEqual([props.idKey]);
+      });
     });
   });
 });

spec/frontend/vue_shared/components/loading_button_spec.js

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

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

@@ -66,11 +66,17 @@ describe('Markdown field header component', () => {
   it('emits toggle markdown event when clicking preview', () => {
     wrapper.find('.js-preview-link').trigger('click');
 
-    expect(wrapper.emitted('preview-markdown').length).toEqual(1);
-
-    wrapper.find('.js-write-link').trigger('click');
-
-    expect(wrapper.emitted('write-markdown').length).toEqual(1);
+    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', () => {

spec/frontend/vue_shared/components/modal_copy_button_spec.js

@@ -29,14 +29,20 @@ describe('modal copy button', () => {
         removeAllRanges: jest.fn(),
       }));
       wrapper.trigger('click');
-      expect(wrapper.emitted().success).not.toBeEmpty();
-      expect(document.execCommand).toHaveBeenCalledWith('copy');
+
+      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');
-      expect(wrapper.emitted().error).not.toBeEmpty();
-      expect(document.execCommand).toHaveBeenCalledWith('copy');
+
+      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;
-    button.trigger('click');
-    expect(Tracking.event).toHaveBeenCalledWith(category, action, { label, property, value });
+
+    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();
       });
     });
   });