Add latest changes from gitlab-org/gitlab@master

26 files changed, 75 insertions, 75 deletions

diff --git a/spec/frontend/blob/components/blob_header_default_actions_spec.js b/spec/frontend/blob/components/blob_header_default_actions_spec.js
index 2382ac15f40..0f015715dc2 100644
--- a/spec/frontend/blob/components/blob_header_default_actions_spec.js
+++ b/spec/frontend/blob/components/blob_header_default_actions_spec.js
@@ -71,7 +71,7 @@ describe('Blob Header Default Actions', () => {
       });
       buttons = wrapper.findAllComponents(GlButton);
 
-      expect(buttons.at(0).attributes('disabled')).toBeTruthy();
+      expect(buttons.at(0).attributes('disabled')).toBe('true');
     });
 
     it('does not render the copy button if a rendering error is set', () => {
diff --git a/spec/frontend/blob/sketch/index_spec.js b/spec/frontend/blob/sketch/index_spec.js
index 5e1922a24f4..e8d1f724c4b 100644
--- a/spec/frontend/blob/sketch/index_spec.js
+++ b/spec/frontend/blob/sketch/index_spec.js
@@ -69,7 +69,7 @@ describe('Sketch viewer', () => {
       const img = document.querySelector('#js-sketch-viewer img');
 
       expect(img).not.toBeNull();
-      expect(img.classList.contains('img-fluid')).toBeTruthy();
+      expect(img.classList.contains('img-fluid')).toBe(true);
     });
 
     it('renders link to image', () => {
diff --git a/spec/frontend/design_management/components/delete_button_spec.js b/spec/frontend/design_management/components/delete_button_spec.js
index e3907fdbe15..cee1eec792d 100644
--- a/spec/frontend/design_management/components/delete_button_spec.js
+++ b/spec/frontend/design_management/components/delete_button_spec.js
@@ -6,8 +6,8 @@ import BatchDeleteButton from '~/design_management/components/delete_button.vue'
 describe('Batch delete button component', () => {
   let wrapper;
 
-  const findButton = () => wrapper.find(GlButton);
-  const findModal = () => wrapper.find(GlModal);
+  const findButton = () => wrapper.findComponent(GlButton);
+  const findModal = () => wrapper.findComponent(GlModal);
 
   function createComponent({ isDeleting = false } = {}, { slots = {} } = {}) {
     wrapper = shallowMount(BatchDeleteButton, {
diff --git a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js
index ae2dc23a94d..2091e1e08dd 100644
--- a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js
+++ b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js
@@ -26,13 +26,13 @@ describe('Design discussions component', () => {
   const originalGon = window.gon;
   let wrapper;
 
-  const findDesignNotes = () => wrapper.findAll(DesignNote);
-  const findReplyPlaceholder = () => wrapper.find(ReplyPlaceholder);
-  const findReplyForm = () => wrapper.find(DesignReplyForm);
-  const findRepliesWidget = () => wrapper.find(ToggleRepliesWidget);
+  const findDesignNotes = () => wrapper.findAllComponents(DesignNote);
+  const findReplyPlaceholder = () => wrapper.findComponent(ReplyPlaceholder);
+  const findReplyForm = () => wrapper.findComponent(DesignReplyForm);
+  const findRepliesWidget = () => wrapper.findComponent(ToggleRepliesWidget);
   const findResolveButton = () => wrapper.find('[data-testid="resolve-button"]');
   const findResolvedMessage = () => wrapper.find('[data-testid="resolved-message"]');
-  const findResolveLoadingIcon = () => wrapper.find(GlLoadingIcon);
+  const findResolveLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
   const findResolveCheckbox = () => wrapper.find('[data-testid="resolve-checkbox"]');
   const findApolloMutation = () => wrapper.findComponent(ApolloMutation);
 
@@ -307,7 +307,7 @@ describe('Design discussions component', () => {
 
         expect(
           wrapper
-            .findAll(DesignNote)
+            .findAllComponents(DesignNote)
             .wrappers.every((designNote) => designNote.classes('gl-bg-blue-50')),
         ).toBe(true);
       },
diff --git a/spec/frontend/design_management/components/design_notes/design_note_spec.js b/spec/frontend/design_management/components/design_notes/design_note_spec.js
index 1f84fde9f7f..28833b4af5c 100644
--- a/spec/frontend/design_management/components/design_notes/design_note_spec.js
+++ b/spec/frontend/design_management/components/design_notes/design_note_spec.js
@@ -100,7 +100,7 @@ describe('Design note component', () => {
       note,
     });
 
-    expect(wrapper.find(TimeAgoTooltip).exists()).toBe(true);
+    expect(wrapper.findComponent(TimeAgoTooltip).exists()).toBe(true);
   });
 
   it('should not render edit icon when user does not have a permission', () => {
diff --git a/spec/frontend/design_management/components/design_notes/design_reply_form_spec.js b/spec/frontend/design_management/components/design_notes/design_reply_form_spec.js
index 38dd2df01a3..f7ce742b933 100644
--- a/spec/frontend/design_management/components/design_notes/design_reply_form_spec.js
+++ b/spec/frontend/design_management/components/design_notes/design_reply_form_spec.js
@@ -15,9 +15,9 @@ describe('Design reply form component', () => {
   let wrapper;
 
   const findTextarea = () => wrapper.find('textarea');
-  const findSubmitButton = () => wrapper.find({ ref: 'submitButton' });
-  const findCancelButton = () => wrapper.find({ ref: 'cancelButton' });
-  const findModal = () => wrapper.find({ ref: 'cancelCommentModal' });
+  const findSubmitButton = () => wrapper.findComponent({ ref: 'submitButton' });
+  const findCancelButton = () => wrapper.findComponent({ ref: 'cancelButton' });
+  const findModal = () => wrapper.findComponent({ ref: 'cancelCommentModal' });
 
   function createComponent(props = {}, mountOptions = {}) {
     wrapper = mount(DesignReplyForm, {
diff --git a/spec/frontend/design_management/components/design_notes/toggle_replies_widget_spec.js b/spec/frontend/design_management/components/design_notes/toggle_replies_widget_spec.js
index f87228663b6..41129e2b58d 100644
--- a/spec/frontend/design_management/components/design_notes/toggle_replies_widget_spec.js
+++ b/spec/frontend/design_management/components/design_notes/toggle_replies_widget_spec.js
@@ -8,10 +8,10 @@ describe('Toggle replies widget component', () => {
   let wrapper;
 
   const findToggleWrapper = () => wrapper.find('[data-testid="toggle-comments-wrapper"]');
-  const findIcon = () => wrapper.find(GlIcon);
-  const findButton = () => wrapper.find(GlButton);
-  const findAuthorLink = () => wrapper.find(GlLink);
-  const findTimeAgo = () => wrapper.find(TimeAgoTooltip);
+  const findIcon = () => wrapper.findComponent(GlIcon);
+  const findButton = () => wrapper.findComponent(GlButton);
+  const findAuthorLink = () => wrapper.findComponent(GlLink);
+  const findTimeAgo = () => wrapper.findComponent(TimeAgoTooltip);
 
   function createComponent(props = {}) {
     wrapper = shallowMount(ToggleRepliesWidget, {
diff --git a/spec/frontend/design_management/components/design_scaler_spec.js b/spec/frontend/design_management/components/design_scaler_spec.js
index a04e2ebda5b..e1a66cea329 100644
--- a/spec/frontend/design_management/components/design_scaler_spec.js
+++ b/spec/frontend/design_management/components/design_scaler_spec.js
@@ -6,7 +6,7 @@ import DesignScaler from '~/design_management/components/design_scaler.vue';
 describe('Design management design scaler component', () => {
   let wrapper;
 
-  const getButtons = () => wrapper.findAll(GlButton);
+  const getButtons = () => wrapper.findAllComponents(GlButton);
   const getDecreaseScaleButton = () => getButtons().at(0);
   const getResetScaleButton = () => getButtons().at(1);
   const getIncreaseScaleButton = () => getButtons().at(2);
diff --git a/spec/frontend/design_management/components/design_sidebar_spec.js b/spec/frontend/design_management/components/design_sidebar_spec.js
index f13796138bd..af995f75ddc 100644
--- a/spec/frontend/design_management/components/design_sidebar_spec.js
+++ b/spec/frontend/design_management/components/design_sidebar_spec.js
@@ -32,12 +32,12 @@ describe('Design management design sidebar component', () => {
   const originalGon = window.gon;
   let wrapper;
 
-  const findDiscussions = () => wrapper.findAll(DesignDiscussion);
+  const findDiscussions = () => wrapper.findAllComponents(DesignDiscussion);
   const findFirstDiscussion = () => findDiscussions().at(0);
   const findUnresolvedDiscussions = () => wrapper.findAll('[data-testid="unresolved-discussion"]');
   const findResolvedDiscussions = () => wrapper.findAll('[data-testid="resolved-discussion"]');
-  const findParticipants = () => wrapper.find(Participants);
-  const findResolvedCommentsToggle = () => wrapper.find(GlAccordionItem);
+  const findParticipants = () => wrapper.findComponent(Participants);
+  const findResolvedCommentsToggle = () => wrapper.findComponent(GlAccordionItem);
   const findNewDiscussionDisclaimer = () =>
     wrapper.find('[data-testid="new-discussion-disclaimer"]');
 
@@ -87,7 +87,7 @@ describe('Design management design sidebar component', () => {
   it('renders To-Do button', () => {
     createComponent();
 
-    expect(wrapper.find(DesignTodoButton).exists()).toBe(true);
+    expect(wrapper.findComponent(DesignTodoButton).exists()).toBe(true);
   });
 
   describe('when has no discussions', () => {
diff --git a/spec/frontend/design_management/components/design_todo_button_spec.js b/spec/frontend/design_management/components/design_todo_button_spec.js
index 73661c9fcb0..b3afcefe1ed 100644
--- a/spec/frontend/design_management/components/design_todo_button_spec.js
+++ b/spec/frontend/design_management/components/design_todo_button_spec.js
@@ -57,7 +57,7 @@ describe('Design management design todo button', () => {
   });
 
   it('renders TodoButton component', () => {
-    expect(wrapper.find(TodoButton).exists()).toBe(true);
+    expect(wrapper.findComponent(TodoButton).exists()).toBe(true);
   });
 
   describe('when design has a pending todo', () => {
diff --git a/spec/frontend/design_management/components/image_spec.js b/spec/frontend/design_management/components/image_spec.js
index 65ee0ae6238..8163cb0d87a 100644
--- a/spec/frontend/design_management/components/image_spec.js
+++ b/spec/frontend/design_management/components/image_spec.js
@@ -71,7 +71,7 @@ describe('Design management large image component', () => {
     image.trigger('error');
     await nextTick();
     expect(image.isVisible()).toBe(false);
-    expect(wrapper.find(GlIcon).element).toMatchSnapshot();
+    expect(wrapper.findComponent(GlIcon).element).toMatchSnapshot();
   });
 
   describe('zoom', () => {
diff --git a/spec/frontend/design_management/components/list/item_spec.js b/spec/frontend/design_management/components/list/item_spec.js
index e00dda2015e..66d3f883960 100644
--- a/spec/frontend/design_management/components/list/item_spec.js
+++ b/spec/frontend/design_management/components/list/item_spec.js
@@ -23,8 +23,8 @@ describe('Design management list item component', () => {
 
   const findDesignEvent = () => wrapper.findByTestId('design-event');
   const findImgFilename = (id = imgId) => wrapper.findByTestId(`design-img-filename-${id}`);
-  const findEventIcon = () => findDesignEvent().find(GlIcon);
-  const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+  const findEventIcon = () => findDesignEvent().findComponent(GlIcon);
+  const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
 
   function createComponent({
     notesCount = 0,
@@ -74,7 +74,7 @@ describe('Design management list item component', () => {
     beforeEach(async () => {
       createComponent();
       image = wrapper.find('img');
-      glIntersectionObserver = wrapper.find(GlIntersectionObserver);
+      glIntersectionObserver = wrapper.findComponent(GlIntersectionObserver);
 
       glIntersectionObserver.vm.$emit('appear');
       await nextTick();
@@ -86,7 +86,7 @@ describe('Design management list item component', () => {
 
     describe('before image is loaded', () => {
       it('renders loading spinner', () => {
-        expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
+        expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true);
       });
     });
 
@@ -105,7 +105,7 @@ describe('Design management list item component', () => {
         image.trigger('error');
         await nextTick();
         expect(image.isVisible()).toBe(false);
-        expect(wrapper.find(GlIcon).element).toMatchSnapshot();
+        expect(wrapper.findComponent(GlIcon).element).toMatchSnapshot();
       });
 
       describe('when imageV432x230 and image provided', () => {
diff --git a/spec/frontend/design_management/components/toolbar/index_spec.js b/spec/frontend/design_management/components/toolbar/index_spec.js
index 412f3de911e..b6137ba2eee 100644
--- a/spec/frontend/design_management/components/toolbar/index_spec.js
+++ b/spec/frontend/design_management/components/toolbar/index_spec.js
@@ -85,35 +85,35 @@ describe('Design management toolbar component', () => {
     createComponent();
 
     await nextTick();
-    expect(wrapper.find(DeleteButton).exists()).toBe(true);
+    expect(wrapper.findComponent(DeleteButton).exists()).toBe(true);
   });
 
   it('does not render delete button on non-latest version', async () => {
     createComponent(false, true, { isLatestVersion: false });
 
     await nextTick();
-    expect(wrapper.find(DeleteButton).exists()).toBe(false);
+    expect(wrapper.findComponent(DeleteButton).exists()).toBe(false);
   });
 
   it('does not render delete button when user is not logged in', async () => {
     createComponent(false, false);
 
     await nextTick();
-    expect(wrapper.find(DeleteButton).exists()).toBe(false);
+    expect(wrapper.findComponent(DeleteButton).exists()).toBe(false);
   });
 
   it('emits `delete` event on deleteButton `delete-selected-designs` event', async () => {
     createComponent();
 
     await nextTick();
-    wrapper.find(DeleteButton).vm.$emit('delete-selected-designs');
+    wrapper.findComponent(DeleteButton).vm.$emit('delete-selected-designs');
     expect(wrapper.emitted().delete).toBeTruthy();
   });
 
   it('renders download button with correct link', () => {
     createComponent();
 
-    expect(wrapper.find(GlButton).attributes('href')).toBe(
+    expect(wrapper.findComponent(GlButton).attributes('href')).toBe(
       '/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d',
     );
   });
diff --git a/spec/frontend/design_management/components/upload/button_spec.js b/spec/frontend/design_management/components/upload/button_spec.js
index d123db43ce6..59821218ab8 100644
--- a/spec/frontend/design_management/components/upload/button_spec.js
+++ b/spec/frontend/design_management/components/upload/button_spec.js
@@ -34,7 +34,7 @@ describe('Design management upload button component', () => {
     it('Button `loading` prop is `true`', () => {
       createComponent({ isSaving: true });
 
-      const button = wrapper.find(GlButton);
+      const button = wrapper.findComponent(GlButton);
       expect(button.exists()).toBe(true);
       expect(button.props('loading')).toBe(true);
     });
diff --git a/spec/frontend/design_management/components/upload/design_version_dropdown_spec.js b/spec/frontend/design_management/components/upload/design_version_dropdown_spec.js
index ec5db04bb80..7c26ab9739b 100644
--- a/spec/frontend/design_management/components/upload/design_version_dropdown_spec.js
+++ b/spec/frontend/design_management/components/upload/design_version_dropdown_spec.js
@@ -46,7 +46,7 @@ describe('Design management design version dropdown component', () => {
     wrapper.destroy();
   });
 
-  const findVersionLink = (index) => wrapper.findAll(GlDropdownItem).at(index);
+  const findVersionLink = (index) => wrapper.findAllComponents(GlDropdownItem).at(index);
 
   it('renders design version dropdown button', async () => {
     createComponent();
@@ -76,35 +76,35 @@ describe('Design management design version dropdown component', () => {
       createComponent();
 
       await nextTick();
-      expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing latest version');
+      expect(wrapper.findComponent(GlDropdown).attributes('text')).toBe('Showing latest version');
     });
 
     it('displays latest version text when only 1 version is present', async () => {
       createComponent({ maxVersions: 1 });
 
       await nextTick();
-      expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing latest version');
+      expect(wrapper.findComponent(GlDropdown).attributes('text')).toBe('Showing latest version');
     });
 
     it('displays version text when the current version is not the latest', async () => {
       createComponent({ $route: designRouteFactory(PREVIOUS_VERSION_ID) });
 
       await nextTick();
-      expect(wrapper.find(GlDropdown).attributes('text')).toBe(`Showing version #1`);
+      expect(wrapper.findComponent(GlDropdown).attributes('text')).toBe(`Showing version #1`);
     });
 
     it('displays latest version text when the current version is the latest', async () => {
       createComponent({ $route: designRouteFactory(LATEST_VERSION_ID) });
 
       await nextTick();
-      expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing latest version');
+      expect(wrapper.findComponent(GlDropdown).attributes('text')).toBe('Showing latest version');
     });
 
     it('should have the same length as apollo query', async () => {
       createComponent();
 
       await nextTick();
-      expect(wrapper.findAll(GlDropdownItem)).toHaveLength(wrapper.vm.allVersions.length);
+      expect(wrapper.findAllComponents(GlDropdownItem)).toHaveLength(wrapper.vm.allVersions.length);
     });
 
     it('should render TimeAgo', async () => {
diff --git a/spec/frontend/design_management/pages/design/index_spec.js b/spec/frontend/design_management/pages/design/index_spec.js
index 17a299c5de1..774e37a8b21 100644
--- a/spec/frontend/design_management/pages/design/index_spec.js
+++ b/spec/frontend/design_management/pages/design/index_spec.js
@@ -85,9 +85,9 @@ describe('Design management design index page', () => {
   let wrapper;
   let router;
 
-  const findDiscussionForm = () => wrapper.find(DesignReplyForm);
-  const findSidebar = () => wrapper.find(DesignSidebar);
-  const findDesignPresentation = () => wrapper.find(DesignPresentation);
+  const findDiscussionForm = () => wrapper.findComponent(DesignReplyForm);
+  const findSidebar = () => wrapper.findComponent(DesignSidebar);
+  const findDesignPresentation = () => wrapper.findComponent(DesignPresentation);
 
   function createComponent(
     { loading = false } = {},
@@ -181,15 +181,15 @@ describe('Design management design index page', () => {
   it('sets loading state', () => {
     createComponent({ loading: true });
 
-    expect(wrapper.find(DesignPresentation).props('isLoading')).toBe(true);
-    expect(wrapper.find(DesignSidebar).props('isLoading')).toBe(true);
+    expect(wrapper.findComponent(DesignPresentation).props('isLoading')).toBe(true);
+    expect(wrapper.findComponent(DesignSidebar).props('isLoading')).toBe(true);
   });
 
   it('renders design index', () => {
     createComponent({ loading: false }, { data: { design } });
 
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find(GlAlert).exists()).toBe(false);
+    expect(wrapper.findComponent(GlAlert).exists()).toBe(false);
   });
 
   it('passes correct props to sidebar component', () => {
diff --git a/spec/frontend/design_management/pages/index_spec.js b/spec/frontend/design_management/pages/index_spec.js
index 321d55cbaef..f90feaadfb0 100644
--- a/spec/frontend/design_management/pages/index_spec.js
+++ b/spec/frontend/design_management/pages/index_spec.js
@@ -111,8 +111,8 @@ describe('Design management index page', () => {
   const findDropzoneWrapper = () => wrapper.findByTestId('design-dropzone-wrapper');
   const findFirstDropzoneWithDesign = () => wrapper.findAllComponents(DesignDropzone).at(1);
   const findDesignsWrapper = () => wrapper.findByTestId('designs-root');
-  const findDesigns = () => wrapper.findAll(Design);
-  const draggableAttributes = () => wrapper.find(VueDraggable).vm.$attrs;
+  const findDesigns = () => wrapper.findAllComponents(Design);
+  const draggableAttributes = () => wrapper.findComponent(VueDraggable).vm.$attrs;
   const findDesignUploadButton = () => wrapper.findByTestId('design-upload-button');
   const findDesignToolbarWrapper = () => wrapper.findByTestId('design-toolbar-wrapper');
   const findDesignUpdateAlert = () => wrapper.findByTestId('design-update-alert');
@@ -120,8 +120,8 @@ describe('Design management index page', () => {
   async function moveDesigns(localWrapper) {
     await waitForPromises();
 
-    localWrapper.find(VueDraggable).vm.$emit('input', reorderedDesigns);
-    localWrapper.find(VueDraggable).vm.$emit('change', {
+    localWrapper.findComponent(VueDraggable).vm.$emit('input', reorderedDesigns);
+    localWrapper.findComponent(VueDraggable).vm.$emit('change', {
       moved: {
         newIndex: 0,
         element: designToMove,
diff --git a/spec/frontend/design_management/router_spec.js b/spec/frontend/design_management/router_spec.js
index b9c62334223..b9edde559c8 100644
--- a/spec/frontend/design_management/router_spec.js
+++ b/spec/frontend/design_management/router_spec.js
@@ -44,7 +44,7 @@ describe('Design management router', () => {
     it('pushes home component', () => {
       const wrapper = factory(routeArg);
 
-      expect(wrapper.find(Designs).exists()).toBe(true);
+      expect(wrapper.findComponent(Designs).exists()).toBe(true);
     });
   });
 
@@ -55,7 +55,7 @@ describe('Design management router', () => {
         const wrapper = factory(routeArg);
 
         return nextTick().then(() => {
-          const detail = wrapper.find(DesignDetail);
+          const detail = wrapper.findComponent(DesignDetail);
           expect(detail.exists()).toBe(true);
           expect(detail.props('id')).toEqual('1');
         });
diff --git a/spec/frontend/diffs/components/diff_file_header_spec.js b/spec/frontend/diffs/components/diff_file_header_spec.js
index d90afeb6b82..92b8b2d4aa3 100644
--- a/spec/frontend/diffs/components/diff_file_header_spec.js
+++ b/spec/frontend/diffs/components/diff_file_header_spec.js
@@ -263,7 +263,7 @@ describe('DiffFileHeader component', () => {
             },
           },
         });
-        expect(findModeChangedLine().exists()).toBeFalsy();
+        expect(findModeChangedLine().exists()).toBe(false);
       },
     );
 
diff --git a/spec/frontend/ide/components/shared/commit_message_field_spec.js b/spec/frontend/ide/components/shared/commit_message_field_spec.js
index f4f9b95b233..94da06f4cb2 100644
--- a/spec/frontend/ide/components/shared/commit_message_field_spec.js
+++ b/spec/frontend/ide/components/shared/commit_message_field_spec.js
@@ -79,7 +79,7 @@ describe('CommitMessageField', () => {
         await fillText(text);
 
         expect(findHighlightsText().text()).toEqual(text);
-        expect(findHighlightsMark().text()).toBeFalsy();
+        expect(findHighlightsMark().text()).toBe('');
       });
 
       it('highlights characters over 50 length', async () => {
diff --git a/spec/frontend/ide/stores/actions/file_spec.js b/spec/frontend/ide/stores/actions/file_spec.js
index 6c1dee1e5ca..d1c31cd412b 100644
--- a/spec/frontend/ide/stores/actions/file_spec.js
+++ b/spec/frontend/ide/stores/actions/file_spec.js
@@ -60,8 +60,8 @@ describe('IDE store file actions', () => {
 
     it('closes open files', () => {
       return store.dispatch('closeFile', localFile).then(() => {
-        expect(localFile.opened).toBeFalsy();
-        expect(localFile.active).toBeFalsy();
+        expect(localFile.opened).toBe(false);
+        expect(localFile.active).toBe(false);
         expect(store.state.openFiles.length).toBe(0);
       });
     });
@@ -269,7 +269,7 @@ describe('IDE store file actions', () => {
 
       it('sets the file as active', () => {
         return store.dispatch('getFileData', { path: localFile.path }).then(() => {
-          expect(localFile.active).toBeTruthy();
+          expect(localFile.active).toBe(true);
         });
       });
 
@@ -277,7 +277,7 @@ describe('IDE store file actions', () => {
         return store
           .dispatch('getFileData', { path: localFile.path, makeFileActive: false })
           .then(() => {
-            expect(localFile.active).toBeFalsy();
+            expect(localFile.active).toBe(false);
           });
       });
 
diff --git a/spec/frontend/projects/commits/components/author_select_spec.js b/spec/frontend/projects/commits/components/author_select_spec.js
index 436262ff461..57e5ef0ed1d 100644
--- a/spec/frontend/projects/commits/components/author_select_spec.js
+++ b/spec/frontend/projects/commits/components/author_select_spec.js
@@ -71,7 +71,7 @@ describe('Author Select', () => {
       wrapper.setData({ hasSearchParam: true });
 
       await nextTick();
-      expect(findDropdownContainer().attributes('disabled')).toBe(undefined);
+      expect(findDropdownContainer().attributes('disabled')).toBeUndefined();
     });
 
     it('has correct tooltip message', async () => {
@@ -91,7 +91,7 @@ describe('Author Select', () => {
       wrapper.setData({ hasSearchParam: false });
 
       await nextTick();
-      expect(findDropdown().attributes('disabled')).toBe(undefined);
+      expect(findDropdown().attributes('disabled')).toBeUndefined();
     });
 
     it('hasSearchParam if user types a truthy string', () => {
diff --git a/spec/frontend/vue_merge_request_widget/components/states/mr_widget_wip_spec.js b/spec/frontend/vue_merge_request_widget/components/states/mr_widget_wip_spec.js
index e4ffa37a84d..af52901f508 100644
--- a/spec/frontend/vue_merge_request_widget/components/states/mr_widget_wip_spec.js
+++ b/spec/frontend/vue_merge_request_widget/components/states/mr_widget_wip_spec.js
@@ -26,11 +26,11 @@ describe('Wip', () => {
     it('should have props', () => {
       const { mr, service } = WorkInProgress.props;
 
-      expect(mr.type instanceof Object).toBeTruthy();
-      expect(mr.required).toBeTruthy();
+      expect(mr.type instanceof Object).toBe(true);
+      expect(mr.required).toBe(true);
 
-      expect(service.type instanceof Object).toBeTruthy();
-      expect(service.required).toBeTruthy();
+      expect(service.type instanceof Object).toBe(true);
+      expect(service.required).toBe(true);
     });
   });
 
@@ -64,7 +64,7 @@ describe('Wip', () => {
 
         await waitForPromises();
 
-        expect(vm.isMakingRequest).toBeTruthy();
+        expect(vm.isMakingRequest).toBe(true);
         expect(eventHub.$emit).toHaveBeenCalledWith('UpdateWidgetData', mrObj);
         expect(toast).toHaveBeenCalledWith('Marked as ready. Merging is now allowed.');
       });
@@ -81,7 +81,7 @@ describe('Wip', () => {
     });
 
     it('should have correct elements', () => {
-      expect(el.classList.contains('mr-widget-body')).toBeTruthy();
+      expect(el.classList.contains('mr-widget-body')).toBe(true);
       expect(el.innerText).toContain(
         "Merge blocked: merge request must be marked as ready. It's still marked as draft.",
       );
@@ -95,7 +95,7 @@ describe('Wip', () => {
 
       await nextTick();
 
-      expect(el.querySelector('.js-remove-draft')).toEqual(null);
+      expect(el.querySelector('.js-remove-draft')).toBeNull();
     });
   });
 });
diff --git a/spec/frontend/vue_shared/components/confirm_modal_spec.js b/spec/frontend/vue_shared/components/confirm_modal_spec.js
index 0af789c78df..c1e682a1aae 100644
--- a/spec/frontend/vue_shared/components/confirm_modal_spec.js
+++ b/spec/frontend/vue_shared/components/confirm_modal_spec.js
@@ -104,7 +104,7 @@ describe('vue_shared/components/confirm_modal', () => {
       });
 
       it('renders GlModal with data', () => {
-        expect(findModal().exists()).toBeTruthy();
+        expect(findModal().exists()).toBe(true);
         expect(findModal().attributes()).toEqual(
           expect.objectContaining({
             oktitle: MOCK_MODAL_DATA.modalAttributes.okTitle,
diff --git a/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_modal_spec.js b/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_modal_spec.js
index 112a0e67a0f..7c5fc63856a 100644
--- a/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_modal_spec.js
+++ b/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_modal_spec.js
@@ -234,14 +234,14 @@ describe('RunnerInstructionsModal component', () => {
         MockResizeObserver.mockResize('xs');
         await nextTick();
 
-        expect(findPlatformButtonGroup().attributes('vertical')).toBeTruthy();
+        expect(findPlatformButtonGroup().attributes('vertical')).toEqual('true');
       });
 
       it('to a non-xs viewport', async () => {
         MockResizeObserver.mockResize('sm');
         await nextTick();
 
-        expect(findPlatformButtonGroup().props('vertical')).toBeFalsy();
+        expect(findPlatformButtonGroup().props('vertical')).toBeUndefined();
       });
     });
   });
diff --git a/spec/frontend/vue_shared/components/web_ide_link_spec.js b/spec/frontend/vue_shared/components/web_ide_link_spec.js
index 41163aef320..a0b868d1d52 100644
--- a/spec/frontend/vue_shared/components/web_ide_link_spec.js
+++ b/spec/frontend/vue_shared/components/web_ide_link_spec.js
@@ -3,7 +3,7 @@ import { nextTick } from 'vue';
 
 import ActionsButton from '~/vue_shared/components/actions_button.vue';
 import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
-import WebIdeLink from '~/vue_shared/components/web_ide_link.vue';
+import WebIdeLink, { i18n } from '~/vue_shared/components/web_ide_link.vue';
 import ConfirmForkModal from '~/vue_shared/components/confirm_fork_modal.vue';
 
 import { stubComponent } from 'helpers/stub_component';
@@ -37,8 +37,8 @@ const ACTION_EDIT_CONFIRM_FORK = {
 const ACTION_WEB_IDE = {
   href: TEST_WEB_IDE_URL,
   key: 'webide',
-  secondaryText: 'Quickly and easily edit multiple files in your project.',
-  tooltip: '',
+  secondaryText: i18n.webIdeText,
+  tooltip: i18n.webIdeTooltip,
   text: 'Web IDE',
   attrs: {
     'data-qa-selector': 'web_ide_button',