Merge branch 'xanf-vtu-v1-strings-as-stubs' into 'master'

Upgrading VTU to v1: Remove deprecated strings as stubs

See merge request gitlab-org/gitlab!50514

ee/spec/frontend/boards/components/board_content_sidebar_spec.js

 import { GlDrawer } from '@gitlab/ui';
-import { mount } from '@vue/test-utils';
+import { shallowMount } from '@vue/test-utils';
 import BoardContentSidebar from 'ee_component/boards/components/board_content_sidebar.vue';
+import { stubComponent } from 'helpers/stub_component';
 import waitForPromises from 'helpers/wait_for_promises';
 import BoardAssigneeDropdown from '~/boards/components/board_assignee_dropdown.vue';
 import IssuableTitle from '~/boards/components/issuable_title.vue';
@@ -12,20 +13,16 @@ describe('ee/BoardContentSidebar', () => {
   let store;
 
   const createComponent = () => {
-    wrapper = mount(BoardContentSidebar, {
+    wrapper = shallowMount(BoardContentSidebar, {
       provide: {
         canUpdate: true,
         rootPath: '',
       },
       store,
       stubs: {
-        'board-sidebar-epic-select': '<div></div>',
-        'board-sidebar-time-tracker': '<div></div>',
-        'board-sidebar-weight-input': '<div></div>',
-        'board-sidebar-labels-select': '<div></div>',
-        'board-sidebar-due-date': '<div></div>',
-        'board-sidebar-subscription': '<div></div>',
-        'board-sidebar-milestone-select': '<div></div>',
+        GlDrawer: stubComponent(GlDrawer, {
+          template: '<div><slot name="header"></slot><slot></slot></div>',
+        }),
       },
       mocks: {
         $apollo: {
@@ -62,7 +59,7 @@ describe('ee/BoardContentSidebar', () => {
   });
 
   it('finds IssuableTitle', () => {
-    expect(wrapper.find(IssuableTitle).text()).toContain('One');
+    expect(wrapper.find(IssuableTitle).props('title')).toContain('One');
   });
 
   it('renders BoardAssigneeDropdown', () => {

spec/frontend/blob/pipeline_tour_success_modal_spec.js

@@ -10,13 +10,14 @@ describe('PipelineTourSuccessModal', () => {
   let cookieSpy;
   let trackingSpy;
 
+  const GlEmoji = { template: '<img/>' };
   const createComponent = () => {
     wrapper = shallowMount(pipelineTourSuccess, {
       propsData: modalProps,
       stubs: {
         GlModal,
         GlSprintf,
-        'gl-emoji': '<img/>',
+        GlEmoji,
       },
     });
   };
@@ -67,7 +68,7 @@ describe('PipelineTourSuccessModal', () => {
   it('has expected structure', () => {
     const modal = wrapper.find(GlModal);
     const sprintf = modal.find(GlSprintf);
-    const emoji = modal.find('img');
+    const emoji = modal.find(GlEmoji);
 
     expect(wrapper.text()).toContain("That's it, well done!");
     expect(sprintf.exists()).toBe(true);

spec/frontend/boards/components/sidebar/board_sidebar_labels_select_spec.js

@@ -37,8 +37,8 @@ describe('~/boards/components/sidebar/board_sidebar_labels_select.vue', () => {
         labelsFilterBasePath: TEST_HOST,
       },
       stubs: {
-        'board-editable-item': BoardEditableItem,
-        'labels-select': '<div></div>',
+        BoardEditableItem,
+        LabelsSelect: true,
       },
     });
   };

spec/frontend/invite_member/components/invite_member_modal_spec.js

 import { shallowMount } from '@vue/test-utils';
-import { GlLink } from '@gitlab/ui';
+import { GlLink, GlModal } from '@gitlab/ui';
 import { mockTracking, unmockTracking, triggerEvent } from 'helpers/tracking_helper';
+import { stubComponent } from 'helpers/stub_component';
 import InviteMemberModal from '~/invite_member/components/invite_member_modal.vue';
 
 const memberPath = 'member_path';
 
+const GlEmoji = { template: '<img />' };
 const createComponent = () => {
   return shallowMount(InviteMemberModal, {
     provide: {
       membersPath: memberPath,
     },
     stubs: {
-      'gl-emoji': '<img/>',
-      'gl-modal': '<div><slot name="modal-title"></slot><slot></slot></div>',
+      GlEmoji,
+      GlModal: stubComponent(GlModal, {
+        template: '<div><slot name="modal-title"></slot><slot></slot></div>',
+      }),
     },
   });
 };

spec/frontend/invite_members/components/invite_members_modal_spec.js

 import { shallowMount } from '@vue/test-utils';
-import { GlDropdown, GlDropdownItem, GlDatepicker, GlSprintf, GlLink } from '@gitlab/ui';
+import { GlDropdown, GlDropdownItem, GlDatepicker, GlSprintf, GlLink, GlModal } from '@gitlab/ui';
+import { stubComponent } from 'helpers/stub_component';
 import Api from '~/api';
 import InviteMembersModal from '~/invite_members/components/invite_members_modal.vue';
 
@@ -24,9 +25,12 @@ const createComponent = (data = {}) => {
       return data;
     },
     stubs: {
-      'gl-modal': '<div><slot name="modal-footer"></slot><slot></slot></div>',
-      'gl-dropdown': true,
-      'gl-dropdown-item': true,
+      GlModal: stubComponent(GlModal, {
+        template:
+          '<div><slot name="modal-title"></slot><slot></slot><slot name="modal-footer"></slot></div>',
+      }),
+      GlDropdown: true,
+      GlDropdownItem: true,
       GlSprintf,
     },
   });

spec/frontend/packages/details/components/package_files_spec.js

@@ -24,7 +24,6 @@ describe('Package Files', () => {
       stubs: {
         ...stubChildren(component),
         GlTable: false,
-        GlLink: '<div><slot></slot></div>',
       },
     });
   };