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');
 
-      expect(wrapper.emitted().columnMetricChange[0]).toEqual(['time_to_first_comment']);
+      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,7 +40,10 @@ describe('DateRangeDropdown component', () => {
 
   it('emits the "selected" event with the selected item value', () => {
     findFirstDropdownElement().vm.$emit('click');
-    expect(wrapper.emitted().selected[0]).toEqual([7]);
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().selected[0]).toEqual([7]);
+    });
   });
 
   it('it renders the correct dropdown text when no item is selected', () => {

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

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

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

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

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

@@ -42,8 +42,10 @@ describe('burndown_chart', () => {
 
     weightButton().vm.$emit('click');
 
-    expect(issuesButton().attributes('variant')).toBe('inverted-primary');
-    expect(weightButton().attributes('variant')).toBe('primary');
+    return wrapper.vm.$nextTick().then(() => {
+      expect(issuesButton().attributes('variant')).toBe('inverted-primary');
+      expect(weightButton().attributes('variant')).toBe('primary');
+    });
   });
 
   describe('with single point', () => {

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');
-    findModal().vm.$emit('ok');
-
-    expect(wrapper.emitted().deleteSelectedDesigns).toBeTruthy();
+    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');
-      expect(wrapper.emitted('remove')).toContainEqual([propsData.project.remove_path]);
+
+      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,7 +210,9 @@ describe('SidebarDatePicker', () => {
     createComponent({ showToggleSidebar: true });
     wrapper.find(ToggleSidebar).vm.$emit('toggle');
 
-    expect(wrapper.emitted().toggleCollapse).toBeDefined();
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().toggleCollapse).toBeDefined();
+    });
   });
 
   it('renders expected template', () => {

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

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

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

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

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

@@ -129,7 +129,9 @@ describe('Feature flag table', () => {
       toggle.vm.$emit('change');
       const flag = { ...props.featureFlags[0], active: !props.featureFlags[0].active };
 
-      expect(wrapper.emitted('toggle-flag')).toEqual([[flag]]);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('toggle-flag')).toEqual([[flag]]);
+      });
     });
   });
 

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

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

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

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

ee/spec/frontend/monitoring/alert_widget_spec.js

@@ -204,8 +204,10 @@ describe('AlertWidget', () => {
 
     findWidgetForm().vm.$emit('delete', { alert: alertPath });
 
-    expect(mockDeleteAlert).toHaveBeenCalledWith(alertPath);
-    expect(findAlertErrorMessage().exists()).toBe(false);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(mockDeleteAlert).toHaveBeenCalledWith(alertPath);
+      expect(findAlertErrorMessage().exists()).toBe(false);
+    });
   });
 
   describe('when delete fails', () => {
@@ -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,12 +56,14 @@ describe('project header component', () => {
     it('emits project removal link on click', () => {
       wrapper.find('.js-remove-button').vm.$emit('click');
 
-      expect(wrapper.emittedByOrder()).toContainEqual(
-        expect.objectContaining({
-          name: 'remove',
-          args: [mockOneProject.remove_path],
-        }),
-      );
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emittedByOrder()).toContainEqual(
+          expect.objectContaining({
+            name: 'remove',
+            args: [mockOneProject.remove_path],
+          }),
+        );
+      });
     });
   });
 

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

@@ -53,10 +53,13 @@ describe('ResetKey', () => {
 
       vm.find(GlModal).vm.$emit('ok');
 
-      return waitForPromises().then(() => {
-        expect(vm.vm.authorizationKey).toEqual('newToken');
-        expect(vm.find('#authorization-key').attributes('value')).toEqual('newToken');
-      });
+      return vm.vm
+        .$nextTick()
+        .then(waitForPromises)
+        .then(() => {
+          expect(vm.vm.authorizationKey).toEqual('newToken');
+          expect(vm.find('#authorization-key').attributes('value')).toEqual('newToken');
+        });
     });
 
     it('reset key failure shows error', () => {
@@ -64,15 +67,18 @@ describe('ResetKey', () => {
 
       vm.find(GlModal).vm.$emit('ok');
 
-      return waitForPromises().then(() => {
-        expect(vm.find('#authorization-key').attributes('value')).toEqual(
-          propsData.initialAuthorizationKey,
-        );
-
-        expect(document.querySelector('.flash-container').innerText.trim()).toEqual(
-          'Failed to reset key. Please try again.',
-        );
-      });
+      return vm.vm
+        .$nextTick()
+        .then(waitForPromises)
+        .then(() => {
+          expect(vm.find('#authorization-key').attributes('value')).toEqual(
+            propsData.initialAuthorizationKey,
+          );
+
+          expect(document.querySelector('.flash-container').innerText.trim()).toEqual(
+            'Failed to reset key. Please try again.',
+          );
+        });
     });
   });
 

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,11 +239,14 @@ describe('ReadyToMerge', () => {
 
     it('should perform the merge when the user confirms their intent to merge immediately', () => {
       factory({ preferredAutoMergeStrategy: MT_MERGE_STRATEGY });
-      clickMergeImmediately();
-
-      dialog.vm.$emit('mergeImmediately');
-
-      expect(vm.handleMergeButtonClick).toHaveBeenCalled();
+      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', () => {

spec/frontend/clusters/components/knative_domain_editor_spec.js

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

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', () => {
-      expect(wrapper.emitted('confirm')).toBeTruthy();
-    });
+    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,7 +70,9 @@ describe('CrossplaneProviderStack component', () => {
     };
     createComponent({ crossplane });
     findFirstDropdownElement().vm.$emit('click');
-    expect(wrapper.emitted().set[0][0].code).toEqual('gcp');
+    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', () => {

spec/frontend/diffs/components/diff_file_header_spec.js

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

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

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

spec/frontend/notes/components/discussion_notes_spec.js

@@ -119,17 +119,26 @@ describe('DiscussionNotes', () => {
 
       it('emits deleteNote when first note emits handleDeleteNote', () => {
         findNoteAtIndex(0).vm.$emit('handleDeleteNote');
-        expect(wrapper.emitted().deleteNote).toBeTruthy();
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().deleteNote).toBeTruthy();
+        });
       });
 
       it('emits startReplying when first note emits startReplying', () => {
         findNoteAtIndex(0).vm.$emit('startReplying');
-        expect(wrapper.emitted().startReplying).toBeTruthy();
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().startReplying).toBeTruthy();
+        });
       });
 
       it('emits deleteNote when second note emits handleDeleteNote', () => {
         findNoteAtIndex(1).vm.$emit('handleDeleteNote');
-        expect(wrapper.emitted().deleteNote).toBeTruthy();
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().deleteNote).toBeTruthy();
+        });
       });
     });
 
@@ -142,7 +151,10 @@ describe('DiscussionNotes', () => {
 
       it('emits deleteNote when first note emits handleDeleteNote', () => {
         note.vm.$emit('handleDeleteNote');
-        expect(wrapper.emitted().deleteNote).toBeTruthy();
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().deleteNote).toBeTruthy();
+        });
       });
     });
   });

spec/frontend/repository/components/last_commit_spec.js

@@ -106,8 +106,10 @@ describe('Repository last commit component', () => {
 
     vm.find('.text-expander').vm.$emit('click');
 
-    expect(vm.find('.commit-row-description').isVisible()).toBe(true);
-    expect(vm.find('.text-expander').classes('open')).toBe(true);
+    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', () => {

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');
 
-    expect(wrapper.emitted().input[0]).toEqual(['Update test.txt']);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().input[0]).toEqual(['Update test.txt']);
+    });
   });
 });