Wrap emit calls to nextTick

Ensure we are updating templates when we're emitting things

ee/spec/frontend/analytics/productivity_analytics/components/app_spec.js

@@ -270,6 +270,7 @@ describe('ProductivityApp component', () => {
                     beforeEach(() => {
                       jest.spyOn(store, 'dispatch');
                       findCommitBasedMetricChart().vm.$emit('metricTypeChange', 'loc_per_commit');
+                      return wrapper.vm.$nextTick();
                     });
 
                     it('should call setMetricType  when `metricTypeChange` is emitted on the metric chart', () => {
@@ -326,6 +327,7 @@ describe('ProductivityApp component', () => {
                       beforeEach(() => {
                         jest.spyOn(store, 'dispatch');
                         findScatterplotMetricChart().vm.$emit('metricTypeChange', 'loc_per_commit');
+                        return wrapper.vm.$nextTick();
                       });
 
                       it('should call setMetricType  when `metricTypeChange` is emitted on the metric chart', () => {

ee/spec/frontend/analytics/productivity_analytics/components/mr_table_spec.js

@@ -79,7 +79,9 @@ describe('MergeRequestTable component', () => {
     it('it emits the metric key when item is selected from the dropdown', () => {
       findFirstDropdownItem().vm.$emit('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().columnMetricChange[0]).toEqual(['time_to_first_comment']);
       });
     });
+  });
 });

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

@@ -40,8 +40,11 @@ describe('DateRangeDropdown component', () => {
 
   it('emits the "selected" event with the selected item value', () => {
     findFirstDropdownElement().vm.$emit('click');
+
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().selected[0]).toEqual([7]);
     });
+  });
 
   it('it renders the correct dropdown text when no item is selected', () => {
     expect(wrapper.vm.dropdownText).toBe('Select timeframe');

ee/spec/frontend/approvals/components/approvers_list_item_spec.js

@@ -53,9 +53,11 @@ describe('Approvals ApproversListItem', () => {
       const button = wrapper.find(GlButton);
       button.vm.$emit('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emittedByOrder()).toEqual([{ name: 'remove', args: [TEST_USER] }]);
       });
     });
+  });
 
   describe('when group', () => {
     beforeEach(() => {

ee/spec/frontend/approvals/components/approvers_list_spec.js

@@ -64,10 +64,12 @@ describe('ApproversList', () => {
         const item = wrapper.findAll(ApproversListItem).at(idx);
         item.vm.$emit('remove', approver);
 
+        return wrapper.vm.$nextTick().then(() => {
           const expected = TEST_APPROVERS.filter((x, i) => i !== idx);
 
           expect(wrapper.emittedByOrder()).toEqual([{ name: 'input', args: [expected] }]);
         });
       });
     });
+  });
 });

ee/spec/frontend/burndown_chart/components/burndown_chart_spec.js

@@ -42,9 +42,11 @@ describe('burndown_chart', () => {
 
     weightButton().vm.$emit('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(issuesButton().attributes('variant')).toBe('inverted-primary');
       expect(weightButton().attributes('variant')).toBe('primary');
     });
+  });
 
   describe('with single point', () => {
     it('does not show guideline', () => {

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

@@ -39,8 +39,14 @@ describe('Batch delete button component', () => {
   it('emits `deleteSelectedDesigns` event on modal ok click', () => {
     createComponent();
     findButton().vm.$emit('click');
+    return wrapper.vm
+      .$nextTick()
+      .then(() => {
         findModal().vm.$emit('ok');
-
+        return wrapper.vm.$nextTick();
+      })
+      .then(() => {
         expect(wrapper.emitted().deleteSelectedDesigns).toBeTruthy();
       });
+  });
 });

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

@@ -87,7 +87,10 @@ describe('Project Header', () => {
         .at(0)
         .find(GlButton)
         .vm.$emit('click');
+
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('remove')).toContainEqual([propsData.project.remove_path]);
       });
     });
+  });
 });

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

@@ -210,8 +210,10 @@ describe('SidebarDatePicker', () => {
     createComponent({ showToggleSidebar: true });
     wrapper.find(ToggleSidebar).vm.$emit('toggle');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().toggleCollapse).toBeDefined();
     });
+  });
 
   it('renders expected template', () => {
     createComponent({

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

@@ -29,8 +29,10 @@ describe('Configure Feature Flags Modal', () => {
   describe('rotate token', () => {
     it('should emit a `token` event on click', () => {
       wrapper.find(GlButton).vm.$emit('click');
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('token')).toEqual([[]]);
       });
+    });
 
     it('should display an error if there is a rotate error', () => {
       wrapper.setProps({ hasRotateError: true });

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

@@ -82,9 +82,11 @@ describe('Feature flags > Environments dropdown ', () => {
             .at(0);
           button.vm.$emit('click');
 
+          return wrapper.vm.$nextTick().then(() => {
             expect(wrapper.emitted('selectEnvironment')).toEqual([['production']]);
           });
         });
+      });
       describe('on click clear button', () => {
         beforeEach(() => {
           wrapper.find(GlButton).vm.$emit('click');
@@ -118,7 +120,9 @@ describe('Feature flags > Environments dropdown ', () => {
         .at(1)
         .vm.$emit('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('createClicked')).toEqual([['production']]);
       });
     });
+  });
 });

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

@@ -129,9 +129,11 @@ describe('Feature flag table', () => {
       toggle.vm.$emit('change');
       const flag = { ...props.featureFlags[0], active: !props.featureFlags[0].active };
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('toggle-flag')).toEqual([[flag]]);
       });
     });
+  });
 
   describe('with an active scope and a percentage rollout strategy', () => {
     beforeEach(() => {

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

@@ -49,8 +49,10 @@ describe('EE IDE TerminalControls', () => {
 
     buttons.at(0).vm.$emit('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emittedByOrder()).toEqual([{ name: 'scroll-up', args: [] }]);
     });
+  });
 
   it('emits "scroll-down" when click down button', () => {
     factory({ propsData: { canScrollDown: true } });
@@ -59,6 +61,8 @@ describe('EE IDE TerminalControls', () => {
 
     buttons.at(1).vm.$emit('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emittedByOrder()).toEqual([{ name: 'scroll-down', args: [] }]);
     });
+  });
 });

ee/spec/frontend/logs/components/log_control_buttons_spec.js

@@ -50,8 +50,10 @@ describe('LogControlButtons', () => {
 
     findRefreshBtn().vm.$emit('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted('refresh')).toHaveLength(1);
     });
+  });
 
   describe('when scrolling actions are enabled', () => {
     beforeEach(() => {

ee/spec/frontend/monitoring/alert_widget_spec.js

@@ -204,9 +204,11 @@ describe('AlertWidget', () => {
 
     findWidgetForm().vm.$emit('delete', { alert: alertPath });
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(mockDeleteAlert).toHaveBeenCalledWith(alertPath);
       expect(findAlertErrorMessage().exists()).toBe(false);
     });
+  });
 
   describe('when delete fails', () => {
     beforeEach(() => {
@@ -227,6 +229,7 @@ describe('AlertWidget', () => {
       });
 
       findWidgetForm().vm.$emit('delete', { alert: alertPath });
+      return wrapper.vm.$nextTick();
     });
 
     it('shows error message', () => {

ee/spec/frontend/operations/components/dashboard/project_header_spec.js

@@ -56,6 +56,7 @@ describe('project header component', () => {
     it('emits project removal link on click', () => {
       wrapper.find('.js-remove-button').vm.$emit('click');
 
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emittedByOrder()).toContainEqual(
           expect.objectContaining({
             name: 'remove',
@@ -64,6 +65,7 @@ describe('project header component', () => {
         );
       });
     });
+  });
 
   describe('wrapped components', () => {
     describe('project avatar', () => {

ee/spec/frontend/prometheus_alerts/components/reset_key_spec.js

@@ -53,7 +53,10 @@ describe('ResetKey', () => {
 
       vm.find(GlModal).vm.$emit('ok');
 
-      return waitForPromises().then(() => {
+      return vm.vm
+        .$nextTick()
+        .then(waitForPromises)
+        .then(() => {
           expect(vm.vm.authorizationKey).toEqual('newToken');
           expect(vm.find('#authorization-key').attributes('value')).toEqual('newToken');
         });
@@ -64,7 +67,10 @@ describe('ResetKey', () => {
 
       vm.find(GlModal).vm.$emit('ok');
 
-      return waitForPromises().then(() => {
+      return vm.vm
+        .$nextTick()
+        .then(waitForPromises)
+        .then(() => {
           expect(vm.find('#authorization-key').attributes('value')).toEqual(
             propsData.initialAuthorizationKey,
           );

ee/spec/frontend/threat_monitoring/components/app_spec.js

@@ -92,6 +92,7 @@ describe('ThreatMonitoringApp component', () => {
     describe('dismissing the alert', () => {
       beforeEach(() => {
         findAlert().vm.$emit('dismiss');
+        return wrapper.vm.$nextTick();
       });
 
       it('hides the alert', () => {

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

@@ -239,12 +239,15 @@ describe('ReadyToMerge', () => {
 
     it('should perform the merge when the user confirms their intent to merge immediately', () => {
       factory({ preferredAutoMergeStrategy: MT_MERGE_STRATEGY });
-      clickMergeImmediately();
-
+      return clickMergeImmediately()
+        .then(() => {
           dialog.vm.$emit('mergeImmediately');
-
+          return wrapper.vm.$nextTick();
+        })
+        .then(() => {
           expect(vm.handleMergeButtonClick).toHaveBeenCalled();
         });
+    });
 
     it('should not ask for confirmation in non-merge train scenarios', () => {
       factory({ isPipelineActive: true, onlyAllowMergeIfPipelineSucceeds: false });

spec/frontend/clusters/components/knative_domain_editor_spec.js

@@ -79,9 +79,11 @@ describe('KnativeDomainEditor', () => {
 
     it('triggers save event and pass current knative hostname', () => {
       wrapper.find(LoadingButton).vm.$emit('click');
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('save')[0]).toEqual([knative.hostname]);
       });
     });
+  });
 
   describe('when knative domain name was saved successfully', () => {
     beforeEach(() => {

spec/frontend/clusters/components/uninstall_application_confirmation_modal_spec.js

@@ -35,9 +35,10 @@ describe('UninstallApplicationConfirmationModal', () => {
       wrapper.find(GlModal).vm.$emit('ok');
     });
 
-    it('emits confirm event', () => {
+    it('emits confirm event', () =>
+      wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted('confirm')).toBeTruthy();
-    });
+      }));
 
     it('calls track uninstall button click mixin', () => {
       expect(wrapper.vm.trackUninstallButtonClick).toHaveBeenCalledWith(INGRESS);

spec/frontend/clusters/services/crossplane_provider_stack_spec.js

@@ -70,8 +70,10 @@ describe('CrossplaneProviderStack component', () => {
     };
     createComponent({ crossplane });
     findFirstDropdownElement().vm.$emit('click');
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().set[0][0].code).toEqual('gcp');
     });
+  });
 
   it('renders the correct dropdown text when no stack is selected', () => {
     expect(wrapper.vm.dropdownText).toBe('Select Stack');

spec/frontend/diffs/components/diff_file_header_spec.js

@@ -126,8 +126,10 @@ describe('DiffFileHeader component', () => {
   it('when collapseIcon is clicked emits toggleFile', () => {
     createComponent({ collapsible: true });
     findCollapseIcon().vm.$emit('click', new Event('click'));
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().toggleFile).toBeDefined();
     });
+  });
 
   it('when other element in header is clicked does not emits toggleFile', () => {
     createComponent({ collapsible: true });
@@ -200,8 +202,10 @@ describe('DiffFileHeader component', () => {
         addMergeRequestButtons: true,
       });
       wrapper.find(EditButton).vm.$emit('showForkMessage');
+      return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().showForkMessage).toBeDefined();
       });
+    });
 
     it('for mode_changed file mode displays mode changes', () => {
       createComponent({

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

@@ -65,8 +65,10 @@ describe('IDE pipeline stage', () => {
       .findAll(Item)
       .at(0)
       .vm.$emit('clickViewLog', job);
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().clickViewLog[0][0]).toBe(job);
     });
+  });
 
   it('renders stage details & icon', () => {
     createComponent();

spec/frontend/notes/components/discussion_notes_spec.js

@@ -119,19 +119,28 @@ describe('DiscussionNotes', () => {
 
       it('emits deleteNote when first note emits handleDeleteNote', () => {
         findNoteAtIndex(0).vm.$emit('handleDeleteNote');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.emitted().deleteNote).toBeTruthy();
         });
+      });
 
       it('emits startReplying when first note emits startReplying', () => {
         findNoteAtIndex(0).vm.$emit('startReplying');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.emitted().startReplying).toBeTruthy();
         });
+      });
 
       it('emits deleteNote when second note emits handleDeleteNote', () => {
         findNoteAtIndex(1).vm.$emit('handleDeleteNote');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.emitted().deleteNote).toBeTruthy();
         });
       });
+    });
 
     describe('with ungroupped notes', () => {
       let note;
@@ -142,10 +151,13 @@ describe('DiscussionNotes', () => {
 
       it('emits deleteNote when first note emits handleDeleteNote', () => {
         note.vm.$emit('handleDeleteNote');
+
+        return wrapper.vm.$nextTick().then(() => {
           expect(wrapper.emitted().deleteNote).toBeTruthy();
         });
       });
     });
+  });
 
   describe('componentData', () => {
     beforeEach(() => {

spec/frontend/repository/components/last_commit_spec.js

@@ -106,9 +106,11 @@ describe('Repository last commit component', () => {
 
     vm.find('.text-expander').vm.$emit('click');
 
+    return vm.vm.$nextTick().then(() => {
       expect(vm.find('.commit-row-description').isVisible()).toBe(true);
       expect(vm.find('.text-expander').classes('open')).toBe(true);
     });
+  });
 
   it('renders the signature HTML as returned by the backend', () => {
     factory(createCommitData({ signatureHtml: '<button>Verified</button>' }));

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

@@ -56,6 +56,8 @@ describe('Commits message dropdown component', () => {
   it('should emit a commit title on selecting commit', () => {
     findFirstDropdownElement().vm.$emit('click');
 
+    return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted().input[0]).toEqual(['Update test.txt']);
     });
+  });
 });