Add latest changes from gitlab-org/gitlab@15-3-stable-eev15.3.0-rc42

23 files changed, 46 insertions, 40 deletions

diff --git a/spec/frontend/members/components/action_buttons/access_request_action_buttons_spec.js b/spec/frontend/members/components/action_buttons/access_request_action_buttons_spec.js
index f1471f625f8..3dac47974e7 100644
--- a/spec/frontend/members/components/action_buttons/access_request_action_buttons_spec.js
+++ b/spec/frontend/members/components/action_buttons/access_request_action_buttons_spec.js
@@ -17,8 +17,8 @@ describe('AccessRequestActionButtons', () => {
     });
   };
 
-  const findRemoveMemberButton = () => wrapper.find(RemoveMemberButton);
-  const findApproveButton = () => wrapper.find(ApproveAccessRequestButton);
+  const findRemoveMemberButton = () => wrapper.findComponent(RemoveMemberButton);
+  const findApproveButton = () => wrapper.findComponent(ApproveAccessRequestButton);
 
   afterEach(() => {
     wrapper.destroy();
diff --git a/spec/frontend/members/components/action_buttons/approve_access_request_button_spec.js b/spec/frontend/members/components/action_buttons/approve_access_request_button_spec.js
index 08d7cf3c932..15bb03480e1 100644
--- a/spec/frontend/members/components/action_buttons/approve_access_request_button_spec.js
+++ b/spec/frontend/members/components/action_buttons/approve_access_request_button_spec.js
@@ -43,8 +43,8 @@ describe('ApproveAccessRequestButton', () => {
     });
   };
 
-  const findForm = () => wrapper.find(GlForm);
-  const findButton = () => findForm().find(GlButton);
+  const findForm = () => wrapper.findComponent(GlForm);
+  const findButton = () => findForm().findComponent(GlButton);
 
   beforeEach(() => {
     createComponent();
diff --git a/spec/frontend/members/components/action_buttons/invite_action_buttons_spec.js b/spec/frontend/members/components/action_buttons/invite_action_buttons_spec.js
index 79252456f67..ea819b4fb83 100644
--- a/spec/frontend/members/components/action_buttons/invite_action_buttons_spec.js
+++ b/spec/frontend/members/components/action_buttons/invite_action_buttons_spec.js
@@ -16,8 +16,8 @@ describe('InviteActionButtons', () => {
     });
   };
 
-  const findRemoveMemberButton = () => wrapper.find(RemoveMemberButton);
-  const findResendInviteButton = () => wrapper.find(ResendInviteButton);
+  const findRemoveMemberButton = () => wrapper.findComponent(RemoveMemberButton);
+  const findResendInviteButton = () => wrapper.findComponent(ResendInviteButton);
 
   afterEach(() => {
     wrapper.destroy();
diff --git a/spec/frontend/members/components/action_buttons/leave_button_spec.js b/spec/frontend/members/components/action_buttons/leave_button_spec.js
index 4859d033464..ecfbf4460a6 100644
--- a/spec/frontend/members/components/action_buttons/leave_button_spec.js
+++ b/spec/frontend/members/components/action_buttons/leave_button_spec.js
@@ -22,7 +22,7 @@ describe('LeaveButton', () => {
     });
   };
 
-  const findButton = () => wrapper.find(GlButton);
+  const findButton = () => wrapper.findComponent(GlButton);
 
   beforeEach(() => {
     createComponent();
@@ -44,7 +44,7 @@ describe('LeaveButton', () => {
   });
 
   it('renders leave modal', () => {
-    const leaveModal = wrapper.find(LeaveModal);
+    const leaveModal = wrapper.findComponent(LeaveModal);
 
     expect(leaveModal.exists()).toBe(true);
     expect(leaveModal.props('member')).toEqual(member);
diff --git a/spec/frontend/members/components/action_buttons/remove_group_link_button_spec.js b/spec/frontend/members/components/action_buttons/remove_group_link_button_spec.js
index ca655e36c42..b511cebdf28 100644
--- a/spec/frontend/members/components/action_buttons/remove_group_link_button_spec.js
+++ b/spec/frontend/members/components/action_buttons/remove_group_link_button_spec.js
@@ -42,7 +42,7 @@ describe('RemoveGroupLinkButton', () => {
     });
   };
 
-  const findButton = () => wrapper.find(GlButton);
+  const findButton = () => wrapper.findComponent(GlButton);
 
   beforeEach(() => {
     createComponent();
diff --git a/spec/frontend/members/components/action_buttons/resend_invite_button_spec.js b/spec/frontend/members/components/action_buttons/resend_invite_button_spec.js
index 8e933d16463..51cfd47ddf4 100644
--- a/spec/frontend/members/components/action_buttons/resend_invite_button_spec.js
+++ b/spec/frontend/members/components/action_buttons/resend_invite_button_spec.js
@@ -44,7 +44,7 @@ describe('ResendInviteButton', () => {
   };
 
   const findForm = () => wrapper.find('form');
-  const findButton = () => findForm().find(GlButton);
+  const findButton = () => findForm().findComponent(GlButton);
 
   beforeEach(() => {
     createComponent();
diff --git a/spec/frontend/members/components/action_buttons/user_action_buttons_spec.js b/spec/frontend/members/components/action_buttons/user_action_buttons_spec.js
index 3e4ffb6e61b..6ac46619bc9 100644
--- a/spec/frontend/members/components/action_buttons/user_action_buttons_spec.js
+++ b/spec/frontend/members/components/action_buttons/user_action_buttons_spec.js
@@ -19,7 +19,7 @@ describe('UserActionButtons', () => {
     });
   };
 
-  const findRemoveMemberButton = () => wrapper.find(RemoveMemberButton);
+  const findRemoveMemberButton = () => wrapper.findComponent(RemoveMemberButton);
 
   afterEach(() => {
     wrapper.destroy();
@@ -80,7 +80,7 @@ describe('UserActionButtons', () => {
           },
         });
 
-        expect(wrapper.find(LeaveButton).exists()).toBe(true);
+        expect(wrapper.findComponent(LeaveButton).exists()).toBe(true);
       });
     });
   });
diff --git a/spec/frontend/members/components/app_spec.js b/spec/frontend/members/components/app_spec.js
index 4124a1870a6..d105a4d9fde 100644
--- a/spec/frontend/members/components/app_spec.js
+++ b/spec/frontend/members/components/app_spec.js
@@ -41,8 +41,8 @@ describe('MembersApp', () => {
     });
   };
 
-  const findAlert = () => wrapper.find(GlAlert);
-  const findFilterSortContainer = () => wrapper.find(FilterSortContainer);
+  const findAlert = () => wrapper.findComponent(GlAlert);
+  const findFilterSortContainer = () => wrapper.findComponent(FilterSortContainer);
 
   beforeEach(() => {
     commonUtils.scrollToElement = jest.fn();
diff --git a/spec/frontend/members/components/avatars/group_avatar_spec.js b/spec/frontend/members/components/avatars/group_avatar_spec.js
index 9c1574a84ee..13c50de9835 100644
--- a/spec/frontend/members/components/avatars/group_avatar_spec.js
+++ b/spec/frontend/members/components/avatars/group_avatar_spec.js
@@ -30,7 +30,7 @@ describe('MemberList', () => {
   });
 
   it('renders link to group', () => {
-    const link = wrapper.find(GlAvatarLink);
+    const link = wrapper.findComponent(GlAvatarLink);
 
     expect(link.exists()).toBe(true);
     expect(link.attributes('href')).toBe(group.webUrl);
diff --git a/spec/frontend/members/components/avatars/user_avatar_spec.js b/spec/frontend/members/components/avatars/user_avatar_spec.js
index 7bcf4a11413..9b908e5b6f0 100644
--- a/spec/frontend/members/components/avatars/user_avatar_spec.js
+++ b/spec/frontend/members/components/avatars/user_avatar_spec.js
@@ -33,7 +33,7 @@ describe('UserAvatar', () => {
   it("renders link to user's profile", () => {
     createComponent();
 
-    const link = wrapper.find(GlAvatarLink);
+    const link = wrapper.findComponent(GlAvatarLink);
 
     expect(link.exists()).toBe(true);
     expect(link.attributes()).toMatchObject({
@@ -77,7 +77,7 @@ describe('UserAvatar', () => {
     `('renders the "$badgeText" badge', ({ member, badgeText }) => {
       createComponent({ member });
 
-      expect(wrapper.find(GlBadge).text()).toBe(badgeText);
+      expect(wrapper.findComponent(GlBadge).text()).toBe(badgeText);
     });
 
     it('renders the "It\'s you" badge when member is current user', () => {
diff --git a/spec/frontend/members/components/filter_sort/filter_sort_container_spec.js b/spec/frontend/members/components/filter_sort/filter_sort_container_spec.js
index 4ca8a3bdc36..de2f6e6dd47 100644
--- a/spec/frontend/members/components/filter_sort/filter_sort_container_spec.js
+++ b/spec/frontend/members/components/filter_sort/filter_sort_container_spec.js
@@ -60,7 +60,7 @@ describe('FilterSortContainer', () => {
         },
       });
 
-      expect(wrapper.find(MembersFilteredSearchBar).exists()).toBe(true);
+      expect(wrapper.findComponent(MembersFilteredSearchBar).exists()).toBe(true);
     });
   });
 
@@ -70,7 +70,7 @@ describe('FilterSortContainer', () => {
         tableSortableFields: ['account'],
       });
 
-      expect(wrapper.find(SortDropdown).exists()).toBe(true);
+      expect(wrapper.findComponent(SortDropdown).exists()).toBe(true);
     });
   });
 });
diff --git a/spec/frontend/members/components/filter_sort/members_filtered_search_bar_spec.js b/spec/frontend/members/components/filter_sort/members_filtered_search_bar_spec.js
index b692eea4aa5..4580fdb06f2 100644
--- a/spec/frontend/members/components/filter_sort/members_filtered_search_bar_spec.js
+++ b/spec/frontend/members/components/filter_sort/members_filtered_search_bar_spec.js
@@ -56,7 +56,7 @@ describe('MembersFilteredSearchBar', () => {
     });
   };
 
-  const findFilteredSearchBar = () => wrapper.find(FilteredSearchBar);
+  const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
 
   it('passes correct props to `FilteredSearchBar` component', () => {
     createComponent();
diff --git a/spec/frontend/members/components/filter_sort/sort_dropdown_spec.js b/spec/frontend/members/components/filter_sort/sort_dropdown_spec.js
index 709ad907a38..5581fd52458 100644
--- a/spec/frontend/members/components/filter_sort/sort_dropdown_spec.js
+++ b/spec/frontend/members/components/filter_sort/sort_dropdown_spec.js
@@ -43,13 +43,13 @@ describe('SortDropdown', () => {
     });
   };
 
-  const findSortingComponent = () => wrapper.find(GlSorting);
+  const findSortingComponent = () => wrapper.findComponent(GlSorting);
   const findSortDirectionToggle = () =>
     findSortingComponent().find('button[title="Sort direction"]');
   const findDropdownToggle = () => wrapper.find('button[aria-haspopup="true"]');
   const findDropdownItemByText = (text) =>
     wrapper
-      .findAll(GlSortingItem)
+      .findAllComponents(GlSortingItem)
       .wrappers.find((dropdownItemWrapper) => dropdownItemWrapper.text() === text);
 
   beforeEach(() => {
diff --git a/spec/frontend/members/components/modals/remove_group_link_modal_spec.js b/spec/frontend/members/components/modals/remove_group_link_modal_spec.js
index 447496910b8..af96396f09f 100644
--- a/spec/frontend/members/components/modals/remove_group_link_modal_spec.js
+++ b/spec/frontend/members/components/modals/remove_group_link_modal_spec.js
@@ -47,8 +47,8 @@ describe('RemoveGroupLinkModal', () => {
     });
   };
 
-  const findModal = () => wrapper.find(GlModal);
-  const findForm = () => findModal().find(GlForm);
+  const findModal = () => wrapper.findComponent(GlModal);
+  const findForm = () => findModal().findComponent(GlForm);
   const getByText = (text, options) =>
     createWrapper(within(findModal().element).getByText(text, options));
 
diff --git a/spec/frontend/members/components/modals/remove_member_modal_spec.js b/spec/frontend/members/components/modals/remove_member_modal_spec.js
index 1d39c4b3175..59b112492b8 100644
--- a/spec/frontend/members/components/modals/remove_member_modal_spec.js
+++ b/spec/frontend/members/components/modals/remove_member_modal_spec.js
@@ -46,7 +46,7 @@ describe('RemoveMemberModal', () => {
     });
   };
 
-  const findForm = () => wrapper.find({ ref: 'form' });
+  const findForm = () => wrapper.findComponent({ ref: 'form' });
   const findGlModal = () => wrapper.findComponent(GlModal);
   const findUserDeletionObstaclesList = () => wrapper.findComponent(UserDeletionObstaclesList);
 
diff --git a/spec/frontend/members/components/table/created_at_spec.js b/spec/frontend/members/components/table/created_at_spec.js
index 74b71e22893..793c122587d 100644
--- a/spec/frontend/members/components/table/created_at_spec.js
+++ b/spec/frontend/members/components/table/created_at_spec.js
@@ -39,7 +39,7 @@ describe('CreatedAt', () => {
     });
 
     it('uses `TimeAgoTooltip` component to display tooltip', () => {
-      expect(wrapper.find(TimeAgoTooltip).exists()).toBe(true);
+      expect(wrapper.findComponent(TimeAgoTooltip).exists()).toBe(true);
     });
   });
 
diff --git a/spec/frontend/members/components/table/expiration_datepicker_spec.js b/spec/frontend/members/components/table/expiration_datepicker_spec.js
index 4fb43fbd888..9b8f053348b 100644
--- a/spec/frontend/members/components/table/expiration_datepicker_spec.js
+++ b/spec/frontend/members/components/table/expiration_datepicker_spec.js
@@ -56,7 +56,7 @@ describe('ExpirationDatepicker', () => {
   };
 
   const findInput = () => wrapper.find('input');
-  const findDatepicker = () => wrapper.find(GlDatepicker);
+  const findDatepicker = () => wrapper.findComponent(GlDatepicker);
 
   afterEach(() => {
     wrapper.destroy();
diff --git a/spec/frontend/members/components/table/member_action_buttons_spec.js b/spec/frontend/members/components/table/member_action_buttons_spec.js
index 1379b2d26ce..f3f50bf620a 100644
--- a/spec/frontend/members/components/table/member_action_buttons_spec.js
+++ b/spec/frontend/members/components/table/member_action_buttons_spec.js
@@ -38,7 +38,7 @@ describe('MemberActionButtons', () => {
     ({ memberType, member, expectedComponent }) => {
       createComponent({ memberType, member });
 
-      expect(wrapper.find(expectedComponent).exists()).toBe(true);
+      expect(wrapper.findComponent(expectedComponent).exists()).toBe(true);
     },
   );
 });
diff --git a/spec/frontend/members/components/table/member_avatar_spec.js b/spec/frontend/members/components/table/member_avatar_spec.js
index 3cce64effbc..35f82c28fc5 100644
--- a/spec/frontend/members/components/table/member_avatar_spec.js
+++ b/spec/frontend/members/components/table/member_avatar_spec.js
@@ -33,7 +33,7 @@ describe('MemberList', () => {
     ({ memberType, member, expectedComponent }) => {
       createComponent({ memberType, member });
 
-      expect(wrapper.find(expectedComponent).exists()).toBe(true);
+      expect(wrapper.findComponent(expectedComponent).exists()).toBe(true);
     },
   );
 });
diff --git a/spec/frontend/members/components/table/members_table_cell_spec.js b/spec/frontend/members/components/table/members_table_cell_spec.js
index 6575a7c7126..fd56699602e 100644
--- a/spec/frontend/members/components/table/members_table_cell_spec.js
+++ b/spec/frontend/members/components/table/members_table_cell_spec.js
@@ -69,7 +69,7 @@ describe('MembersTableCell', () => {
     });
   };
 
-  const findWrappedComponent = () => wrapper.find(WrappedComponent);
+  const findWrappedComponent = () => wrapper.findComponent(WrappedComponent);
 
   const memberCurrentUser = {
     ...memberMock,
diff --git a/spec/frontend/members/components/table/members_table_spec.js b/spec/frontend/members/components/table/members_table_spec.js
index 08baa663bf0..0ed01396fcb 100644
--- a/spec/frontend/members/components/table/members_table_spec.js
+++ b/spec/frontend/members/components/table/members_table_spec.js
@@ -81,13 +81,13 @@ describe('MembersTable', () => {
 
   const url = 'https://localhost/foo-bar/-/project_members?tab=invited';
 
-  const findTable = () => wrapper.find(GlTable);
+  const findTable = () => wrapper.findComponent(GlTable);
   const findTableCellByMemberId = (tableCellLabel, memberId) =>
     wrapper
       .findByTestId(`members-table-row-${memberId}`)
       .find(`[data-label="${tableCellLabel}"][role="cell"]`);
 
-  const findPagination = () => extendedWrapper(wrapper.find(GlPagination));
+  const findPagination = () => extendedWrapper(wrapper.findComponent(GlPagination));
 
   const expectCorrectLinkToPage2 = () => {
     expect(findPagination().findByText('2', { selector: 'a' }).attributes('href')).toBe(
@@ -126,7 +126,10 @@ describe('MembersTable', () => {
 
       if (expectedComponent) {
         expect(
-          wrapper.find(`[data-label="${label}"][role="cell"]`).find(expectedComponent).exists(),
+          wrapper
+            .find(`[data-label="${label}"][role="cell"]`)
+            .findComponent(expectedComponent)
+            .exists(),
         ).toBe(true);
       }
     });
@@ -179,7 +182,10 @@ describe('MembersTable', () => {
         expect(actionField.exists()).toBe(true);
         expect(actionField.classes('gl-sr-only')).toBe(true);
         expect(
-          wrapper.find(`[data-label="Actions"][role="cell"]`).find(MemberActionButtons).exists(),
+          wrapper
+            .find(`[data-label="Actions"][role="cell"]`)
+            .findComponent(MemberActionButtons)
+            .exists(),
         ).toBe(true);
       });
 
@@ -250,9 +256,9 @@ describe('MembersTable', () => {
     it('renders badge in "Max role" field', () => {
       createComponent({ members: [memberMock], tableFields: ['maxRole'] });
 
-      expect(wrapper.find(`[data-label="Max role"][role="cell"]`).find(GlBadge).text()).toBe(
-        memberMock.accessLevel.stringValue,
-      );
+      expect(
+        wrapper.find(`[data-label="Max role"][role="cell"]`).findComponent(GlBadge).text(),
+      ).toBe(memberMock.accessLevel.stringValue);
     });
   });
 
diff --git a/spec/frontend/members/components/table/role_dropdown_spec.js b/spec/frontend/members/components/table/role_dropdown_spec.js
index 2f1626a7044..b254cce4d72 100644
--- a/spec/frontend/members/components/table/role_dropdown_spec.js
+++ b/spec/frontend/members/components/table/role_dropdown_spec.js
@@ -57,11 +57,11 @@ describe('RoleDropdown', () => {
     );
   const getCheckedDropdownItem = () =>
     wrapper
-      .findAll(GlDropdownItem)
+      .findAllComponents(GlDropdownItem)
       .wrappers.find((dropdownItemWrapper) => dropdownItemWrapper.props('isChecked'));
 
   const findDropdownToggle = () => wrapper.find('button[aria-haspopup="true"]');
-  const findDropdown = () => wrapper.find(GlDropdown);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
 
   afterEach(() => {
     wrapper.destroy();
diff --git a/spec/frontend/members/index_spec.js b/spec/frontend/members/index_spec.js
index 251a8b0b774..5c813eb2a67 100644
--- a/spec/frontend/members/index_spec.js
+++ b/spec/frontend/members/index_spec.js
@@ -39,7 +39,7 @@ describe('initMembersApp', () => {
   it('renders `MembersTabs`', () => {
     setup();
 
-    expect(wrapper.find(MembersTabs).exists()).toBe(true);
+    expect(wrapper.findComponent(MembersTabs).exists()).toBe(true);
   });
 
   it('parses and sets `members` in Vuex store', () => {