Add latest changes from gitlab-org/gitlab@master

2 files changed, 35 insertions, 14 deletions

diff --git a/spec/frontend/header_spec.js b/spec/frontend/header_spec.js
index 19849fba63c..4e2fb70a2cb 100644
--- a/spec/frontend/header_spec.js
+++ b/spec/frontend/header_spec.js
@@ -1,4 +1,3 @@
-import $ from 'jquery';
 import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
 import initTodoToggle, { initNavUserDropdownTracking } from '~/header';
 import { loadHTMLFixture, setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
@@ -9,11 +8,17 @@ describe('Header', () => {
     const fixtureTemplate = 'issues/open-issue.html';
 
     function isTodosCountHidden() {
-      return $(todosPendingCount).hasClass('hidden');
+      return document.querySelector(todosPendingCount).classList.contains('hidden');
     }
 
     function triggerToggle(newCount) {
-      $(document).trigger('todo:toggle', newCount);
+      const event = new CustomEvent('todo:toggle', {
+        detail: {
+          count: newCount,
+        },
+      });
+
+      document.dispatchEvent(event);
     }
 
     beforeEach(() => {
@@ -28,7 +33,7 @@ describe('Header', () => {
     it('should update todos-count after receiving the todo:toggle event', () => {
       triggerToggle(5);
 
-      expect($(todosPendingCount).text()).toEqual('5');
+      expect(document.querySelector(todosPendingCount).textContent).toEqual('5');
     });
 
     it('should hide todos-count when it is 0', () => {
@@ -53,7 +58,7 @@ describe('Header', () => {
       });
 
       it('should show 99+ for todos-count', () => {
-        expect($(todosPendingCount).text()).toEqual('99+');
+        expect(document.querySelector(todosPendingCount).textContent).toEqual('99+');
       });
     });
   });
@@ -67,7 +72,11 @@ describe('Header', () => {
         <a class="js-buy-pipeline-minutes-link" data-track-action="click_buy_ci_minutes" data-track-label="free" data-track-property="user_dropdown">Buy Pipeline minutes</a>
       </li>`);
 
-      trackingSpy = mockTracking('_category_', $('.js-nav-user-dropdown').element, jest.spyOn);
+      trackingSpy = mockTracking(
+        '_category_',
+        document.querySelector('.js-nav-user-dropdown').element,
+        jest.spyOn,
+      );
       document.body.dataset.page = 'some:page';
 
       initNavUserDropdownTracking();
@@ -79,7 +88,8 @@ describe('Header', () => {
     });
 
     it('sends a tracking event when the dropdown is opened and contains Buy Pipeline minutes link', () => {
-      $('.js-nav-user-dropdown').trigger('shown.bs.dropdown');
+      const event = new CustomEvent('shown.bs.dropdown');
+      document.querySelector('.js-nav-user-dropdown').dispatchEvent(event);
 
       expect(trackingSpy).toHaveBeenCalledWith('some:page', 'show_buy_ci_minutes', {
         label: 'free',
diff --git a/spec/frontend/pages/dashboard/todos/index/todos_spec.js b/spec/frontend/pages/dashboard/todos/index/todos_spec.js
index 3a9b59f291c..03aed7454e3 100644
--- a/spec/frontend/pages/dashboard/todos/index/todos_spec.js
+++ b/spec/frontend/pages/dashboard/todos/index/todos_spec.js
@@ -1,5 +1,4 @@
 import MockAdapter from 'axios-mock-adapter';
-import $ from 'jquery';
 import { loadHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
 import waitForPromises from 'helpers/wait_for_promises';
 import '~/lib/utils/common_utils';
@@ -54,22 +53,28 @@ describe('Todos', () => {
       let metakeyEvent;
 
       beforeEach(() => {
-        metakeyEvent = $.Event('click', { keyCode: 91, ctrlKey: true });
+        metakeyEvent = new MouseEvent('click', { ctrlKey: true });
         windowOpenSpy = jest.spyOn(window, 'open').mockImplementation(() => {});
       });
 
       it('opens the todo url in another tab', () => {
         const todoLink = todoItem.dataset.url;
 
-        $('.todos-list .todo').trigger(metakeyEvent);
+        document.querySelectorAll('.todos-list .todo').forEach((el) => {
+          el.dispatchEvent(metakeyEvent);
+        });
 
         expect(visitUrl).not.toHaveBeenCalled();
         expect(windowOpenSpy).toHaveBeenCalledWith(todoLink, '_blank');
       });
 
       it('run native funcionality when avatar is clicked', () => {
-        $('.todos-list a').on('click', (e) => e.preventDefault());
-        $('.todos-list img').trigger(metakeyEvent);
+        document.querySelectorAll('.todos-list a').forEach((el) => {
+          el.addEventListener('click', (e) => e.preventDefault());
+        });
+        document.querySelectorAll('.todos-list img').forEach((el) => {
+          el.dispatchEvent(metakeyEvent);
+        });
 
         expect(visitUrl).not.toHaveBeenCalled();
         expect(windowOpenSpy).not.toHaveBeenCalled();
@@ -88,7 +93,7 @@ describe('Todos', () => {
           .onDelete(path)
           .replyOnce(200, { count: TEST_COUNT_BIG, done_count: TEST_DONE_COUNT_BIG });
         onToggleSpy = jest.fn();
-        $(document).on('todo:toggle', onToggleSpy);
+        document.addEventListener('todo:toggle', onToggleSpy);
 
         // Act
         el.click();
@@ -98,7 +103,13 @@ describe('Todos', () => {
       });
 
       it('dispatches todo:toggle', () => {
-        expect(onToggleSpy).toHaveBeenCalledWith(expect.anything(), TEST_COUNT_BIG);
+        expect(onToggleSpy).toHaveBeenCalledWith(
+          expect.objectContaining({
+            detail: {
+              count: TEST_COUNT_BIG,
+            },
+          }),
+        );
       });
 
       it('updates pending text', () => {