Merge branch 'jdb/replace-find-merge_request_table_spec' into 'master'

Replace find with findComponent and findAll with findAllComponents

See merge request gitlab-org/gitlab!64139

ee/spec/frontend/analytics/code_review_analytics/components/merge_request_table_spec.js

@@ -40,7 +40,7 @@ describe('MergeRequestTable component', () => {
     wrapper.destroy();
   });
 
-  const findTable = () => wrapper.find(GlTable);
+  const findTable = () => wrapper.findComponent(GlTable);
   const findTableRow = (index) => findTable().findAll('tbody tr').at(index);
   const findReviewTimeCol = (rowIndex) => findTableRow(rowIndex).findAll('td').at(1);
 

ee/spec/frontend/analytics/cycle_analytics/components/create_value_stream_form/custom_stage_fields_spec.js

@@ -56,8 +56,8 @@ describe('CustomStageFields', () => {
 
   let wrapper = null;
 
-  const getDropdown = (dropdownEl) => dropdownEl.find(GlDropdown);
-  const getLabelSelect = (dropdownEl) => dropdownEl.find(LabelsSelector);
+  const getDropdown = (dropdownEl) => dropdownEl.findComponent(GlDropdown);
+  const getLabelSelect = (dropdownEl) => dropdownEl.findComponent(LabelsSelector);
 
   const findName = (index = 0) => wrapper.findByTestId(`custom-stage-name-${index}`);
   const findStartEvent = (index = 0) => wrapper.findByTestId(`custom-stage-start-event-${index}`);
@@ -66,12 +66,12 @@ describe('CustomStageFields', () => {
     wrapper.findByTestId(`custom-stage-start-event-label-${index}`);
   const findEndEventLabel = (index = 0) =>
     wrapper.findByTestId(`custom-stage-end-event-label-${index}`);
-  const findNameField = () => findName().find(GlFormInput);
+  const findNameField = () => findName().findComponent(GlFormInput);
   const findStartEventField = () => getDropdown(findStartEvent());
   const findEndEventField = () => getDropdown(findEndEvent());
   const findStartEventLabelField = () => getLabelSelect(findStartEventLabel());
   const findEndEventLabelField = () => getLabelSelect(findEndEventLabel());
-  const findStageFieldActions = () => wrapper.find(StageFieldActions);
+  const findStageFieldActions = () => wrapper.findComponent(StageFieldActions);
 
   beforeEach(() => {
     wrapper = createComponent();

ee/spec/frontend/analytics/cycle_analytics/components/create_value_stream_form/default_stage_fields_spec.js

-import { GlFormGroup, GlFormInput, GlFormText } from '@gitlab/ui';
+import { GlFormGroup, GlFormInput } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import DefaultStageFields from 'ee/analytics/cycle_analytics/components/create_value_stream_form/default_stage_fields.vue';
 import StageFieldActions from 'ee/analytics/cycle_analytics/components/create_value_stream_form/stage_field_actions.vue';
@@ -37,13 +37,11 @@ describe('DefaultStageFields', () => {
   }
 
   const findStageFieldName = () => wrapper.find('[name="create-value-stream-stage-0"]');
-  const findStageFieldNameInput = () => findStageFieldName().find(GlFormInput);
+  const findStageFieldNameInput = () => findStageFieldName().findComponent(GlFormInput);
   const findStartEvent = () => wrapper.find('[data-testid="stage-start-event-0"]');
-  const findStartEventInput = () => findStartEvent().find(GlFormText);
   const findEndEvent = () => wrapper.find('[data-testid="stage-end-event-0"]');
-  const findEndEventInput = () => findEndEvent().find(GlFormText);
-  const findFormGroup = () => wrapper.find(GlFormGroup);
-  const findFieldActions = () => wrapper.find(StageFieldActions);
+  const findFormGroup = () => wrapper.findComponent(GlFormGroup);
+  const findFieldActions = () => wrapper.findComponent(StageFieldActions);
 
   beforeEach(() => {
     wrapper = createComponent();
@@ -64,12 +62,11 @@ describe('DefaultStageFields', () => {
   });
 
   it('renders the field start event', () => {
-    expect(findStartEventInput().exists()).toBe(true);
-    expect(findStartEventInput().text()).toBe(ISSUE_CREATED.name);
+    expect(findStartEvent().text()).toContain(ISSUE_CREATED.name);
   });
 
   it('renders the field end event', () => {
-    expect(findEndEventInput().text()).toBe(ISSUE_CLOSED.name);
+    expect(findEndEvent().text()).toContain(ISSUE_CLOSED.name);
   });
 
   it('does not emits any input', () => {

ee/spec/frontend/analytics/cycle_analytics/components/duration_chart_spec.js

@@ -60,12 +60,12 @@ describe('DurationChart', () => {
   let wrapper;
 
   const findContainer = (_wrapper) => _wrapper.find('[data-testid="vsa-duration-chart"]');
-  const findScatterPlot = (_wrapper) => _wrapper.find(Scatterplot);
-  const findStageDropdown = (_wrapper) => _wrapper.find(StageDropdownFilter);
-  const findLoader = (_wrapper) => _wrapper.find(ChartSkeletonLoader);
+  const findScatterPlot = (_wrapper) => _wrapper.findComponent(Scatterplot);
+  const findStageDropdown = (_wrapper) => _wrapper.findComponent(StageDropdownFilter);
+  const findLoader = (_wrapper) => _wrapper.findComponent(ChartSkeletonLoader);
 
   const selectStage = (_wrapper, index = 0) => {
-    findStageDropdown(_wrapper).findAll(GlDropdownItem).at(index).vm.$emit('click');
+    findStageDropdown(_wrapper).findAllComponents(GlDropdownItem).at(index).vm.$emit('click');
   };
 
   beforeEach(() => {

ee/spec/frontend/analytics/cycle_analytics/components/filter_bar_spec.js

@@ -100,7 +100,7 @@ describe('Filter bar', () => {
   const selectedMilestone = [filterMilestones[0]];
   const selectedLabelList = [filterLabels[0]];
 
-  const findFilteredSearch = () => wrapper.find(FilteredSearchBar);
+  const findFilteredSearch = () => wrapper.findComponent(FilteredSearchBar);
   const getSearchToken = (type) =>
     findFilteredSearch()
       .props('tokens')

ee/spec/frontend/analytics/cycle_analytics/components/labels_selector_spec.js

@@ -71,7 +71,7 @@ describe('Value Stream Analytics LabelsSelector', () => {
     });
 
     it('will render with the default option selected', () => {
-      const sectionHeader = wrapper.find(GlDropdownSectionHeader);
+      const sectionHeader = wrapper.findComponent(GlDropdownSectionHeader);
 
       expect(sectionHeader.exists()).toBe(true);
       expect(sectionHeader.text()).toEqual('Select a label');

ee/spec/frontend/analytics/cycle_analytics/components/stage_dropdown_filter_spec.js

@@ -37,9 +37,9 @@ describe('StageDropdownFilter component', () => {
     createComponent();
   });
 
-  const findDropdown = () => wrapper.find(GlDropdown);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
   const selectDropdownItemAtIndex = (index) =>
-    findDropdown().findAll(GlDropdownItem).at(index).vm.$emit('click');
+    findDropdown().findAllComponents(GlDropdownItem).at(index).vm.$emit('click');
 
   describe('on stage click', () => {
     describe('clicking a selected stage', () => {

ee/spec/frontend/analytics/cycle_analytics/components/stage_table_spec.js

@@ -247,7 +247,7 @@ describe('StageTable', () => {
     });
 
     it('will display the loading icon', () => {
-      expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
+      expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true);
     });
 
     it('will not display pagination', () => {
@@ -261,7 +261,7 @@ describe('StageTable', () => {
     });
 
     it('will render the empty state', () => {
-      expect(wrapper.find(GlEmptyState).exists()).toBe(true);
+      expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
     });
 
     it('will display the default no data message', () => {

ee/spec/frontend/analytics/cycle_analytics/components/tasks_by_type/tasks_by_type_filters_spec.js

@@ -18,9 +18,10 @@ import { groupLabels } from '../../mock_data';
 
 const selectedLabelIds = [groupLabels[0].id];
 
-const findSubjectFilters = (ctx) => ctx.find(GlSegmentedControl);
+const findSubjectFilters = (ctx) => ctx.findComponent(GlSegmentedControl);
 const findSelectedSubjectFilters = (ctx) => findSubjectFilters(ctx).attributes('checked');
-const findDropdownLabels = (ctx) => ctx.find(LabelsSelector).findAll(GlDropdownItem);
+const findDropdownLabels = (ctx) =>
+  ctx.findComponent(LabelsSelector).findAllComponents(GlDropdownItem);
 
 const selectLabelAtIndex = (ctx, index) => {
   findDropdownLabels(ctx).at(index).trigger('click');
@@ -117,7 +118,7 @@ describe('TasksByTypeFilters', () => {
     it('emits the `update-filter` event when a label is selected', () => {
       expect(wrapper.emitted('update-filter')).toBeUndefined();
 
-      wrapper.find(LabelsSelector).vm.$emit('select-label', groupLabels[0].id);
+      wrapper.findComponent(LabelsSelector).vm.$emit('select-label', groupLabels[0].id);
 
       expect(wrapper.emitted('update-filter')).toBeDefined();
       expect(wrapper.emitted('update-filter')[0]).toEqual([
@@ -161,7 +162,7 @@ describe('TasksByTypeFilters', () => {
         });
 
         return waitForPromises().then(() => {
-          wrapper.find(LabelsSelector).vm.$emit('select-label', groupLabels[2].id);
+          wrapper.findComponent(LabelsSelector).vm.$emit('select-label', groupLabels[2].id);
         });
       });
 

ee/spec/frontend/analytics/cycle_analytics/components/type_of_work_charts_spec.js

@@ -51,9 +51,9 @@ describe('TypeOfWorkCharts', () => {
 
   let wrapper = null;
 
-  const findSubjectFilters = (_wrapper) => _wrapper.find(TasksByTypeFilters);
-  const findTasksByTypeChart = (_wrapper) => _wrapper.find(TasksByTypeChart);
-  const findLoader = (_wrapper) => _wrapper.find(ChartSkeletonLoader);
+  const findSubjectFilters = (_wrapper) => _wrapper.findComponent(TasksByTypeFilters);
+  const findTasksByTypeChart = (_wrapper) => _wrapper.findComponent(TasksByTypeChart);
+  const findLoader = (_wrapper) => _wrapper.findComponent(ChartSkeletonLoader);
   const selectedFilterText =
     "Type of work Showing data for group 'Gitlab Org' from Dec 11, 2019 to Jan 10, 2020";
 

ee/spec/frontend/analytics/cycle_analytics/components/value_stream_form_spec.js

@@ -273,7 +273,10 @@ describe('ValueStreamForm', () => {
         it('validates existing fields when clicked', async () => {
           expect(wrapper.vm.nameError).toEqual([]);
 
-          wrapper.findByTestId('create-value-stream-name').find(GlFormInput).vm.$emit('input', '');
+          wrapper
+            .findByTestId('create-value-stream-name')
+            .findComponent(GlFormInput)
+            .vm.$emit('input', '');
           await clickAddStage();
 
           expect(wrapper.vm.nameError).toEqual(['Name is required']);

ee/spec/frontend/analytics/cycle_analytics/helpers.js

@@ -19,7 +19,7 @@ export function renderTotalTime(selector, element, totalTime = {}) {
 export const shouldFlashAMessage = (msg = '') =>
   expect(document.querySelector('.flash-container .flash-text').innerText.trim()).toBe(msg);
 
-export const findDropdownItems = (wrapper) => wrapper.findAll(GlDropdownItem);
+export const findDropdownItems = (wrapper) => wrapper.findAllComponents(GlDropdownItem);
 
 export const findDropdownItemText = (wrapper) =>
   findDropdownItems(wrapper).wrappers.map((w) => w.text());