Merge branch 'xanf-vtu-30-trigger' into 'master'

Wrap trigger into nextTick calls

Closes #192019

See merge request gitlab-org/gitlab!22324

ee/spec/frontend/analytics/cycle_analytics/components/add_stage_button_spec.js

@@ -27,7 +27,9 @@ describe('AddStageButton', () => {
       wrapper = createComponent();
       expect(wrapper.emitted().showform).toBeUndefined();
       wrapper.trigger('click');
-      expect(wrapper.emitted().showform.length).toBe(1);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().showform.length).toBe(1);
+      });
     });
 
     it('does not have the active class', () => {

ee/spec/frontend/analytics/cycle_analytics/components/custom_stage_form_spec.js

@@ -362,6 +362,7 @@ describe('CustomStageForm', () => {
 
         return Vue.nextTick(() => {
           selectDropdownOption(wrapper, sel.endEvent, 1);
+          return Vue.nextTick();
         });
       });
 
@@ -394,10 +395,15 @@ describe('CustomStageForm', () => {
 
           selectDropdownOption(wrapper, sel.startEvent, startEventIndex);
 
-          return Vue.nextTick(() => {
-            selectDropdownOption(wrapper, sel.endEvent, stopEventIndex);
-            wrapper.find(sel.name).setValue('Cool stage');
-          });
+          return Vue.nextTick()
+            .then(() => {
+              selectDropdownOption(wrapper, sel.endEvent, stopEventIndex);
+              return Vue.nextTick();
+            })
+            .then(() => {
+              wrapper.find(sel.name).setValue('Cool stage');
+              return Vue.nextTick();
+            });
         });
 
         afterEach(() => {
@@ -437,8 +443,10 @@ describe('CustomStageForm', () => {
           ];
 
           wrapper.find(sel.submit).trigger('click');
-          event = findEvent(STAGE_ACTIONS.CREATE);
-          expect(event[0]).toEqual(res);
+          return Vue.nextTick().then(() => {
+            event = findEvent(STAGE_ACTIONS.CREATE);
+            expect(event[0]).toEqual(res);
+          });
         });
       });
     });

ee/spec/frontend/analytics/cycle_analytics/components/labels_selector_spec.js

@@ -50,8 +50,10 @@ describe('Cycle Analytics LabelsSelector', () => {
         const elem = wrapper.findAll('.dropdown-item').at(2);
         elem.trigger('click');
 
-        expect(wrapper.emitted('selectLabel').length > 0).toBe(true);
-        expect(wrapper.emitted('selectLabel')[0]).toContain(groupLabels[1].id);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted('selectLabel').length > 0).toBe(true);
+          expect(wrapper.emitted('selectLabel')[0]).toContain(groupLabels[1].id);
+        });
       });
 
       it('will emit the "clearLabel" event if it is the default item', () => {
@@ -60,7 +62,9 @@ describe('Cycle Analytics LabelsSelector', () => {
         const elem = wrapper.findAll('.dropdown-item').at(0);
         elem.trigger('click');
 
-        expect(wrapper.emitted('clearLabel').length > 0).toBe(true);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted('clearLabel').length > 0).toBe(true);
+        });
       });
     });
   });

ee/spec/frontend/analytics/cycle_analytics/components/stage_dropdown_filter_spec.js

@@ -62,12 +62,14 @@ describe('StageDropdownFilter component', () => {
 
         item.trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[stages[1], stages[2]]],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'selected',
+              args: [[stages[1], stages[2]]],
+            },
+          ]);
+        });
       });
     });
 
@@ -77,20 +79,26 @@ describe('StageDropdownFilter component', () => {
           .at(0)
           .trigger('click');
 
-        findDropdownItems()
-          .at(0)
-          .trigger('click');
-
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[stages[1], stages[2]]],
-          },
-          {
-            name: 'selected',
-            args: [[stages[1], stages[2], stages[0]]],
-          },
-        ]);
+        return wrapper.vm
+          .$nextTick()
+          .then(() => {
+            findDropdownItems()
+              .at(0)
+              .trigger('click');
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
+            expect(wrapper.emittedByOrder()).toEqual([
+              {
+                name: 'selected',
+                args: [[stages[1], stages[2]]],
+              },
+              {
+                name: 'selected',
+                args: [[stages[1], stages[2], stages[0]]],
+              },
+            ]);
+          });
       });
     });
   });

ee/spec/frontend/analytics/shared/components/daterange_spec.js

@@ -57,12 +57,14 @@ describe('Daterange component', () => {
         input.setValue('2019-01-01');
         input.trigger('change');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'change',
-            args: [{ startDate: minDate, endDate }],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'change',
+              args: [{ startDate: minDate, endDate }],
+            },
+          ]);
+        });
       });
     });
   });

ee/spec/frontend/analytics/shared/components/groups_dropdown_filter_spec.js

@@ -142,12 +142,14 @@ describe('GroupsDropdownFilter component', () => {
         .at(0)
         .trigger('click');
 
-      expect(wrapper.emittedByOrder()).toEqual([
-        {
-          name: 'selected',
-          args: [groups[0]],
-        },
-      ]);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emittedByOrder()).toEqual([
+          {
+            name: 'selected',
+            args: [groups[0]],
+          },
+        ]);
+      });
     });
 
     it('should change selection when new group is clicked', () => {
@@ -155,12 +157,14 @@ describe('GroupsDropdownFilter component', () => {
         .at(1)
         .trigger('click');
 
-      expect(wrapper.emittedByOrder()).toEqual([
-        {
-          name: 'selected',
-          args: [groups[1]],
-        },
-      ]);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emittedByOrder()).toEqual([
+          {
+            name: 'selected',
+            args: [groups[1]],
+          },
+        ]);
+      });
     });
 
     it('renders an avatar in the dropdown button when the group has an avatar_url', done => {

ee/spec/frontend/analytics/shared/components/projects_dropdown_filter_spec.js

@@ -175,12 +175,14 @@ describe('ProjectsDropdownFilter component', () => {
           .at(0)
           .trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[projects[0]]],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'selected',
+              args: [[projects[0]]],
+            },
+          ]);
+        });
       });
 
       it('should change selection when new project is clicked', () => {
@@ -188,12 +190,14 @@ describe('ProjectsDropdownFilter component', () => {
           .at(1)
           .trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[projects[1]]],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'selected',
+              args: [[projects[1]]],
+            },
+          ]);
+        });
       });
 
       it('selection should be emptied when a project is deselected', () => {
@@ -201,16 +205,18 @@ describe('ProjectsDropdownFilter component', () => {
         project.trigger('click');
         project.trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[projects[0]]],
-          },
-          {
-            name: 'selected',
-            args: [[]],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'selected',
+              args: [[projects[0]]],
+            },
+            {
+              name: 'selected',
+              args: [[]],
+            },
+          ]);
+        });
       });
 
       it('renders an avatar in the dropdown button when the project has an avatar_url', done => {
@@ -294,20 +300,26 @@ describe('ProjectsDropdownFilter component', () => {
           .at(0)
           .trigger('click');
 
-        findDropdownItems()
-          .at(1)
-          .trigger('click');
-
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[projects[0]]],
-          },
-          {
-            name: 'selected',
-            args: [[projects[0], projects[1]]],
-          },
-        ]);
+        return wrapper.vm
+          .$nextTick()
+          .then(() => {
+            findDropdownItems()
+              .at(1)
+              .trigger('click');
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
+            expect(wrapper.emittedByOrder()).toEqual([
+              {
+                name: 'selected',
+                args: [[projects[0]]],
+              },
+              {
+                name: 'selected',
+                args: [[projects[0], projects[1]]],
+              },
+            ]);
+          });
       });
 
       it('should remove from selection when clicked again', () => {
@@ -316,31 +328,36 @@ describe('ProjectsDropdownFilter component', () => {
         item.trigger('click');
         item.trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([
-          {
-            name: 'selected',
-            args: [[projects[0]]],
-          },
-          {
-            name: 'selected',
-            args: [[]],
-          },
-        ]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([
+            {
+              name: 'selected',
+              args: [[projects[0]]],
+            },
+            {
+              name: 'selected',
+              args: [[]],
+            },
+          ]);
+        });
       });
 
       it('renders the correct placeholder text when multiple projects are selected', done => {
         findDropdownItems()
           .at(0)
           .trigger('click');
-
-        findDropdownItems()
-          .at(1)
-          .trigger('click');
-
-        wrapper.vm.$nextTick(() => {
-          expect(findDropdownButton().text()).toBe('2 projects selected');
-          done();
-        });
+        return wrapper.vm
+          .$nextTick()
+          .then(() => {
+            findDropdownItems()
+              .at(1)
+              .trigger('click');
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
+            expect(findDropdownButton().text()).toBe('2 projects selected');
+            done();
+          });
       });
     });
   });

ee/spec/frontend/design_management/components/design_notes/design_reply_form_spec.js

@@ -45,7 +45,9 @@ describe('Design reply form component', () => {
         ctrlKey: true,
       });
 
-      expect(wrapper.emitted('submitForm')).toBeFalsy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('submitForm')).toBeFalsy();
+      });
     });
 
     it('does not emit submitForm event on textarea meta+enter keydown', () => {
@@ -53,7 +55,9 @@ describe('Design reply form component', () => {
         metaKey: true,
       });
 
-      expect(wrapper.emitted('submitForm')).toBeFalsy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('submitForm')).toBeFalsy();
+      });
     });
   });
 
@@ -71,7 +75,9 @@ describe('Design reply form component', () => {
     it('emits submitForm event on button click', () => {
       findSubmitButton().trigger('click');
 
-      expect(wrapper.emitted('submitForm')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('submitForm')).toBeTruthy();
+      });
     });
 
     it('emits submitForm event on textarea ctrl+enter keydown', () => {
@@ -79,7 +85,9 @@ describe('Design reply form component', () => {
         ctrlKey: true,
       });
 
-      expect(wrapper.emitted('submitForm')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('submitForm')).toBeTruthy();
+      });
     });
 
     it('emits submitForm event on textarea meta+enter keydown', () => {
@@ -87,19 +95,25 @@ describe('Design reply form component', () => {
         metaKey: true,
       });
 
-      expect(wrapper.emitted('submitForm')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('submitForm')).toBeTruthy();
+      });
     });
 
     it('emits input event on changing textarea content', () => {
       findTextarea().setValue('test2');
 
-      expect(wrapper.emitted('input')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('input')).toBeTruthy();
+      });
     });
 
     it('emits cancelForm event on pressing escape button on textarea', () => {
       findTextarea().trigger('keyup.esc');
 
-      expect(wrapper.emitted('cancelForm')).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('cancelForm')).toBeTruthy();
+      });
     });
   });
 });

ee/spec/frontend/design_management/components/design_overlay_spec.js

@@ -53,7 +53,9 @@ describe('Design overlay component', () => {
     createComponent();
     wrapper.find('.image-diff-overlay-add-comment').trigger('click', { offsetX: 10, offsetY: 10 });
 
-    expect(wrapper.emitted('openCommentForm')).toEqual([[{ x: 10, y: 10 }]]);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('openCommentForm')).toEqual([[{ x: 10, y: 10 }]]);
+    });
   });
 
   describe('when has notes', () => {

ee/spec/frontend/design_management/pages/index_spec.js

@@ -322,20 +322,26 @@ describe('Design management index page', () => {
       findDesignCheckboxes()
         .at(0)
         .trigger('click');
-      findDesignCheckboxes()
-        .at(1)
-        .trigger('click');
 
-      return wrapper.vm.$nextTick().then(() => {
-        expect(findDeleteButton().exists()).toBe(true);
-        expect(findSelectAllButton().text()).toBe('Deselect all');
-        findDeleteButton().vm.$emit('deleteSelectedDesigns');
-        const [{ variables }] = mutate.mock.calls[0];
-        expect(variables.filenames).toStrictEqual([
-          mockDesigns[0].filename,
-          mockDesigns[1].filename,
-        ]);
-      });
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
+          findDesignCheckboxes()
+            .at(1)
+            .trigger('click');
+
+          return wrapper.vm.$nextTick();
+        })
+        .then(() => {
+          expect(findDeleteButton().exists()).toBe(true);
+          expect(findSelectAllButton().text()).toBe('Deselect all');
+          findDeleteButton().vm.$emit('deleteSelectedDesigns');
+          const [{ variables }] = mutate.mock.calls[0];
+          expect(variables.filenames).toStrictEqual([
+            mockDesigns[0].filename,
+            mockDesigns[1].filename,
+          ]);
+        });
     });
 
     it('adds all designs to selected designs when Select All button is clicked', () => {
@@ -352,13 +358,17 @@ describe('Design management index page', () => {
       findDesignCheckboxes()
         .at(0)
         .trigger('click');
-      findSelectAllButton().vm.$emit('click');
 
-      return wrapper.vm.$nextTick().then(() => {
-        expect(findDeleteButton().props().hasSelectedDesigns).toBe(false);
-        expect(findSelectAllButton().text()).toBe('Select all');
-        expect(wrapper.vm.selectedDesigns).toEqual([]);
-      });
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
+          findSelectAllButton().vm.$emit('click');
+        })
+        .then(() => {
+          expect(findDeleteButton().props().hasSelectedDesigns).toBe(false);
+          expect(findSelectAllButton().text()).toBe('Select all');
+          expect(wrapper.vm.selectedDesigns).toEqual([]);
+        });
     });
   });
 

ee/spec/frontend/environments_dashboard/components/dashboard_spec.js

@@ -109,6 +109,7 @@ describe('dashboard', () => {
     describe('project selector modal', () => {
       beforeEach(() => {
         wrapper.find(GlButton).trigger('click');
+        return wrapper.vm.$nextTick();
       });
 
       it('should fire the add projects action on ok', () => {

ee/spec/frontend/epic/components/sidebar_items/sidebar_date_picker_spec.js

@@ -200,7 +200,10 @@ describe('SidebarDatePicker', () => {
     createComponent({ canUpdate: true });
 
     wrapper.find('input').trigger('click');
-    expect(wrapper.emitted().toggleDateType).toStrictEqual([[true]]);
+
+    return wrapper.vm.$nextTick(() => {
+      expect(wrapper.emitted().toggleDateType).toStrictEqual([[true]]);
+    });
   });
 
   it('emits `toggleCollapse` event when toggle-sidebar emits `toggle` event', () => {

ee/spec/frontend/feature_flags/components/form_spec.js

@@ -303,25 +303,33 @@ describe('feature flag form', () => {
       it('should emit handleSubmit with the updated data', () => {
         wrapper.find('#feature-flag-name').setValue('feature_flag_2');
 
-        wrapper
-          .find('.js-new-scope-name')
-          .find(EnvironmentsDropdown)
-          .vm.$emit('selectEnvironment', 'review');
-
-        wrapper
-          .find('.js-add-new-scope')
-          .find(ToggleButton)
-          .vm.$emit('change', true);
-
-        wrapper.find(ToggleButton).vm.$emit('change', true);
-
         return wrapper.vm
           .$nextTick()
+          .then(() => {
+            wrapper
+              .find('.js-new-scope-name')
+              .find(EnvironmentsDropdown)
+              .vm.$emit('selectEnvironment', 'review');
+
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
+            wrapper
+              .find('.js-add-new-scope')
+              .find(ToggleButton)
+              .vm.$emit('change', true);
+          })
+          .then(() => {
+            wrapper.find(ToggleButton).vm.$emit('change', true);
+            return wrapper.vm.$nextTick();
+          })
 
           .then(() => {
             selectFirstRolloutStrategyOption(0);
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
             selectFirstRolloutStrategyOption(2);
-
             return wrapper.vm.$nextTick();
           })
           .then(() => {

ee/spec/frontend/ide/components/terminal/session_spec.js

@@ -66,8 +66,10 @@ describe('EE IDE TerminalSession', () => {
       const button = wrapper.find('button');
       button.trigger('click');
 
-      expect(button.text()).toEqual('Stop Terminal');
-      expect(actions.stopSession).toHaveBeenCalled();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(button.text()).toEqual('Stop Terminal');
+        expect(actions.stopSession).toHaveBeenCalled();
+      });
     });
   });
 
@@ -79,8 +81,10 @@ describe('EE IDE TerminalSession', () => {
       const button = wrapper.find('button');
       button.trigger('click');
 
-      expect(button.text()).toEqual('Restart Terminal');
-      expect(actions.restartSession).toHaveBeenCalled();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(button.text()).toEqual('Restart Terminal');
+        expect(actions.restartSession).toHaveBeenCalled();
+      });
     });
   });
 });

ee/spec/frontend/packages/details/components/maven_installation_spec.js

@@ -102,11 +102,16 @@ describe('MavenInstallation', () => {
 
     it('should track when the installation tab is clicked', () => {
       setupTab().trigger('click');
-      installationTab().trigger('click');
-
-      expect(eventSpy).toHaveBeenCalledWith(undefined, TrackingActions.INSTALLATION, {
-        label,
-      });
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
+          installationTab().trigger('click');
+        })
+        .then(() => {
+          expect(eventSpy).toHaveBeenCalledWith(undefined, TrackingActions.INSTALLATION, {
+            label,
+          });
+        });
     });
   });
 });

ee/spec/frontend/packages/details/components/npm_installation_spec.js

@@ -97,11 +97,17 @@ describe('NpmInstallation', () => {
 
     it('should track when the installation tab is clicked', () => {
       setupTab().trigger('click');
-      installationTab().trigger('click');
 
-      expect(eventSpy).toHaveBeenCalledWith(undefined, TrackingActions.INSTALLATION, {
-        label,
-      });
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
+          installationTab().trigger('click');
+        })
+        .then(() => {
+          expect(eventSpy).toHaveBeenCalledWith(undefined, TrackingActions.INSTALLATION, {
+            label,
+          });
+        });
     });
   });
 });

ee/spec/frontend/related_issues/components/related_issuable_input_spec.js

@@ -81,7 +81,9 @@ describe('RelatedIssuableInput', () => {
 
       wrapper.find('li').trigger('click');
 
-      expect(document.activeElement).toBe(wrapper.find({ ref: 'input' }).element);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(document.activeElement).toBe(wrapper.find({ ref: 'input' }).element);
+      });
     });
   });
 

ee/spec/frontend/security_dashboard/components/project_list_spec.js

@@ -95,7 +95,9 @@ describe('Project List component', () => {
 
     getFirstRemoveButton().trigger('click');
 
-    expect(wrapper.emitted('projectRemoved')).toHaveLength(1);
-    expect(wrapper.emitted('projectRemoved')).toEqual([[projectData]]);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('projectRemoved')).toHaveLength(1);
+      expect(wrapper.emitted('projectRemoved')).toEqual([[projectData]]);
+    });
   });
 });

ee/spec/frontend/vue_mr_widget/components/approvals/approvals_footer_spec.js

@@ -146,7 +146,9 @@ describe('EE MRWidget approvals footer', () => {
 
         button.trigger('click');
 
-        expect(wrapper.emittedByOrder()).toEqual([{ name: 'input', args: [true] }]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emittedByOrder()).toEqual([{ name: 'input', args: [true] }]);
+        });
       });
     });
 

ee/spec/frontend/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js

@@ -223,15 +223,18 @@ describe('ReadyToMerge', () => {
       dialog.vm.show = jest.fn();
       vm.handleMergeButtonClick = jest.fn();
       findMergeButtonDropdown().trigger('click');
-      findMergeImmediatelyButton().trigger('click');
+      return wrapper.vm.$nextTick().then(() => {
+        findMergeImmediatelyButton().trigger('click');
+        return wrapper.vm.$nextTick();
+      });
     };
 
     it('should show a warning dialog asking for confirmation if the user is trying to skip the merge train', () => {
       factory({ preferredAutoMergeStrategy: MT_MERGE_STRATEGY });
-      clickMergeImmediately();
-
-      expect(dialog.vm.show).toHaveBeenCalled();
-      expect(vm.handleMergeButtonClick).not.toHaveBeenCalled();
+      return clickMergeImmediately().then(() => {
+        expect(dialog.vm.show).toHaveBeenCalled();
+        expect(vm.handleMergeButtonClick).not.toHaveBeenCalled();
+      });
     });
 
     it('should perform the merge when the user confirms their intent to merge immediately', () => {
@@ -245,10 +248,10 @@ describe('ReadyToMerge', () => {
 
     it('should not ask for confirmation in non-merge train scenarios', () => {
       factory({ isPipelineActive: true, onlyAllowMergeIfPipelineSucceeds: false });
-      clickMergeImmediately();
-
-      expect(dialog.vm.show).not.toHaveBeenCalled();
-      expect(vm.handleMergeButtonClick).toHaveBeenCalled();
+      return clickMergeImmediately().then(() => {
+        expect(dialog.vm.show).not.toHaveBeenCalled();
+        expect(vm.handleMergeButtonClick).toHaveBeenCalled();
+      });
     });
   });
 

ee/spec/frontend/vue_shared/security_reports/components/dismiss_button_spec.js

@@ -23,7 +23,9 @@ describe('DismissalButton', () => {
 
     it('should emit dismiss vulnerabilty when clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
-      expect(wrapper.emitted().dismissVulnerability).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().dismissVulnerability).toBeTruthy();
+      });
     });
 
     it('should render the dismiss with comment button', () => {
@@ -32,7 +34,9 @@ describe('DismissalButton', () => {
 
     it('should emit openDismissalCommentBox when clicked', () => {
       wrapper.find('.js-dismiss-with-comment').trigger('click');
-      expect(wrapper.emitted().openDismissalCommentBox).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().openDismissalCommentBox).toBeTruthy();
+      });
     });
   });
 
@@ -50,7 +54,9 @@ describe('DismissalButton', () => {
 
     it('should emit revertDismissVulnerabilty when clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
-      expect(wrapper.emitted().revertDismissVulnerability).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().revertDismissVulnerability).toBeTruthy();
+      });
     });
 
     it('should not render the dismiss with comment button', () => {

ee/spec/frontend/vue_shared/security_reports/components/dismissal_comment_box_spec.js

@@ -23,7 +23,9 @@ describe('DismissalCommentBox', () => {
       metaKey: true,
     });
 
-    expect(wrapper.emitted().submit).toBeTruthy();
+    return wrapper.vm.$nextTick(() => {
+      expect(wrapper.emitted().submit).toBeTruthy();
+    });
   });
 
   it('should render the error message', () => {

ee/spec/frontend/vue_shared/security_reports/components/dismissal_comment_modal_footer_spec.js

@@ -31,16 +31,21 @@ describe('DismissalCommentModalFooter', () => {
     it('should emit the "addCommentAndDismiss" event when clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
 
-      expect(wrapper.emitted().addCommentAndDismiss).toBeTruthy();
-      expect(Tracking.event).toHaveBeenCalledWith(
-        '_track_category_',
-        'click_add_comment_and_dismiss',
-      );
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().addCommentAndDismiss).toBeTruthy();
+        expect(Tracking.event).toHaveBeenCalledWith(
+          '_track_category_',
+          'click_add_comment_and_dismiss',
+        );
+      });
     });
 
     it('should emit the cancel event when the cancel button is clicked', () => {
       wrapper.find('.js-cancel').trigger('click');
-      expect(wrapper.emitted().cancel).toBeTruthy();
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().cancel).toBeTruthy();
+      });
     });
   });
 
@@ -60,8 +65,10 @@ describe('DismissalCommentModalFooter', () => {
       it('should emit the "addCommentAndDismiss" event when clicked', () => {
         wrapper.find(LoadingButton).trigger('click');
 
-        expect(wrapper.emitted().addDismissalComment).toBeTruthy();
-        expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_add_comment');
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().addDismissalComment).toBeTruthy();
+          expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_add_comment');
+        });
       });
     });
 
@@ -81,8 +88,10 @@ describe('DismissalCommentModalFooter', () => {
       it('should emit the "addCommentAndDismiss" event when clicked', () => {
         wrapper.find(LoadingButton).trigger('click');
 
-        expect(wrapper.emitted().addDismissalComment).toBeTruthy();
-        expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_edit_comment');
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().addDismissalComment).toBeTruthy();
+          expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_edit_comment');
+        });
       });
     });
   });

ee/spec/frontend/vue_shared/security_reports/components/event_item_spec.js

@@ -84,10 +84,16 @@ describe('Event Item', () => {
     it('emits the button events when clicked', () => {
       const buttons = wrapper.findAll('.action-buttons > button');
       buttons.at(0).trigger('click');
-      buttons.at(1).trigger('click');
-
-      expect(wrapper.emitted().fooEvent.length).toEqual(1);
-      expect(wrapper.emitted().barEvent.length).toEqual(1);
+      return wrapper.vm
+        .$nextTick()
+        .then(() => {
+          buttons.at(1).trigger('click');
+          return wrapper.vm.$nextTick();
+        })
+        .then(() => {
+          expect(wrapper.emitted().fooEvent.length).toEqual(1);
+          expect(wrapper.emitted().barEvent.length).toEqual(1);
+        });
     });
   });
 });

ee/spec/frontend/vue_shared/security_reports/components/modal_footer_spec.js

@@ -32,7 +32,10 @@ describe('Security Reports modal footer', () => {
 
     it('emits createIssue when create issue button is clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
-      expect(wrapper.emitted().createNewIssue).toBeTruthy();
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().createNewIssue).toBeTruthy();
+      });
     });
   });
 
@@ -52,7 +55,10 @@ describe('Security Reports modal footer', () => {
 
     it('emits createMergeRequest when create merge request button is clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
-      expect(wrapper.emitted().createMergeRequest).toBeTruthy();
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().createMergeRequest).toBeTruthy();
+      });
     });
   });
 
@@ -72,7 +78,10 @@ describe('Security Reports modal footer', () => {
 
     it('emits downloadPatch when download patch button is clicked', () => {
       wrapper.find(LoadingButton).trigger('click');
-      expect(wrapper.emitted().downloadPatch).toBeTruthy();
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().downloadPatch).toBeTruthy();
+      });
     });
   });
 

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', () => {

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/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/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/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/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/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/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_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');
+      });
     });
   });
 });