Replace usage of find/findAll in ee/spec/frontend/vue_mr_widget

* migrate to proper use of findComponent/findAllComponents

ee/spec/frontend/vue_mr_widget/components/approvals/approvals_auth_spec.js

@@ -61,7 +61,7 @@ describe('Approval auth component', () => {
 
     it('emits the approve event', (done) => {
       findInput().setValue(TEST_PASSWORD);
-      wrapper.find(GlModal).vm.$emit('ok', { preventDefault: () => null });
+      wrapper.findComponent(GlModal).vm.$emit('ok', { preventDefault: () => null });
       waitForTick(done);
 
       expect(wrapper.emitted().approve).toEqual([[TEST_PASSWORD]]);

ee/spec/frontend/vue_mr_widget/components/approvals/approvals_footer_spec.js

@@ -25,13 +25,13 @@ describe('EE MRWidget approvals footer', () => {
     });
   };
 
-  const findToggle = () => wrapper.find(GlButton);
-  const findToggleIcon = () => findToggle().find(GlIcon);
-  const findToggleLoadingIcon = () => findToggle().find(GlLoadingIcon);
+  const findToggle = () => wrapper.findComponent(GlButton);
+  const findToggleIcon = () => findToggle().findComponent(GlIcon);
+  const findToggleLoadingIcon = () => findToggle().findComponent(GlLoadingIcon);
   const findExpandButton = () => wrapper.find('[data-testid="approvers-expand-button"]');
   const findCollapseButton = () => wrapper.find('[data-testid="approvers-collapse-button"]');
-  const findList = () => wrapper.find(ApprovalsList);
-  const findAvatars = () => wrapper.find(UserAvatarList);
+  const findList = () => wrapper.findComponent(ApprovalsList);
+  const findAvatars = () => wrapper.findComponent(UserAvatarList);
 
   afterEach(() => {
     wrapper.destroy();

ee/spec/frontend/vue_mr_widget/components/approvals/approvals_list_spec.js

@@ -67,7 +67,7 @@ describe('EE MRWidget approvals list', () => {
 
   const findRows = () => wrapper.findAll('tbody tr');
   const findRowElement = (row, name) => row.find(`.js-${name}`);
-  const findRowIcon = (row) => row.find(ApprovedIcon);
+  const findRowIcon = (row) => row.findComponent(ApprovedIcon);
 
   afterEach(() => {
     wrapper.destroy();
@@ -141,7 +141,7 @@ describe('EE MRWidget approvals list', () => {
 
     it('renders approvers', () => {
       const approversCell = findRowElement(row, 'approvers');
-      const approvers = approversCell.find(UserAvatarList);
+      const approvers = approversCell.findComponent(UserAvatarList);
 
       expect(approvers.exists()).toBe(true);
       expect(approvers.props()).toEqual(
@@ -159,7 +159,7 @@ describe('EE MRWidget approvals list', () => {
 
     it('renders approved_by user avatar list', () => {
       const approvedBy = findRowElement(row, 'approved-by');
-      const approvers = approvedBy.find(UserAvatarList);
+      const approvers = approvedBy.findComponent(UserAvatarList);
 
       expect(approvers.exists()).toBe(true);
       expect(approvers.props()).toEqual(
@@ -172,7 +172,7 @@ describe('EE MRWidget approvals list', () => {
 
     it('renders commented by user avatar list', () => {
       const commentedRow = findRowElement(row, 'commented-by');
-      const commentedBy = commentedRow.find(UserAvatarList);
+      const commentedBy = commentedRow.findComponent(UserAvatarList);
 
       expect(commentedBy.props()).toEqual(
         expect.objectContaining({
@@ -198,7 +198,7 @@ describe('EE MRWidget approvals list', () => {
       });
 
       it('renders approvers list', () => {
-        const approvers = summary.findAll(UserAvatarList).at(0);
+        const approvers = summary.findAllComponents(UserAvatarList).at(0);
 
         expect(approvers.exists()).toBe(true);
         expect(approvers.props()).toEqual(
@@ -209,7 +209,7 @@ describe('EE MRWidget approvals list', () => {
       });
 
       it('renders commented by list', () => {
-        const commentedBy = summary.findAll(UserAvatarList).at(1);
+        const commentedBy = summary.findAllComponents(UserAvatarList).at(1);
 
         expect(commentedBy.props()).toEqual(
           expect.objectContaining({
@@ -219,7 +219,7 @@ describe('EE MRWidget approvals list', () => {
       });
 
       it('renders approved by list', () => {
-        const approvedBy = summary.findAll(UserAvatarList).at(2);
+        const approvedBy = summary.findAllComponents(UserAvatarList).at(2);
 
         expect(approvedBy.props()).toEqual(
           expect.objectContaining({
@@ -305,7 +305,7 @@ describe('EE MRWidget approvals list', () => {
 
     it('does not render approvers in summary', () => {
       const summary = findRowElement(row, 'summary');
-      const lists = summary.findAll(UserAvatarList);
+      const lists = summary.findAllComponents(UserAvatarList);
 
       expect(lists).toHaveLength(2);
       expect(lists.at(0).props('items')).toEqual(rule.commented_by);

ee/spec/frontend/vue_mr_widget/components/approvals/approvals_spec.js

@@ -53,7 +53,7 @@ describe('EE MRWidget approvals', () => {
     });
   };
 
-  const findAction = () => wrapper.find(GlButton);
+  const findAction = () => wrapper.findComponent(GlButton);
   const findActionData = () => {
     const action = findAction();
 
@@ -65,9 +65,9 @@ describe('EE MRWidget approvals', () => {
           text: action.text(),
         };
   };
-  const findSummary = () => wrapper.find(ApprovalsSummary);
-  const findOptionalSummary = () => wrapper.find(ApprovalsSummaryOptional);
-  const findFooter = () => wrapper.find(ApprovalsFooter);
+  const findSummary = () => wrapper.findComponent(ApprovalsSummary);
+  const findOptionalSummary = () => wrapper.findComponent(ApprovalsSummaryOptional);
+  const findFooter = () => wrapper.findComponent(ApprovalsFooter);
 
   beforeEach(() => {
     service = {
@@ -108,7 +108,7 @@ describe('EE MRWidget approvals', () => {
     });
 
     it('shows loading message', () => {
-      wrapper.find(ApprovalsFoss).setData({ fetchingApprovals: true });
+      wrapper.findComponent(ApprovalsFoss).setData({ fetchingApprovals: true });
 
       return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.text()).toContain(FETCH_LOADING);
@@ -323,7 +323,7 @@ describe('EE MRWidget approvals', () => {
           });
 
           describe('when emits approve', () => {
-            const findApprovalsAuth = () => wrapper.find(ApprovalsAuth);
+            const findApprovalsAuth = () => wrapper.findComponent(ApprovalsAuth);
 
             beforeEach(() => {
               jest.spyOn(service, 'approveMergeRequestWithAuth').mockRejectedValue();
@@ -339,7 +339,7 @@ describe('EE MRWidget approvals', () => {
             });
 
             it('sets isApproving', () => {
-              wrapper.find(ApprovalsFoss).setData({ isApproving: true });
+              wrapper.findComponent(ApprovalsFoss).setData({ isApproving: true });
 
               return wrapper.vm.$nextTick().then(() => {
                 expect(findApprovalsAuth().props('isApproving')).toBe(true);
@@ -347,7 +347,7 @@ describe('EE MRWidget approvals', () => {
             });
 
             it('sets hasError when auth fails', () => {
-              wrapper.find(ApprovalsFoss).setData({ hasApprovalAuthError: true });
+              wrapper.findComponent(ApprovalsFoss).setData({ hasApprovalAuthError: true });
 
               return wrapper.vm.$nextTick().then(() => {
                 expect(findApprovalsAuth().props('hasError')).toBe(true);

ee/spec/frontend/vue_mr_widget/components/approvals/approved_icon_spec.js

@@ -13,7 +13,7 @@ describe('EE MRWidget approved icon', () => {
     });
   };
 
-  const findIcon = () => wrapper.find(GlIcon);
+  const findIcon = () => wrapper.findComponent(GlIcon);
   const findSquare = () => wrapper.find('.square');
 
   afterEach(() => {

ee/spec/frontend/vue_mr_widget/components/blocking_merge_requests/blocking_merge_requests_body_spec.js

@@ -25,6 +25,6 @@ describe('BlockingMergeRequestBody', () => {
     });
 
     expect(wrapper.html()).not.toContain("merge requests that you don't have access to");
-    expect(wrapper.find(RelatedIssuableItem).exists()).toBe(true);
+    expect(wrapper.findComponent(RelatedIssuableItem).exists()).toBe(true);
   });
 });

ee/spec/frontend/vue_mr_widget/components/blocking_merge_requests/blocking_merge_requests_report_spec.js

@@ -53,7 +53,7 @@ describe('BlockingMergeRequestsReport', () => {
 
   it('passes merged MRs as resolved issues and anything else as unresolved ', () => {
     createComponent();
-    const reportSectionProps = wrapper.find(ReportSection).props();
+    const reportSectionProps = wrapper.findComponent(ReportSection).props();
 
     expect(reportSectionProps.resolvedIssues).toHaveLength(1);
     expect(reportSectionProps.resolvedIssues[0].id).toBe(3);
@@ -61,7 +61,7 @@ describe('BlockingMergeRequestsReport', () => {
 
   it('passes all non "merged" MRs as unresolved issues', () => {
     createComponent();
-    const reportSectionProps = wrapper.find(ReportSection).props();
+    const reportSectionProps = wrapper.findComponent(ReportSection).props();
 
     expect(reportSectionProps.unresolvedIssues.map((issue) => issue.id)).toEqual([2, 1]);
   });
@@ -69,7 +69,7 @@ describe('BlockingMergeRequestsReport', () => {
   it('sets status to "ERROR" when there are unmerged blocking MRs', () => {
     createComponent();
 
-    expect(wrapper.find(ReportSection).props().status).toBe(reportStatus.ERROR);
+    expect(wrapper.findComponent(ReportSection).props().status).toBe(reportStatus.ERROR);
   });
 
   it('sets status to "SUCCESS" when all blocking MRs are merged', () => {
@@ -79,7 +79,7 @@ describe('BlockingMergeRequestsReport', () => {
     };
     createComponent();
 
-    expect(wrapper.find(ReportSection).props().status).toBe(reportStatus.SUCCESS);
+    expect(wrapper.findComponent(ReportSection).props().status).toBe(reportStatus.SUCCESS);
   });
 
   describe('blockedByText', () => {

ee/spec/frontend/vue_mr_widget/components/merge_train_failed_pipeline_confirmation_dialog_spec.js

@@ -29,9 +29,9 @@ describe('MergeTrainFailedPipelineConfirmationDialog', () => {
     });
   };
 
-  const findModal = () => wrapper.find(GlModal);
+  const findModal = () => wrapper.findComponent(GlModal);
   const findStartMergeTrainBtn = () => wrapper.find('[data-testid="start-merge-train"]');
-  const findCancelBtn = () => wrapper.find({ ref: 'cancelButton' });
+  const findCancelBtn = () => wrapper.findComponent({ ref: 'cancelButton' });
 
   beforeEach(() => {
     createComponent();

ee/spec/frontend/vue_mr_widget/components/mr_widget_pipeline_container_spec.js

@@ -40,7 +40,7 @@ describe('MrWidgetPipelineContainer', () => {
         autoMergeStrategy: MT_MERGE_STRATEGY,
       });
 
-      expect(wrapper.find(MergeTrainPositionIndicator).exists()).toBe(false);
+      expect(wrapper.findComponent(MergeTrainPositionIndicator).exists()).toBe(false);
     });
 
     it('should not render the merge train indicator if the MR is closed', () => {
@@ -49,7 +49,7 @@ describe('MrWidgetPipelineContainer', () => {
         autoMergeStrategy: MT_MERGE_STRATEGY,
       });
 
-      expect(wrapper.find(MergeTrainPositionIndicator).exists()).toBe(false);
+      expect(wrapper.findComponent(MergeTrainPositionIndicator).exists()).toBe(false);
     });
 
     it('should not render the merge train indicator if the MR is not on the merge train', () => {
@@ -58,7 +58,7 @@ describe('MrWidgetPipelineContainer', () => {
         autoMergeStrategy: MWPS_MERGE_STRATEGY,
       });
 
-      expect(wrapper.find(MergeTrainPositionIndicator).exists()).toBe(false);
+      expect(wrapper.findComponent(MergeTrainPositionIndicator).exists()).toBe(false);
     });
   });
 });

ee/spec/frontend/vue_mr_widget/components/states/mr_widget_jira_association_missing_spec.js

@@ -5,7 +5,7 @@ import StatusIcon from '~/vue_merge_request_widget/components/mr_widget_status_i
 describe('MrWidgetJiraAssociationMissing', () => {
   let wrapper;
 
-  const findStatusIcon = () => wrapper.find(StatusIcon);
+  const findStatusIcon = () => wrapper.findComponent(StatusIcon);
 
   const createComponent = () => {
     wrapper = shallowMount(MrWidgetJiraAssociationMissing);

ee/spec/frontend/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js

@@ -78,13 +78,13 @@ describe('ReadyToMerge', () => {
     ({ vm } = wrapper);
   };
 
-  const findResolveItemsMessage = () => wrapper.find(GlSprintf);
+  const findResolveItemsMessage = () => wrapper.findComponent(GlSprintf);
   const findPipelineConflictMessage = () =>
     wrapper.find('[data-testid="pipeline-succeed-conflict"]');
   const findMergeButton = () => wrapper.find('[data-testid="merge-button"]');
   const findMergeButtonDropdown = () => wrapper.find('.js-merge-moment');
   const findMergeImmediatelyButton = () => wrapper.find('.js-merge-immediately-button');
-  const findMergeTrainHelperIcon = () => wrapper.find(MergeTrainHelperIcon);
+  const findMergeTrainHelperIcon = () => wrapper.findComponent(MergeTrainHelperIcon);
   const findFailedPipelineMergeTrainText = () =>
     wrapper.find('[data-testid="failed-pipeline-merge-train-text"]');
   const findMergeTrainFailedPipelineConfirmationDialog = () =>
@@ -298,7 +298,7 @@ describe('ReadyToMerge', () => {
     let dialog;
 
     const clickMergeImmediately = () => {
-      dialog = wrapper.find(MergeImmediatelyConfirmationDialog);
+      dialog = wrapper.findComponent(MergeImmediatelyConfirmationDialog);
 
       expect(dialog.exists()).toBe(true);
       dialog.vm.show = jest.fn();

ee/spec/frontend/vue_mr_widget/ee_mr_widget_options_spec.js

@@ -386,7 +386,7 @@ describe('ee merge request widget options', () => {
 
         it('should render performance issue body component', (done) => {
           setImmediate(() => {
-            expect(wrapper.find(PerformanceIssueBody).exists()).toBe(true);
+            expect(wrapper.findComponent(PerformanceIssueBody).exists()).toBe(true);
             done();
           });
         });
@@ -533,7 +533,7 @@ describe('ee merge request widget options', () => {
         });
 
         it('should render performance issue body component', () => {
-          expect(wrapper.find(PerformanceIssueBody).exists()).toBe(true);
+          expect(wrapper.findComponent(PerformanceIssueBody).exists()).toBe(true);
         });
 
         describe('text connector', () => {

ee/spec/frontend/vue_mr_widget/mr_widget_pipeline_spec.js

@@ -8,7 +8,7 @@ describe('MRWidgetPipeline', () => {
   let wrapper;
 
   const findPipelineInfoContainer = () => wrapper.find('[data-testid="pipeline-info-container"');
-  const findPipelinesMiniList = () => wrapper.find(LinkedPipelinesMiniList);
+  const findPipelinesMiniList = () => wrapper.findComponent(LinkedPipelinesMiniList);
 
   const createWrapper = (props) => {
     wrapper = shallowMount(MrWidgetPipeline, {