Merge branch 'winh-jest-confidential_issue_sidebar_spec' into 'master'

Migrate confidential_issue_sidebar_spec.js to Jest

See merge request gitlab-org/gitlab!17550

spec/frontend/helpers/tracking_helper.js

+import Tracking from '~/tracking';
+
+export default Tracking;
+
+let document;
+let handlers;
+
+export function mockTracking(category = '_category_', documentOverride, spyMethod) {
+  document = documentOverride || window.document;
+  window.snowplow = () => {};
+  Tracking.bindDocument(category, document);
+  return spyMethod ? spyMethod(Tracking, 'event') : null;
+}
+
+export function unmockTracking() {
+  window.snowplow = undefined;
+  handlers.forEach(event => document.removeEventListener(event.name, event.func));
+}
+
+export function triggerEvent(selectorOrEl, eventName = 'click') {
+  const event = new Event(eventName, { bubbles: true });
+  const el = typeof selectorOrEl === 'string' ? document.querySelector(selectorOrEl) : selectorOrEl;
+
+  el.dispatchEvent(event);
+}

spec/javascripts/sidebar/confidential_issue_sidebar_spec.js → spec/frontend/sidebar/confidential_issue_sidebar_spec.js

 import Vue from 'vue';
 import confidentialIssueSidebar from '~/sidebar/components/confidential/confidential_issue_sidebar.vue';
-import { mockTracking, triggerEvent } from 'spec/helpers/tracking_helper';
+import { mockTracking, triggerEvent } from 'helpers/tracking_helper';
 
 describe('Confidential Issue Sidebar Block', () => {
   let vm1;
@@ -37,40 +37,36 @@ describe('Confidential Issue Sidebar Block', () => {
     expect(vm2.$el.innerHTML.includes('Not confidential')).toBe(true);
   });
 
-  it('displays the edit form when editable', done => {
+  it('displays the edit form when editable', () => {
     expect(vm1.edit).toBe(false);
 
     vm1.$el.querySelector('.confidential-edit').click();
 
     expect(vm1.edit).toBe(true);
 
-    setTimeout(() => {
+    return Vue.nextTick().then(() => {
       expect(vm1.$el.innerHTML.includes('You are going to turn off the confidentiality.')).toBe(
         true,
       );
-
-      done();
     });
   });
 
-  it('displays the edit form when opened from collapsed state', done => {
+  it('displays the edit form when opened from collapsed state', () => {
     expect(vm1.edit).toBe(false);
 
     vm1.$el.querySelector('.sidebar-collapsed-icon').click();
 
     expect(vm1.edit).toBe(true);
 
-    setTimeout(() => {
+    return Vue.nextTick().then(() => {
       expect(vm1.$el.innerHTML.includes('You are going to turn off the confidentiality.')).toBe(
         true,
       );
-
-      done();
     });
   });
 
   it('tracks the event when "Edit" is clicked', () => {
-    const spy = mockTracking('_category_', vm1.$el, spyOn);
+    const spy = mockTracking('_category_', vm1.$el, jest.spyOn);
     triggerEvent('.confidential-edit');
 
     expect(spy).toHaveBeenCalledWith('_category_', 'click_edit_button', {