Add latest changes from gitlab-org/gitlab@master

26 files changed, 72 insertions, 66 deletions

diff --git a/spec/frontend/alert_handler_spec.js b/spec/frontend/alert_handler_spec.js
index e4cd38a7799..228053b1b2b 100644
--- a/spec/frontend/alert_handler_spec.js
+++ b/spec/frontend/alert_handler_spec.js
@@ -26,12 +26,12 @@ describe('Alert Handler', () => {
       });
 
       it('should render the alert', () => {
-        expect(findFirstAlert()).toExist();
+        expect(findFirstAlert()).not.toBe(null);
       });
 
       it('should dismiss the alert on click', () => {
         findFirstDismissButton().click();
-        expect(findFirstAlert()).not.toExist();
+        expect(findFirstAlert()).toBe(null);
       });
     });
 
@@ -58,12 +58,12 @@ describe('Alert Handler', () => {
       });
 
       it('should render the banner', () => {
-        expect(findFirstBanner()).toExist();
+        expect(findFirstBanner()).not.toBe(null);
       });
 
       it('should dismiss the banner on click', () => {
         findFirstDismissButton().click();
-        expect(findFirstBanner()).not.toExist();
+        expect(findFirstBanner()).toBe(null);
       });
     });
 
@@ -79,12 +79,12 @@ describe('Alert Handler', () => {
       });
 
       it('should render the banner', () => {
-        expect(findFirstAlert()).toExist();
+        expect(findFirstAlert()).not.toBe(null);
       });
 
       it('should dismiss the banner on click', () => {
         findFirstDismissButtonByClass().click();
-        expect(findFirstAlert()).not.toExist();
+        expect(findFirstAlert()).toBe(null);
       });
     });
   });
diff --git a/spec/frontend/confirm_modal_spec.js b/spec/frontend/confirm_modal_spec.js
index 8a12ff3a01f..5e5345cbd2b 100644
--- a/spec/frontend/confirm_modal_spec.js
+++ b/spec/frontend/confirm_modal_spec.js
@@ -72,7 +72,7 @@ describe('ConfirmModal', () => {
 
   it('starts with only JsHooks', () => {
     expect(findJsHooks()).toHaveLength(buttons.length);
-    expect(findModal()).not.toExist();
+    expect(findModal()).toBe(null);
   });
 
   describe('when button clicked', () => {
@@ -87,7 +87,7 @@ describe('ConfirmModal', () => {
 
     describe('GlModal', () => {
       it('is rendered', () => {
-        expect(findModal()).toExist();
+        expect(findModal()).not.toBe(null);
         expect(modalIsHidden()).toBe(false);
       });
 
diff --git a/spec/frontend/delete_label_modal_spec.js b/spec/frontend/delete_label_modal_spec.js
index df70d3a8393..0b3e6fe652a 100644
--- a/spec/frontend/delete_label_modal_spec.js
+++ b/spec/frontend/delete_label_modal_spec.js
@@ -40,7 +40,7 @@ describe('DeleteLabelModal', () => {
 
   it('starts with only js-containers', () => {
     expect(findJsHooks()).toHaveLength(buttons.length);
-    expect(findModal()).not.toExist();
+    expect(findModal()).toBe(null);
   });
 
   describe('when first button clicked', () => {
@@ -54,7 +54,7 @@ describe('DeleteLabelModal', () => {
     });
 
     it('renders GlModal', () => {
-      expect(findModal()).toExist();
+      expect(findModal()).not.toBe(null);
     });
   });
 
diff --git a/spec/frontend/deploy_keys/components/key_spec.js b/spec/frontend/deploy_keys/components/key_spec.js
index 511b9d6ef55..51c120d8213 100644
--- a/spec/frontend/deploy_keys/components/key_spec.js
+++ b/spec/frontend/deploy_keys/components/key_spec.js
@@ -50,20 +50,20 @@ describe('Deploy keys key', () => {
     it('shows pencil button for editing', () => {
       createComponent({ deployKey });
 
-      expect(wrapper.find('.btn [data-testid="pencil-icon"]')).toExist();
+      expect(wrapper.find('.btn [data-testid="pencil-icon"]').exists()).toBe(true);
     });
 
     it('shows disable button when the project is not deletable', () => {
       createComponent({ deployKey });
 
-      expect(wrapper.find('.btn [data-testid="cancel-icon"]')).toExist();
+      expect(wrapper.find('.btn [data-testid="cancel-icon"]').exists()).toBe(true);
     });
 
     it('shows remove button when the project is deletable', () => {
       createComponent({
         deployKey: { ...deployKey, destroyed_when_orphaned: true, almost_orphaned: true },
       });
-      expect(wrapper.find('.btn [data-testid="remove-icon"]')).toExist();
+      expect(wrapper.find('.btn [data-testid="remove-icon"]').exists()).toBe(true);
     });
   });
 
@@ -137,7 +137,7 @@ describe('Deploy keys key', () => {
 
     it('shows pencil button for editing', () => {
       createComponent({ deployKey });
-      expect(wrapper.find('.btn [data-testid="pencil-icon"]')).toExist();
+      expect(wrapper.find('.btn [data-testid="pencil-icon"]').exists()).toBe(true);
     });
 
     it('shows disable button when key is enabled', () => {
@@ -145,7 +145,7 @@ describe('Deploy keys key', () => {
 
       createComponent({ deployKey });
 
-      expect(wrapper.find('.btn [data-testid="cancel-icon"]')).toExist();
+      expect(wrapper.find('.btn [data-testid="cancel-icon"]').exists()).toBe(true);
     });
   });
 });
diff --git a/spec/frontend/deploy_keys/components/keys_panel_spec.js b/spec/frontend/deploy_keys/components/keys_panel_spec.js
index f3b907e5450..f5f76d5d493 100644
--- a/spec/frontend/deploy_keys/components/keys_panel_spec.js
+++ b/spec/frontend/deploy_keys/components/keys_panel_spec.js
@@ -37,7 +37,7 @@ describe('Deploy keys panel', () => {
     mountComponent();
     const tableHeader = findTableRowHeader();
 
-    expect(tableHeader).toExist();
+    expect(tableHeader.exists()).toBe(true);
     expect(tableHeader.text()).toContain('Deploy key');
     expect(tableHeader.text()).toContain('Project usage');
     expect(tableHeader.text()).toContain('Created');
diff --git a/spec/frontend/design_management/components/list/item_spec.js b/spec/frontend/design_management/components/list/item_spec.js
index 58636ece91e..ed105b112be 100644
--- a/spec/frontend/design_management/components/list/item_spec.js
+++ b/spec/frontend/design_management/components/list/item_spec.js
@@ -87,7 +87,7 @@ describe('Design management list item component', () => {
 
     describe('before image is loaded', () => {
       it('renders loading spinner', () => {
-        expect(wrapper.find(GlLoadingIcon)).toExist();
+        expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
       });
     });
 
diff --git a/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js b/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js
index 27ec6a7280f..f244da228b3 100644
--- a/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js
+++ b/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js
@@ -1,5 +1,6 @@
 import { GlModal, GlSprintf, GlAlert } from '@gitlab/ui';
-import { shallowMount } from '@vue/test-utils';
+
+import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import Component from '~/feature_flags/components/configure_feature_flags_modal.vue';
 
 describe('Configure Feature Flags Modal', () => {
@@ -20,7 +21,7 @@ describe('Configure Feature Flags Modal', () => {
   };
 
   let wrapper;
-  const factory = (props = {}, { mountFn = shallowMount, ...options } = {}) => {
+  const factory = (props = {}, { mountFn = shallowMountExtended, ...options } = {}) => {
     wrapper = mountFn(Component, {
       provide,
       stubs: { GlSprintf },
@@ -140,11 +141,13 @@ describe('Configure Feature Flags Modal', () => {
 
   describe('has rotate error', () => {
     afterEach(() => wrapper.destroy());
-    beforeEach(factory.bind(null, { hasRotateError: false }));
+    beforeEach(() => {
+      factory({ hasRotateError: true });
+    });
 
     it('should display an error', async () => {
-      expect(wrapper.find('.text-danger')).toExist();
-      expect(wrapper.find('[name="warning"]')).toExist();
+      expect(wrapper.findByTestId('rotate-error').exists()).toBe(true);
+      expect(wrapper.find('[name="warning"]').exists()).toBe(true);
     });
   });
 
diff --git a/spec/frontend/invite_members/components/invite_members_modal_spec.js b/spec/frontend/invite_members/components/invite_members_modal_spec.js
index 3cdf6432b95..a01284d9d0f 100644
--- a/spec/frontend/invite_members/components/invite_members_modal_spec.js
+++ b/spec/frontend/invite_members/components/invite_members_modal_spec.js
@@ -198,7 +198,7 @@ describe('InviteMembersModal', () => {
 
     describe('rendering the access expiration date field', () => {
       it('renders the datepicker', () => {
-        expect(findDatepicker()).toExist();
+        expect(findDatepicker().exists()).toBe(true);
       });
     });
   });
diff --git a/spec/frontend/issuable/components/csv_import_modal_spec.js b/spec/frontend/issuable/components/csv_import_modal_spec.js
index 307323ef07a..f4636fd7e6a 100644
--- a/spec/frontend/issuable/components/csv_import_modal_spec.js
+++ b/spec/frontend/issuable/components/csv_import_modal_spec.js
@@ -1,7 +1,8 @@
-import { GlButton, GlModal } from '@gitlab/ui';
+import { GlModal } from '@gitlab/ui';
 import { stubComponent } from 'helpers/stub_component';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import CsvImportModal from '~/issuable/components/csv_import_modal.vue';
+import { __ } from '~/locale';
 
 jest.mock('~/lib/utils/csrf', () => ({ token: 'mock-csrf-token' }));
 
@@ -36,7 +37,6 @@ describe('CsvImportModal', () => {
   });
 
   const findModal = () => wrapper.findComponent(GlModal);
-  const findPrimaryButton = () => wrapper.findComponent(GlButton);
   const findForm = () => wrapper.find('form');
   const findFileInput = () => wrapper.findByLabelText('Upload CSV file');
   const findAuthenticityToken = () => new FormData(findForm().element).get('authenticity_token');
@@ -64,11 +64,11 @@ describe('CsvImportModal', () => {
         expect(findForm().exists()).toBe(true);
         expect(findForm().attributes('action')).toBe(importCsvIssuesPath);
         expect(findAuthenticityToken()).toBe('mock-csrf-token');
-        expect(findFileInput()).toExist();
+        expect(findFileInput().exists()).toBe(true);
       });
 
       it('displays the correct primary button action text', () => {
-        expect(findPrimaryButton()).toExist();
+        expect(findModal().props('actionPrimary')).toEqual({ text: __('Import issues') });
       });
 
       it('submits the form when the primary action is clicked', () => {
diff --git a/spec/frontend/monitoring/components/dashboard_spec.js b/spec/frontend/monitoring/components/dashboard_spec.js
index faa8264b488..9331048bce3 100644
--- a/spec/frontend/monitoring/components/dashboard_spec.js
+++ b/spec/frontend/monitoring/components/dashboard_spec.js
@@ -456,7 +456,7 @@ describe('Dashboard', () => {
 
     it('shows the links section', () => {
       expect(wrapper.vm.shouldShowLinksSection).toBe(true);
-      expect(wrapper.find(LinksSection)).toExist();
+      expect(wrapper.findComponent(LinksSection).exists()).toBe(true);
     });
   });
 
diff --git a/spec/frontend/monitoring/components/links_section_spec.js b/spec/frontend/monitoring/components/links_section_spec.js
index 8fc287c50e4..e37abf6722a 100644
--- a/spec/frontend/monitoring/components/links_section_spec.js
+++ b/spec/frontend/monitoring/components/links_section_spec.js
@@ -1,5 +1,7 @@
 import { GlLink } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+
 import LinksSection from '~/monitoring/components/links_section.vue';
 import { createStore } from '~/monitoring/stores';
 
@@ -26,12 +28,12 @@ describe('Links Section component', () => {
     createShallowWrapper();
   });
 
-  it('does not render a section if no links are present', () => {
+  it('does not render a section if no links are present', async () => {
     setState();
 
-    return wrapper.vm.$nextTick(() => {
-      expect(findLinks()).not.toExist();
-    });
+    await nextTick();
+
+    expect(findLinks().length).toBe(0);
   });
 
   it('renders a link inside a section', () => {
diff --git a/spec/frontend/monitoring/components/variables/text_field_spec.js b/spec/frontend/monitoring/components/variables/text_field_spec.js
index 28e02dff4bf..c879803fddd 100644
--- a/spec/frontend/monitoring/components/variables/text_field_spec.js
+++ b/spec/frontend/monitoring/components/variables/text_field_spec.js
@@ -15,12 +15,12 @@ describe('Text variable component', () => {
     });
   };
 
-  const findInput = () => wrapper.find(GlFormInput);
+  const findInput = () => wrapper.findComponent(GlFormInput);
 
   it('renders a text input when all props are passed', () => {
     createShallowWrapper();
 
-    expect(findInput()).toExist();
+    expect(findInput().exists()).toBe(true);
   });
 
   it('always has a default value', () => {
diff --git a/spec/frontend/monitoring/pages/dashboard_page_spec.js b/spec/frontend/monitoring/pages/dashboard_page_spec.js
index dbe9cc21ad5..c5a8b50ee60 100644
--- a/spec/frontend/monitoring/pages/dashboard_page_spec.js
+++ b/spec/frontend/monitoring/pages/dashboard_page_spec.js
@@ -29,7 +29,7 @@ describe('monitoring/pages/dashboard_page', () => {
     });
   };
 
-  const findDashboardComponent = () => wrapper.find(Dashboard);
+  const findDashboardComponent = () => wrapper.findComponent(Dashboard);
 
   beforeEach(() => {
     buildRouter();
@@ -60,7 +60,7 @@ describe('monitoring/pages/dashboard_page', () => {
       smallEmptyState: false,
     };
 
-    expect(findDashboardComponent()).toExist();
+    expect(findDashboardComponent().exists()).toBe(true);
     expect(allProps).toMatchObject(findDashboardComponent().props());
   });
 });
diff --git a/spec/frontend/notes/components/note_body_spec.js b/spec/frontend/notes/components/note_body_spec.js
index 40251244423..4e345c9ac8d 100644
--- a/spec/frontend/notes/components/note_body_spec.js
+++ b/spec/frontend/notes/components/note_body_spec.js
@@ -58,7 +58,6 @@ describe('issue_note_body component', () => {
     it('adds autosave', () => {
       const autosaveKey = `autosave/Note/${note.noteable_type}/${note.id}`;
 
-      expect(vm.autosave).toExist();
       expect(vm.autosave.key).toEqual(autosaveKey);
     });
   });
diff --git a/spec/frontend/packages_and_registries/package_registry/components/details/installations_commands_spec.js b/spec/frontend/packages_and_registries/package_registry/components/details/installations_commands_spec.js
index b24946c8638..8bb05b00e65 100644
--- a/spec/frontend/packages_and_registries/package_registry/components/details/installations_commands_spec.js
+++ b/spec/frontend/packages_and_registries/package_registry/components/details/installations_commands_spec.js
@@ -33,12 +33,12 @@ describe('InstallationCommands', () => {
     });
   }
 
-  const npmInstallation = () => wrapper.find(NpmInstallation);
-  const mavenInstallation = () => wrapper.find(MavenInstallation);
-  const conanInstallation = () => wrapper.find(ConanInstallation);
-  const nugetInstallation = () => wrapper.find(NugetInstallation);
-  const pypiInstallation = () => wrapper.find(PypiInstallation);
-  const composerInstallation = () => wrapper.find(ComposerInstallation);
+  const npmInstallation = () => wrapper.findComponent(NpmInstallation);
+  const mavenInstallation = () => wrapper.findComponent(MavenInstallation);
+  const conanInstallation = () => wrapper.findComponent(ConanInstallation);
+  const nugetInstallation = () => wrapper.findComponent(NugetInstallation);
+  const pypiInstallation = () => wrapper.findComponent(PypiInstallation);
+  const composerInstallation = () => wrapper.findComponent(ComposerInstallation);
 
   afterEach(() => {
     wrapper.destroy();
@@ -57,7 +57,7 @@ describe('InstallationCommands', () => {
       it(`${packageEntity.packageType} instructions exist`, () => {
         createComponent({ packageEntity });
 
-        expect(selector()).toExist();
+        expect(selector().exists()).toBe(true);
       });
     });
   });
diff --git a/spec/frontend/pages/admin/projects/components/namespace_select_spec.js b/spec/frontend/pages/admin/projects/components/namespace_select_spec.js
index c579aa2f2da..1fcc00489e3 100644
--- a/spec/frontend/pages/admin/projects/components/namespace_select_spec.js
+++ b/spec/frontend/pages/admin/projects/components/namespace_select_spec.js
@@ -38,7 +38,7 @@ describe('Dropdown select component', () => {
   it('creates a hidden input if fieldName is provided', () => {
     mountDropdown({ fieldName: 'namespace-input' });
 
-    expect(findNamespaceInput()).toExist();
+    expect(findNamespaceInput().exists()).toBe(true);
     expect(findNamespaceInput().attributes('name')).toBe('namespace-input');
   });
 
@@ -57,9 +57,9 @@ describe('Dropdown select component', () => {
       // wait for dropdown options to populate
       await wrapper.vm.$nextTick();
 
-      expect(findDropdownOption('user: Administrator')).toExist();
-      expect(findDropdownOption('group: GitLab Org')).toExist();
-      expect(findDropdownOption('group: Foobar')).not.toExist();
+      expect(findDropdownOption('user: Administrator').exists()).toBe(true);
+      expect(findDropdownOption('group: GitLab Org').exists()).toBe(true);
+      expect(findDropdownOption('group: Foobar').exists()).toBe(false);
 
       findDropdownOption('user: Administrator').trigger('click');
       await wrapper.vm.$nextTick();
diff --git a/spec/frontend/pipelines/empty_state_spec.js b/spec/frontend/pipelines/empty_state_spec.js
index 1af3065477d..31b74a06efd 100644
--- a/spec/frontend/pipelines/empty_state_spec.js
+++ b/spec/frontend/pipelines/empty_state_spec.js
@@ -35,7 +35,7 @@ describe('Pipelines Empty State', () => {
     });
 
     it('should render the CI/CD templates', () => {
-      expect(pipelinesCiTemplates()).toExist();
+      expect(pipelinesCiTemplates().exists()).toBe(true);
     });
   });
 
diff --git a/spec/frontend/pipelines/pipelines_spec.js b/spec/frontend/pipelines/pipelines_spec.js
index 2875498bb52..c024730570c 100644
--- a/spec/frontend/pipelines/pipelines_spec.js
+++ b/spec/frontend/pipelines/pipelines_spec.js
@@ -554,7 +554,7 @@ describe('Pipelines', () => {
       });
 
       it('renders the CI/CD templates', () => {
-        expect(wrapper.find(PipelinesCiTemplates)).toExist();
+        expect(wrapper.findComponent(PipelinesCiTemplates).exists()).toBe(true);
       });
 
       describe('when the code_quality_walkthrough experiment is active', () => {
@@ -568,7 +568,7 @@ describe('Pipelines', () => {
           });
 
           it('renders the CI/CD templates', () => {
-            expect(wrapper.find(PipelinesCiTemplates)).toExist();
+            expect(wrapper.findComponent(PipelinesCiTemplates).exists()).toBe(true);
           });
         });
 
@@ -597,7 +597,7 @@ describe('Pipelines', () => {
           });
 
           it('renders the CI/CD templates', () => {
-            expect(wrapper.find(PipelinesCiTemplates)).toExist();
+            expect(wrapper.findComponent(PipelinesCiTemplates).exists()).toBe(true);
           });
         });
 
diff --git a/spec/frontend/projects/commits/components/author_select_spec.js b/spec/frontend/projects/commits/components/author_select_spec.js
index 9a8f7ff7582..60d36597fda 100644
--- a/spec/frontend/projects/commits/components/author_select_spec.js
+++ b/spec/frontend/projects/commits/components/author_select_spec.js
@@ -115,7 +115,7 @@ describe('Author Select', () => {
     });
 
     it('does not have popover text by default', () => {
-      expect(wrapper.attributes('title')).not.toExist();
+      expect(wrapper.attributes('title')).toBeUndefined();
     });
   });
 
diff --git a/spec/frontend/security_configuration/components/app_spec.js b/spec/frontend/security_configuration/components/app_spec.js
index 6b9d1288bb3..d4ee9e6e43d 100644
--- a/spec/frontend/security_configuration/components/app_spec.js
+++ b/spec/frontend/security_configuration/components/app_spec.js
@@ -134,12 +134,12 @@ describe('App component', () => {
 
     it('renders main-heading with correct text', () => {
       const mainHeading = findMainHeading();
-      expect(mainHeading).toExist();
+      expect(mainHeading.exists()).toBe(true);
       expect(mainHeading.text()).toContain('Security Configuration');
     });
 
     it('renders GlTab Component ', () => {
-      expect(findTab()).toExist();
+      expect(findTab().exists()).toBe(true);
     });
 
     it('renders right amount of tabs with correct title ', () => {
diff --git a/spec/frontend/sidebar/components/time_tracking/report_spec.js b/spec/frontend/sidebar/components/time_tracking/report_spec.js
index 66218626e6b..64d143615a0 100644
--- a/spec/frontend/sidebar/components/time_tracking/report_spec.js
+++ b/spec/frontend/sidebar/components/time_tracking/report_spec.js
@@ -50,7 +50,7 @@ describe('Issuable Time Tracking Report', () => {
   it('should render loading spinner', () => {
     mountComponent();
 
-    expect(findLoadingIcon()).toExist();
+    expect(findLoadingIcon().exists()).toBe(true);
   });
 
   it('should render error message on reject', async () => {
diff --git a/spec/frontend/test_setup.js b/spec/frontend/test_setup.js
index 2c8e0fff848..40f68c6385f 100644
--- a/spec/frontend/test_setup.js
+++ b/spec/frontend/test_setup.js
@@ -47,10 +47,12 @@ Object.assign(global, {
   setFixtures: setHTMLFixture,
 });
 
+const JQUERY_MATCHERS_TO_EXCLUDE = ['toHaveLength', 'toExist'];
+
 // custom-jquery-matchers was written for an old Jest version, we need to make it compatible
 Object.entries(jqueryMatchers).forEach(([matcherName, matcherFactory]) => {
-  // Don't override existing Jest matcher
-  if (matcherName === 'toHaveLength') {
+  // Exclude these jQuery matchers
+  if (JQUERY_MATCHERS_TO_EXCLUDE.includes(matcherName)) {
     return;
   }
 
diff --git a/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js b/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
index 9c3a6d581e8..e0f1f091129 100644
--- a/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
+++ b/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
@@ -191,7 +191,7 @@ describe('MRWidgetMerged', () => {
   });
 
   it('shows button to copy commit SHA to clipboard', () => {
-    expect(selectors.copyMergeShaButton).toExist();
+    expect(selectors.copyMergeShaButton).not.toBe(null);
     expect(selectors.copyMergeShaButton.getAttribute('data-clipboard-text')).toBe(
       vm.mr.mergeCommitSha,
     );
@@ -201,14 +201,14 @@ describe('MRWidgetMerged', () => {
     vm.mr.mergeCommitSha = null;
 
     Vue.nextTick(() => {
-      expect(selectors.copyMergeShaButton).not.toExist();
+      expect(selectors.copyMergeShaButton).toBe(null);
       expect(vm.$el.querySelector('.mr-info-list').innerText).not.toContain('with');
       done();
     });
   });
 
   it('shows merge commit SHA link', () => {
-    expect(selectors.mergeCommitShaLink).toExist();
+    expect(selectors.mergeCommitShaLink).not.toBe(null);
     expect(selectors.mergeCommitShaLink.text).toContain(vm.mr.shortMergeCommitSha);
     expect(selectors.mergeCommitShaLink.href).toBe(vm.mr.mergeCommitPath);
   });
diff --git a/spec/frontend/vue_shared/components/content_viewer/content_viewer_spec.js b/spec/frontend/vue_shared/components/content_viewer/content_viewer_spec.js
index 16e7e4dd5cc..f28805471f8 100644
--- a/spec/frontend/vue_shared/components/content_viewer/content_viewer_spec.js
+++ b/spec/frontend/vue_shared/components/content_viewer/content_viewer_spec.js
@@ -16,6 +16,6 @@ describe('ContentViewer', () => {
       propsData: { path, fileSize: 1024, type },
     });
 
-    expect(wrapper.find(selector).element).toExist();
+    expect(wrapper.find(selector).exists()).toBe(true);
   });
 });
diff --git a/spec/frontend/vue_shared/components/content_viewer/viewers/markdown_viewer_spec.js b/spec/frontend/vue_shared/components/content_viewer/viewers/markdown_viewer_spec.js
index 3ffb23dc7a0..1397fb0405e 100644
--- a/spec/frontend/vue_shared/components/content_viewer/viewers/markdown_viewer_spec.js
+++ b/spec/frontend/vue_shared/components/content_viewer/viewers/markdown_viewer_spec.js
@@ -42,7 +42,7 @@ describe('MarkdownViewer', () => {
     it('renders an animation container while the markdown is loading', () => {
       createComponent();
 
-      expect(wrapper.find('.animation-container')).toExist();
+      expect(wrapper.find('.animation-container').exists()).toBe(true);
     });
 
     it('renders markdown preview preview renders and loads rendered markdown from server', () => {
diff --git a/spec/frontend/whats_new/utils/notification_spec.js b/spec/frontend/whats_new/utils/notification_spec.js
index c361f934e59..ef61462a3c5 100644
--- a/spec/frontend/whats_new/utils/notification_spec.js
+++ b/spec/frontend/whats_new/utils/notification_spec.js
@@ -29,7 +29,7 @@ describe('~/whats_new/utils/notification', () => {
 
       subject();
 
-      expect(findNotificationCountEl()).toExist();
+      expect(findNotificationCountEl()).not.toBe(null);
       expect(notificationEl.classList).toContain('with-notifications');
     });
 
@@ -38,11 +38,11 @@ describe('~/whats_new/utils/notification', () => {
       notificationEl.classList.add('with-notifications');
       localStorage.setItem('display-whats-new-notification', 'version-digest');
 
-      expect(findNotificationCountEl()).toExist();
+      expect(findNotificationCountEl()).not.toBe(null);
 
       subject();
 
-      expect(findNotificationCountEl()).not.toExist();
+      expect(findNotificationCountEl()).toBe(null);
       expect(notificationEl.classList).not.toContain('with-notifications');
     });
   });