From 3f20d85117cfffab9fdeefb971f4f2db6fbdfe4e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Eduardo=20Sanz=20Garc=C3=ADa?= <esanz-garcia@gitlab.com>
Date: Sat, 10 Sep 2022 09:24:43 +0200
Subject: [PATCH] Refactor `Wrapper#find` for `Wrapper#findComponent`
Part 3
Automatic conversion of Vue Test Util `Wrapper#find` for
`Wrapper#findComponent` when applied to a Vue component.
From the Vue Test Util page:
https://v1.test-utils.vuejs.org/api/wrapper/#find
```
Deprecation warning
Using find to search for a Component is deprecated and will be removed.
Use findComponent instead. The find method will continue to work for
finding elements using any valid selector.
```
---
.../components/import_history_app_spec.js | 10 +++----
.../forks/new/components/fork_form_spec.js | 2 +-
.../projects/graphs/code_coverage_spec.js | 6 ++--
.../pipeline_schedule_callout_spec.js | 2 +-
.../components/settings_panel_spec.js | 30 +++++++++++--------
.../shared/wikis/components/wiki_form_spec.js | 2 +-
.../components/detailed_metric_spec.js | 2 +-
.../components/lint/ci_lint_results_spec.js | 4 +--
.../components/lint/ci_lint_warnings_spec.js | 4 +--
.../pipeline_editor_home_spec.js | 2 +-
.../legacy_pipeline_new_form_spec.js | 6 ++--
.../components/pipeline_new_form_spec.js | 6 ++--
.../components/refs_dropdown_spec.js | 2 +-
.../components/input_wrapper_spec.js | 2 +-
.../components/dag/dag_annotations_spec.js | 2 +-
.../pipelines/components/dag/dag_spec.js | 8 ++---
.../pipelines_filtered_search_spec.js | 2 +-
.../pipelines/graph/action_component_spec.js | 2 +-
.../pipelines/graph/graph_component_spec.js | 4 +--
.../graph/graph_component_wrapper_spec.js | 8 ++---
.../graph/graph_view_selector_spec.js | 2 +-
.../graph/job_name_component_spec.js | 2 +-
.../pipelines/graph/linked_pipeline_spec.js | 10 +++----
.../graph/linked_pipelines_column_spec.js | 2 +-
.../graph/stage_column_component_spec.js | 4 +--
.../graph_shared/links_layer_spec.js | 2 +-
.../pipelines/header_component_spec.js | 6 ++--
.../pipelines/pipelines_actions_spec.js | 2 +-
.../pipelines/pipelines_artifacts_spec.js | 4 +--
spec/frontend/pipelines/pipelines_spec.js | 6 ++--
.../test_reports/test_suite_table_spec.js | 8 ++---
.../test_reports/test_summary_table_spec.js | 2 +-
spec/frontend/pipelines/time_ago_spec.js | 4 +--
.../tokens/pipeline_branch_name_token_spec.js | 4 +--
.../tokens/pipeline_source_token_spec.js | 2 +-
.../tokens/pipeline_status_token_spec.js | 2 +-
.../tokens/pipeline_tag_name_token_spec.js | 4 +--
.../pipeline_trigger_author_token_spec.js | 4 +--
.../popovers/components/popovers_spec.js | 6 ++--
.../components/delete_account_modal_spec.js | 2 +-
.../components/update_username_spec.js | 2 +-
.../components/integration_view_spec.js | 2 +-
.../commit/components/form_modal_spec.js | 8 +++--
.../commits/components/author_select_spec.js | 8 ++---
.../projects/compare/components/app_spec.js | 2 +-
.../compare/components/repo_dropdown_spec.js | 2 +-
.../revision_dropdown_legacy_spec.js | 2 +-
.../components/revision_dropdown_spec.js | 4 +--
.../components/project_delete_button_spec.js | 2 +-
.../components/shared/delete_button_spec.js | 2 +-
.../projects/details/upload_button_spec.js | 6 ++--
.../pipelines/charts/components/app_spec.js | 15 +++++-----
.../components/ci_cd_analytics_charts_spec.js | 4 +--
.../charts/components/pipeline_charts_spec.js | 8 ++---
.../components/shared_runners_toggle_spec.js | 6 ++--
.../components/service_desk_root_spec.js | 12 ++++----
.../components/service_desk_setting_spec.js | 10 +++----
.../service_desk_template_dropdown_spec.js | 2 +-
.../ref/components/ref_selector_spec.js | 11 +++----
.../components/related_issuable_input_spec.js | 8 ++---
.../releases/components/app_edit_new_spec.js | 4 +--
.../releases/components/app_show_spec.js | 4 +--
.../components/asset_links_form_spec.js | 14 ++++-----
.../components/evidence_block_spec.js | 14 ++++-----
.../components/issuable_stats_spec.js | 8 +++--
.../components/release_block_assets_spec.js | 2 +-
.../components/release_block_footer_spec.js | 12 ++++----
.../components/release_block_header_spec.js | 2 +-
.../release_block_milestone_info_spec.js | 6 ++--
.../releases/components/release_block_spec.js | 6 ++--
.../release_skeleton_loader_spec.js | 2 +-
.../components/tag_field_exsting_spec.js | 2 +-
.../releases/components/tag_field_new_spec.js | 6 ++--
.../releases/components/tag_field_spec.js | 4 +--
.../accessibility_issue_body_spec.js | 8 ++---
.../grouped_accessibility_reports_app_spec.js | 2 +-
.../components/codequality_issue_body_spec.js | 2 +-
.../grouped_codequality_reports_app_spec.js | 2 +-
.../components/grouped_issues_list_spec.js | 6 ++--
.../reports/components/report_item_spec.js | 4 +--
.../components/modal_spec.js | 4 ++-
.../repository/components/breadcrumbs_spec.js | 10 +++----
.../components/preview/index_spec.js | 2 +-
83 files changed, 219 insertions(+), 207 deletions(-)
diff --git a/spec/frontend/pages/import/history/components/import_history_app_spec.js b/spec/frontend/pages/import/history/components/import_history_app_spec.js
index 0d821b114cfe..5030adae2fa9 100644
--- a/spec/frontend/pages/import/history/components/import_history_app_spec.js
+++ b/spec/frontend/pages/import/history/components/import_history_app_spec.js
@@ -79,7 +79,7 @@ describe('ImportHistoryApp', () => {
describe('general behavior', () => {
it('renders loading state when loading', () => {
createComponent();
- expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
+ expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true);
});
it('renders empty state when no data is available', async () => {
@@ -87,8 +87,8 @@ describe('ImportHistoryApp', () => {
createComponent();
await axios.waitForAll();
- expect(wrapper.find(GlLoadingIcon).exists()).toBe(false);
- expect(wrapper.find(GlEmptyState).exists()).toBe(true);
+ expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false);
+ expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
});
it('renders table with data when history is available', async () => {
@@ -96,7 +96,7 @@ describe('ImportHistoryApp', () => {
createComponent();
await axios.waitForAll();
- const table = wrapper.find(GlTable);
+ const table = wrapper.findComponent(GlTable);
expect(table.exists()).toBe(true);
expect(table.props().items).toStrictEqual(DUMMY_RESPONSE);
});
@@ -127,7 +127,7 @@ describe('ImportHistoryApp', () => {
expect(mock.history.get.length).toBe(1);
expect(mock.history.get[0].params).toStrictEqual(expect.objectContaining({ page: NEW_PAGE }));
- expect(wrapper.find(GlTable).props().items).toStrictEqual(FAKE_NEXT_PAGE_REPLY);
+ expect(wrapper.findComponent(GlTable).props().items).toStrictEqual(FAKE_NEXT_PAGE_REPLY);
});
});
diff --git a/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js b/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js
index f676f2db08e1..ebb254b49c13 100644
--- a/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js
+++ b/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js
@@ -362,7 +362,7 @@ describe('ForkForm component', () => {
const submitForm = async () => {
fillForm();
await nextTick();
- const form = wrapper.find(GlForm);
+ const form = wrapper.findComponent(GlForm);
await form.trigger('submit');
await nextTick();
diff --git a/spec/frontend/pages/projects/graphs/code_coverage_spec.js b/spec/frontend/pages/projects/graphs/code_coverage_spec.js
index f272891919db..c9c0e406c461 100644
--- a/spec/frontend/pages/projects/graphs/code_coverage_spec.js
+++ b/spec/frontend/pages/projects/graphs/code_coverage_spec.js
@@ -20,8 +20,8 @@ describe('Code Coverage', () => {
const graphRef = 'master';
const graphCsvPath = 'url/';
- const findAlert = () => wrapper.find(GlAlert);
- const findAreaChart = () => wrapper.find(GlAreaChart);
+ const findAlert = () => wrapper.findComponent(GlAlert);
+ const findAreaChart = () => wrapper.findComponent(GlAreaChart);
const findAllDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findFirstDropdownItem = () => findAllDropdownItems().at(0);
const findSecondDropdownItem = () => findAllDropdownItems().at(1);
@@ -142,7 +142,7 @@ describe('Code Coverage', () => {
});
it('renders the dropdown with all custom names as options', () => {
- expect(wrapper.find(GlDropdown).exists()).toBeDefined();
+ expect(wrapper.findComponent(GlDropdown).exists()).toBeDefined();
expect(findAllDropdownItems()).toHaveLength(codeCoverageMockData.length);
expect(findFirstDropdownItem().text()).toBe(codeCoverageMockData[0].group_name);
});
diff --git a/spec/frontend/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js b/spec/frontend/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
index ca7f70f44347..a633332ab65c 100644
--- a/spec/frontend/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
+++ b/spec/frontend/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
@@ -21,7 +21,7 @@ describe('Pipeline Schedule Callout', () => {
};
const findInnerContentOfCallout = () => wrapper.find('[data-testid="innerContent"]');
- const findDismissCalloutBtn = () => wrapper.find(GlButton);
+ const findDismissCalloutBtn = () => wrapper.findComponent(GlButton);
describe(`when ${cookieKey} cookie is set`, () => {
beforeEach(async () => {
diff --git a/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js b/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js
index b65f2c8020d8..e551e2797e52 100644
--- a/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js
+++ b/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js
@@ -81,15 +81,17 @@ describe('Settings Panel', () => {
});
};
- const findLFSSettingsRow = () => wrapper.find({ ref: 'git-lfs-settings' });
+ const findLFSSettingsRow = () => wrapper.findComponent({ ref: 'git-lfs-settings' });
const findLFSSettingsMessage = () => findLFSSettingsRow().find('p');
- const findLFSFeatureToggle = () => findLFSSettingsRow().find(GlToggle);
- const findRepositoryFeatureProjectRow = () => wrapper.find({ ref: 'repository-settings' });
+ const findLFSFeatureToggle = () => findLFSSettingsRow().findComponent(GlToggle);
+ const findRepositoryFeatureProjectRow = () =>
+ wrapper.findComponent({ ref: 'repository-settings' });
const findRepositoryFeatureSetting = () =>
- findRepositoryFeatureProjectRow().find(ProjectFeatureSetting);
- const findProjectVisibilitySettings = () => wrapper.find({ ref: 'project-visibility-settings' });
- const findIssuesSettingsRow = () => wrapper.find({ ref: 'issues-settings' });
- const findAnalyticsRow = () => wrapper.find({ ref: 'analytics-settings' });
+ findRepositoryFeatureProjectRow().findComponent(ProjectFeatureSetting);
+ const findProjectVisibilitySettings = () =>
+ wrapper.findComponent({ ref: 'project-visibility-settings' });
+ const findIssuesSettingsRow = () => wrapper.findComponent({ ref: 'issues-settings' });
+ const findAnalyticsRow = () => wrapper.findComponent({ ref: 'analytics-settings' });
const findProjectVisibilityLevelInput = () => wrapper.find('[name="project[visibility_level]"]');
const findRequestAccessEnabledInput = () =>
wrapper.find('[name="project[request_access_enabled]"]');
@@ -99,31 +101,33 @@ describe('Settings Panel', () => {
wrapper.find('[name="project[project_feature_attributes][forking_access_level]"]');
const findBuildsAccessLevelInput = () =>
wrapper.find('[name="project[project_feature_attributes][builds_access_level]"]');
- const findContainerRegistrySettings = () => wrapper.find({ ref: 'container-registry-settings' });
+ const findContainerRegistrySettings = () =>
+ wrapper.findComponent({ ref: 'container-registry-settings' });
const findContainerRegistryPublicNoteGlSprintfComponent = () =>
findContainerRegistrySettings().findComponent(GlSprintf);
const findContainerRegistryAccessLevelInput = () =>
wrapper.find('[name="project[project_feature_attributes][container_registry_access_level]"]');
- const findPackageSettings = () => wrapper.find({ ref: 'package-settings' });
+ const findPackageSettings = () => wrapper.findComponent({ ref: 'package-settings' });
const findPackageAccessLevel = () =>
wrapper.find('[data-testid="package-registry-access-level"]');
const findPackageAccessLevels = () =>
wrapper.find('[name="project[project_feature_attributes][package_registry_access_level]"]');
const findPackagesEnabledInput = () => wrapper.find('[name="project[packages_enabled]"]');
- const findPagesSettings = () => wrapper.find({ ref: 'pages-settings' });
+ const findPagesSettings = () => wrapper.findComponent({ ref: 'pages-settings' });
const findPagesAccessLevels = () =>
wrapper.find('[name="project[project_feature_attributes][pages_access_level]"]');
- const findEmailSettings = () => wrapper.find({ ref: 'email-settings' });
+ const findEmailSettings = () => wrapper.findComponent({ ref: 'email-settings' });
const findShowDefaultAwardEmojis = () =>
wrapper.find('input[name="project[project_setting_attributes][show_default_award_emojis]"]');
const findWarnAboutPuc = () =>
wrapper.find(
'input[name="project[project_setting_attributes][warn_about_potentially_unwanted_characters]"]',
);
- const findMetricsVisibilitySettings = () => wrapper.find({ ref: 'metrics-visibility-settings' });
+ const findMetricsVisibilitySettings = () =>
+ wrapper.findComponent({ ref: 'metrics-visibility-settings' });
const findMetricsVisibilityInput = () =>
findMetricsVisibilitySettings().findComponent(ProjectFeatureSetting);
- const findOperationsSettings = () => wrapper.find({ ref: 'operations-settings' });
+ const findOperationsSettings = () => wrapper.findComponent({ ref: 'operations-settings' });
const findOperationsVisibilityInput = () =>
findOperationsSettings().findComponent(ProjectFeatureSetting);
const findConfirmDangerButton = () => wrapper.findComponent(ConfirmDanger);
diff --git a/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js b/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js
index 36a926990f29..b37d2f06191f 100644
--- a/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js
+++ b/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js
@@ -39,7 +39,7 @@ describe('WikiForm', () => {
const findMarkdownHelpLink = () => wrapper.findByTestId('wiki-markdown-help-link');
const findContentEditor = () => wrapper.findComponent(ContentEditor);
const findClassicEditor = () => wrapper.findComponent(MarkdownField);
- const findLocalStorageSync = () => wrapper.find(LocalStorageSync);
+ const findLocalStorageSync = () => wrapper.findComponent(LocalStorageSync);
const setFormat = (value) => {
const format = findFormat();
diff --git a/spec/frontend/performance_bar/components/detailed_metric_spec.js b/spec/frontend/performance_bar/components/detailed_metric_spec.js
index 2ae36740dfb6..437d51e02baf 100644
--- a/spec/frontend/performance_bar/components/detailed_metric_spec.js
+++ b/spec/frontend/performance_bar/components/detailed_metric_spec.js
@@ -257,7 +257,7 @@ describe('detailedMetric', () => {
});
it('displays request warnings', () => {
- expect(wrapper.find(RequestWarning).exists()).toBe(true);
+ expect(wrapper.findComponent(RequestWarning).exists()).toBe(true);
});
it('can open and close traces', async () => {
diff --git a/spec/frontend/pipeline_editor/components/lint/ci_lint_results_spec.js b/spec/frontend/pipeline_editor/components/lint/ci_lint_results_spec.js
index 82ac390971d4..7f89eda4dffe 100644
--- a/spec/frontend/pipeline_editor/components/lint/ci_lint_results_spec.js
+++ b/spec/frontend/pipeline_editor/components/lint/ci_lint_results_spec.js
@@ -24,11 +24,11 @@ describe('CI Lint Results', () => {
});
};
- const findTable = () => wrapper.find(GlTableLite);
+ const findTable = () => wrapper.findComponent(GlTableLite);
const findByTestId = (selector) => () => wrapper.find(`[data-testid="ci-lint-${selector}"]`);
const findAllByTestId = (selector) => () =>
wrapper.findAll(`[data-testid="ci-lint-${selector}"]`);
- const findLinkToDoc = () => wrapper.find(GlLink);
+ const findLinkToDoc = () => wrapper.findComponent(GlLink);
const findErrors = findByTestId('errors');
const findWarnings = findByTestId('warnings');
const findStatus = findByTestId('status');
diff --git a/spec/frontend/pipeline_editor/components/lint/ci_lint_warnings_spec.js b/spec/frontend/pipeline_editor/components/lint/ci_lint_warnings_spec.js
index 4b576508ee9d..36052a2e16ad 100644
--- a/spec/frontend/pipeline_editor/components/lint/ci_lint_warnings_spec.js
+++ b/spec/frontend/pipeline_editor/components/lint/ci_lint_warnings_spec.js
@@ -17,9 +17,9 @@ describe('CI lint warnings', () => {
});
};
- const findWarningAlert = () => wrapper.find(GlAlert);
+ const findWarningAlert = () => wrapper.findComponent(GlAlert);
const findWarnings = () => wrapper.findAll('[data-testid="ci-lint-warning"]');
- const findWarningMessage = () => trimText(wrapper.find(GlSprintf).text());
+ const findWarningMessage = () => trimText(wrapper.findComponent(GlSprintf).text());
afterEach(() => {
wrapper.destroy();
diff --git a/spec/frontend/pipeline_editor/pipeline_editor_home_spec.js b/spec/frontend/pipeline_editor/pipeline_editor_home_spec.js
index 0cb7155c8c0c..e317d1ddcc20 100644
--- a/spec/frontend/pipeline_editor/pipeline_editor_home_spec.js
+++ b/spec/frontend/pipeline_editor/pipeline_editor_home_spec.js
@@ -254,7 +254,7 @@ describe('Pipeline editor home wrapper', () => {
expect(findPipelineEditorDrawer().props('isVisible')).toBe(true);
- findPipelineEditorDrawer().find(GlDrawer).vm.$emit('close');
+ findPipelineEditorDrawer().findComponent(GlDrawer).vm.$emit('close');
await nextTick();
expect(findPipelineEditorDrawer().props('isVisible')).toBe(false);
diff --git a/spec/frontend/pipeline_new/components/legacy_pipeline_new_form_spec.js b/spec/frontend/pipeline_new/components/legacy_pipeline_new_form_spec.js
index f2d2575c5fb6..512b152f106d 100644
--- a/spec/frontend/pipeline_new/components/legacy_pipeline_new_form_spec.js
+++ b/spec/frontend/pipeline_new/components/legacy_pipeline_new_form_spec.js
@@ -34,7 +34,7 @@ describe('Pipeline New Form', () => {
let mock;
let dummySubmitEvent;
- const findForm = () => wrapper.find(GlForm);
+ const findForm = () => wrapper.findComponent(GlForm);
const findRefsDropdown = () => wrapper.findComponent(RefsDropdown);
const findSubmitButton = () => wrapper.find('[data-testid="run_pipeline_button"]');
const findVariableRows = () => wrapper.findAll('[data-testid="ci-variable-row"]');
@@ -44,9 +44,9 @@ describe('Pipeline New Form', () => {
const findValueInputs = () => wrapper.findAll('[data-testid="pipeline-form-ci-variable-value"]');
const findErrorAlert = () => wrapper.find('[data-testid="run-pipeline-error-alert"]');
const findWarningAlert = () => wrapper.find('[data-testid="run-pipeline-warning-alert"]');
- const findWarningAlertSummary = () => findWarningAlert().find(GlSprintf);
+ const findWarningAlertSummary = () => findWarningAlert().findComponent(GlSprintf);
const findWarnings = () => wrapper.findAll('[data-testid="run-pipeline-warning"]');
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const findCCAlert = () => wrapper.findComponent(CreditCardValidationRequiredAlert);
const getFormPostParams = () => JSON.parse(mock.history.post[0].data);
diff --git a/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js b/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js
index e6bf253b66dd..5ce29bd6c5dc 100644
--- a/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js
+++ b/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js
@@ -34,7 +34,7 @@ describe('Pipeline New Form', () => {
let mock;
let dummySubmitEvent;
- const findForm = () => wrapper.find(GlForm);
+ const findForm = () => wrapper.findComponent(GlForm);
const findRefsDropdown = () => wrapper.findComponent(RefsDropdown);
const findSubmitButton = () => wrapper.find('[data-testid="run_pipeline_button"]');
const findVariableRows = () => wrapper.findAll('[data-testid="ci-variable-row"]');
@@ -44,9 +44,9 @@ describe('Pipeline New Form', () => {
const findValueInputs = () => wrapper.findAll('[data-testid="pipeline-form-ci-variable-value"]');
const findErrorAlert = () => wrapper.find('[data-testid="run-pipeline-error-alert"]');
const findWarningAlert = () => wrapper.find('[data-testid="run-pipeline-warning-alert"]');
- const findWarningAlertSummary = () => findWarningAlert().find(GlSprintf);
+ const findWarningAlertSummary = () => findWarningAlert().findComponent(GlSprintf);
const findWarnings = () => wrapper.findAll('[data-testid="run-pipeline-warning"]');
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const findCCAlert = () => wrapper.findComponent(CreditCardValidationRequiredAlert);
const getFormPostParams = () => JSON.parse(mock.history.post[0].data);
diff --git a/spec/frontend/pipeline_new/components/refs_dropdown_spec.js b/spec/frontend/pipeline_new/components/refs_dropdown_spec.js
index 826f2826d3c4..01d4bd7786f5 100644
--- a/spec/frontend/pipeline_new/components/refs_dropdown_spec.js
+++ b/spec/frontend/pipeline_new/components/refs_dropdown_spec.js
@@ -19,7 +19,7 @@ describe('Pipeline New Form', () => {
let wrapper;
let mock;
- const findDropdown = () => wrapper.find(GlDropdown);
+ const findDropdown = () => wrapper.findComponent(GlDropdown);
const findRefsDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
diff --git a/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js b/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js
index ea2448b13627..f288264a11eb 100644
--- a/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js
+++ b/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js
@@ -30,7 +30,7 @@ describe('Pipeline Wizard -- Input Wrapper', () => {
beforeEach(() => {
createComponent({});
- inputChild = wrapper.find(TextWidget);
+ inputChild = wrapper.findComponent(TextWidget);
});
afterEach(() => {
diff --git a/spec/frontend/pipelines/components/dag/dag_annotations_spec.js b/spec/frontend/pipelines/components/dag/dag_annotations_spec.js
index 212f8e19a6de..28a08b6da0fc 100644
--- a/spec/frontend/pipelines/components/dag/dag_annotations_spec.js
+++ b/spec/frontend/pipelines/components/dag/dag_annotations_spec.js
@@ -11,7 +11,7 @@ describe('The DAG annotations', () => {
const getAllColorBlocks = () => wrapper.findAll('[data-testid="dag-color-block"]');
const getTextBlock = () => wrapper.find('[data-testid="dag-note-text"]');
const getAllTextBlocks = () => wrapper.findAll('[data-testid="dag-note-text"]');
- const getToggleButton = () => wrapper.find(GlButton);
+ const getToggleButton = () => wrapper.findComponent(GlButton);
const createComponent = (propsData = {}, method = shallowMount) => {
if (wrapper?.destroy) {
diff --git a/spec/frontend/pipelines/components/dag/dag_spec.js b/spec/frontend/pipelines/components/dag/dag_spec.js
index d78df3eb35e3..5cc6537e9643 100644
--- a/spec/frontend/pipelines/components/dag/dag_spec.js
+++ b/spec/frontend/pipelines/components/dag/dag_spec.js
@@ -18,12 +18,12 @@ import {
describe('Pipeline DAG graph wrapper', () => {
let wrapper;
- const getAlert = () => wrapper.find(GlAlert);
+ const getAlert = () => wrapper.findComponent(GlAlert);
const getAllAlerts = () => wrapper.findAll(GlAlert);
- const getGraph = () => wrapper.find(DagGraph);
- const getNotes = () => wrapper.find(DagAnnotations);
+ const getGraph = () => wrapper.findComponent(DagGraph);
+ const getNotes = () => wrapper.findComponent(DagAnnotations);
const getErrorText = (type) => wrapper.vm.$options.errorTexts[type];
- const getEmptyState = () => wrapper.find(GlEmptyState);
+ const getEmptyState = () => wrapper.findComponent(GlEmptyState);
const createComponent = ({
graphData = mockParsedGraphQLNodes,
diff --git a/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js b/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js
index f958f12acd47..868070ab3c49 100644
--- a/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js
+++ b/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js
@@ -12,7 +12,7 @@ describe('Pipelines filtered search', () => {
let wrapper;
let mock;
- const findFilteredSearch = () => wrapper.find(GlFilteredSearch);
+ const findFilteredSearch = () => wrapper.findComponent(GlFilteredSearch);
const getSearchToken = (type) =>
findFilteredSearch()
.props('availableTokens')
diff --git a/spec/frontend/pipelines/graph/action_component_spec.js b/spec/frontend/pipelines/graph/action_component_spec.js
index 6e5aa572ec0e..a823e0292813 100644
--- a/spec/frontend/pipelines/graph/action_component_spec.js
+++ b/spec/frontend/pipelines/graph/action_component_spec.js
@@ -9,7 +9,7 @@ import ActionComponent from '~/pipelines/components/jobs_shared/action_component
describe('pipeline graph action component', () => {
let wrapper;
let mock;
- const findButton = () => wrapper.find(GlButton);
+ const findButton = () => wrapper.findComponent(GlButton);
const findTooltipWrapper = () => wrapper.find('[data-testid="ci-action-icon-tooltip-wrapper"]');
beforeEach(() => {
diff --git a/spec/frontend/pipelines/graph/graph_component_spec.js b/spec/frontend/pipelines/graph/graph_component_spec.js
index 4b2b61c8edd5..3ab588827862 100644
--- a/spec/frontend/pipelines/graph/graph_component_spec.js
+++ b/spec/frontend/pipelines/graph/graph_component_spec.js
@@ -16,7 +16,7 @@ describe('graph component', () => {
let wrapper;
const findLinkedColumns = () => wrapper.findAll(LinkedPipelinesColumn);
- const findLinksLayer = () => wrapper.find(LinksLayer);
+ const findLinksLayer = () => wrapper.findComponent(LinksLayer);
const findStageColumns = () => wrapper.findAll(StageColumnComponent);
const findStageNameInJob = () => wrapper.find('[data-testid="stage-name-in-job"]');
@@ -107,7 +107,7 @@ describe('graph component', () => {
});
it('dims unrelated jobs', () => {
- const unrelatedJob = wrapper.find(JobItem);
+ const unrelatedJob = wrapper.findComponent(JobItem);
expect(findLinksLayer().emitted().highlightedJobsChange).toHaveLength(1);
expect(unrelatedJob.classes('gl-opacity-3')).toBe(true);
});
diff --git a/spec/frontend/pipelines/graph/graph_component_wrapper_spec.js b/spec/frontend/pipelines/graph/graph_component_wrapper_spec.js
index 454b3814d8c9..a2097dda8603 100644
--- a/spec/frontend/pipelines/graph/graph_component_wrapper_spec.js
+++ b/spec/frontend/pipelines/graph/graph_component_wrapper_spec.js
@@ -51,11 +51,11 @@ describe('Pipeline graph wrapper', () => {
const getDependenciesToggle = () => wrapper.find('[data-testid="show-links-toggle"]');
const getLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const getLinksLayer = () => wrapper.findComponent(LinksLayer);
- const getGraph = () => wrapper.find(PipelineGraph);
+ const getGraph = () => wrapper.findComponent(PipelineGraph);
const getStageColumnTitle = () => wrapper.find('[data-testid="stage-column-title"]');
const getAllStageColumnGroupsInColumn = () =>
- wrapper.find(StageColumnComponent).findAll('[data-testid="stage-column-group"]');
- const getViewSelector = () => wrapper.find(GraphViewSelector);
+ wrapper.findComponent(StageColumnComponent).findAll('[data-testid="stage-column-group"]');
+ const getViewSelector = () => wrapper.findComponent(GraphViewSelector);
const getViewSelectorTrip = () => getViewSelector().findComponent(GlAlert);
const getLocalStorageSync = () => wrapper.findComponent(LocalStorageSync);
@@ -408,7 +408,7 @@ describe('Pipeline graph wrapper', () => {
it('reads the view type from localStorage when available', () => {
const viewSelectorNeedsSegment = wrapper
- .find(GlButtonGroup)
+ .findComponent(GlButtonGroup)
.findAllComponents(GlButton)
.at(1);
expect(viewSelectorNeedsSegment.classes()).toContain('selected');
diff --git a/spec/frontend/pipelines/graph/graph_view_selector_spec.js b/spec/frontend/pipelines/graph/graph_view_selector_spec.js
index 4e79c7e73cca..43587bebedfb 100644
--- a/spec/frontend/pipelines/graph/graph_view_selector_spec.js
+++ b/spec/frontend/pipelines/graph/graph_view_selector_spec.js
@@ -11,7 +11,7 @@ describe('the graph view selector component', () => {
const findStageViewButton = () => findViewTypeSelector().findAllComponents(GlButton).at(0);
const findLayerViewButton = () => findViewTypeSelector().findAllComponents(GlButton).at(1);
const findSwitcherLoader = () => wrapper.find('[data-testid="switcher-loading-state"]');
- const findToggleLoader = () => findDependenciesToggle().find(GlLoadingIcon);
+ const findToggleLoader = () => findDependenciesToggle().findComponent(GlLoadingIcon);
const findHoverTip = () => wrapper.findComponent(GlAlert);
const defaultProps = {
diff --git a/spec/frontend/pipelines/graph/job_name_component_spec.js b/spec/frontend/pipelines/graph/job_name_component_spec.js
index d3008c046e8c..ec432e98fdfd 100644
--- a/spec/frontend/pipelines/graph/job_name_component_spec.js
+++ b/spec/frontend/pipelines/graph/job_name_component_spec.js
@@ -24,7 +24,7 @@ describe('job name component', () => {
});
it('should render an icon with the provided status', () => {
- expect(wrapper.find(ciIcon).exists()).toBe(true);
+ expect(wrapper.findComponent(ciIcon).exists()).toBe(true);
expect(wrapper.find('.ci-status-icon-success').exists()).toBe(true);
});
});
diff --git a/spec/frontend/pipelines/graph/linked_pipeline_spec.js b/spec/frontend/pipelines/graph/linked_pipeline_spec.js
index 7d1e4774a24a..b9244ca05474 100644
--- a/spec/frontend/pipelines/graph/linked_pipeline_spec.js
+++ b/spec/frontend/pipelines/graph/linked_pipeline_spec.js
@@ -36,13 +36,13 @@ describe('Linked pipeline', () => {
type: UPSTREAM,
};
- const findButton = () => wrapper.find(GlButton);
+ const findButton = () => wrapper.findComponent(GlButton);
const findCancelButton = () => wrapper.findByLabelText('Cancel downstream pipeline');
const findCardTooltip = () => wrapper.findComponent(GlTooltip);
const findDownstreamPipelineTitle = () => wrapper.findByTestId('downstream-title');
const findExpandButton = () => wrapper.findByTestId('expand-pipeline-button');
- const findLinkedPipeline = () => wrapper.find({ ref: 'linkedPipeline' });
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLinkedPipeline = () => wrapper.findComponent({ ref: 'linkedPipeline' });
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const findPipelineLabel = () => wrapper.findByTestId('downstream-pipeline-label');
const findPipelineLink = () => wrapper.findByTestId('pipelineLink');
const findRetryButton = () => wrapper.findByLabelText('Retry downstream pipeline');
@@ -80,7 +80,7 @@ describe('Linked pipeline', () => {
});
it('should render an svg within the status container', () => {
- const pipelineStatusElement = wrapper.find(CiStatus);
+ const pipelineStatusElement = wrapper.findComponent(CiStatus);
expect(pipelineStatusElement.find('svg').exists()).toBe(true);
});
@@ -90,7 +90,7 @@ describe('Linked pipeline', () => {
});
it('should have a ci-status child component', () => {
- expect(wrapper.find(CiStatus).exists()).toBe(true);
+ expect(wrapper.findComponent(CiStatus).exists()).toBe(true);
});
it('should render the pipeline id', () => {
diff --git a/spec/frontend/pipelines/graph/linked_pipelines_column_spec.js b/spec/frontend/pipelines/graph/linked_pipelines_column_spec.js
index 460007111105..50fae3ee495c 100644
--- a/spec/frontend/pipelines/graph/linked_pipelines_column_spec.js
+++ b/spec/frontend/pipelines/graph/linked_pipelines_column_spec.js
@@ -39,7 +39,7 @@ describe('Linked Pipelines Column', () => {
let wrapper;
const findLinkedColumnTitle = () => wrapper.find('[data-testid="linked-column-title"]');
const findLinkedPipelineElements = () => wrapper.findAll(LinkedPipeline);
- const findPipelineGraph = () => wrapper.find(PipelineGraph);
+ const findPipelineGraph = () => wrapper.findComponent(PipelineGraph);
const findExpandButton = () => wrapper.find('[data-testid="expand-pipeline-button"]');
Vue.use(VueApollo);
diff --git a/spec/frontend/pipelines/graph/stage_column_component_spec.js b/spec/frontend/pipelines/graph/stage_column_component_spec.js
index b081258edc08..19f597a7267f 100644
--- a/spec/frontend/pipelines/graph/stage_column_component_spec.js
+++ b/spec/frontend/pipelines/graph/stage_column_component_spec.js
@@ -42,8 +42,8 @@ describe('stage column component', () => {
const findStageColumnTitle = () => wrapper.find('[data-testid="stage-column-title"]');
const findStageColumnGroup = () => wrapper.find('[data-testid="stage-column-group"]');
const findAllStageColumnGroups = () => wrapper.findAll('[data-testid="stage-column-group"]');
- const findJobItem = () => wrapper.find(JobItem);
- const findActionComponent = () => wrapper.find(ActionComponent);
+ const findJobItem = () => wrapper.findComponent(JobItem);
+ const findActionComponent = () => wrapper.findComponent(ActionComponent);
const createComponent = ({ method = shallowMount, props = {} } = {}) => {
wrapper = method(StageColumnComponent, {
diff --git a/spec/frontend/pipelines/graph_shared/links_layer_spec.js b/spec/frontend/pipelines/graph_shared/links_layer_spec.js
index 44ab60cbee76..e2699d6ff2ee 100644
--- a/spec/frontend/pipelines/graph_shared/links_layer_spec.js
+++ b/spec/frontend/pipelines/graph_shared/links_layer_spec.js
@@ -6,7 +6,7 @@ import { generateResponse, mockPipelineResponse } from '../graph/mock_data';
describe('links layer component', () => {
let wrapper;
- const findLinksInner = () => wrapper.find(LinksInner);
+ const findLinksInner = () => wrapper.findComponent(LinksInner);
const pipeline = generateResponse(mockPipelineResponse, 'root/fungi-xoxo');
const containerId = `pipeline-links-container-${pipeline.id}`;
diff --git a/spec/frontend/pipelines/header_component_spec.js b/spec/frontend/pipelines/header_component_spec.js
index 859be8d342cc..e583c0798f5f 100644
--- a/spec/frontend/pipelines/header_component_spec.js
+++ b/spec/frontend/pipelines/header_component_spec.js
@@ -21,12 +21,12 @@ describe('Pipeline details header', () => {
let glModalDirective;
let mutate = jest.fn();
- const findAlert = () => wrapper.find(GlAlert);
- const findDeleteModal = () => wrapper.find(GlModal);
+ const findAlert = () => wrapper.findComponent(GlAlert);
+ const findDeleteModal = () => wrapper.findComponent(GlModal);
const findRetryButton = () => wrapper.find('[data-testid="retryPipeline"]');
const findCancelButton = () => wrapper.find('[data-testid="cancelPipeline"]');
const findDeleteButton = () => wrapper.find('[data-testid="deletePipeline"]');
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const defaultProvideOptions = {
pipelineId: '14',
diff --git a/spec/frontend/pipelines/pipelines_actions_spec.js b/spec/frontend/pipelines/pipelines_actions_spec.js
index 9b2ee6b82789..db04b502cfcf 100644
--- a/spec/frontend/pipelines/pipelines_actions_spec.js
+++ b/spec/frontend/pipelines/pipelines_actions_spec.js
@@ -29,7 +29,7 @@ describe('Pipelines Actions dropdown', () => {
});
};
- const findDropdown = () => wrapper.find(GlDropdown);
+ const findDropdown = () => wrapper.findComponent(GlDropdown);
const findAllDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findAllCountdowns = () => wrapper.findAll(GlCountdown);
diff --git a/spec/frontend/pipelines/pipelines_artifacts_spec.js b/spec/frontend/pipelines/pipelines_artifacts_spec.js
index 2d876841e06b..481d98fcba7d 100644
--- a/spec/frontend/pipelines/pipelines_artifacts_spec.js
+++ b/spec/frontend/pipelines/pipelines_artifacts_spec.js
@@ -30,8 +30,8 @@ describe('Pipelines Artifacts dropdown', () => {
};
const findDropdown = () => wrapper.findComponent(GlDropdown);
- const findFirstGlDropdownItem = () => wrapper.find(GlDropdownItem);
- const findAllGlDropdownItems = () => wrapper.find(GlDropdown).findAll(GlDropdownItem);
+ const findFirstGlDropdownItem = () => wrapper.findComponent(GlDropdownItem);
+ const findAllGlDropdownItems = () => wrapper.findComponent(GlDropdown).findAll(GlDropdownItem);
afterEach(() => {
wrapper.destroy();
diff --git a/spec/frontend/pipelines/pipelines_spec.js b/spec/frontend/pipelines/pipelines_spec.js
index 0bed24e588e5..0742c25623ae 100644
--- a/spec/frontend/pipelines/pipelines_spec.js
+++ b/spec/frontend/pipelines/pipelines_spec.js
@@ -123,7 +123,7 @@ describe('Pipelines', () => {
});
it('shows loading state when the app is loading', () => {
- expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
+ expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true);
});
it('does not display tabs when the first request has not yet been made', () => {
@@ -375,7 +375,7 @@ describe('Pipelines', () => {
const [firstPage, secondPage] = chunk(mockPipelinesResponse.pipelines, mockPageSize);
const goToPage = (page) => {
- findTablePagination().find(GlPagination).vm.$emit('input', page);
+ findTablePagination().findComponent(GlPagination).vm.$emit('input', page);
};
beforeEach(async () => {
@@ -583,7 +583,7 @@ describe('Pipelines', () => {
'This project is not currently set up to run pipelines.',
);
- expect(findEmptyState().find(GlButton).exists()).toBe(false);
+ expect(findEmptyState().findComponent(GlButton).exists()).toBe(false);
});
it('does not render tabs or buttons', () => {
diff --git a/spec/frontend/pipelines/test_reports/test_suite_table_spec.js b/spec/frontend/pipelines/test_reports/test_suite_table_spec.js
index c372ac06c35c..da13df833e78 100644
--- a/spec/frontend/pipelines/test_reports/test_suite_table_spec.js
+++ b/spec/frontend/pipelines/test_reports/test_suite_table_spec.js
@@ -26,10 +26,10 @@ describe('Test reports suite table', () => {
const noCasesMessage = () => wrapper.findByTestId('no-test-cases');
const artifactsExpiredMessage = () => wrapper.findByTestId('artifacts-expired');
- const artifactsExpiredEmptyState = () => wrapper.find(GlEmptyState);
+ const artifactsExpiredEmptyState = () => wrapper.findComponent(GlEmptyState);
const allCaseRows = () => wrapper.findAllByTestId('test-case-row');
const findCaseRowAtIndex = (index) => wrapper.findAllByTestId('test-case-row').at(index);
- const findLinkForRow = (row) => row.find(GlLink);
+ const findLinkForRow = (row) => row.findComponent(GlLink);
const findIconForRow = (row, status) => row.find(`.ci-status-icon-${status}`);
const createComponent = ({ suite = testSuite, perPage = 20, errorMessage } = {}) => {
@@ -113,7 +113,7 @@ describe('Test reports suite table', () => {
const filePath = `${blobPath}/${relativeFile}`;
const row = findCaseRowAtIndex(0);
const fileLink = findLinkForRow(row);
- const button = row.find(GlButton);
+ const button = row.findComponent(GlButton);
expect(fileLink.attributes('href')).toBe(filePath);
expect(row.text()).toContain(file);
@@ -134,7 +134,7 @@ describe('Test reports suite table', () => {
});
it('renders a pagination component', () => {
- expect(wrapper.find(GlPagination).exists()).toBe(true);
+ expect(wrapper.findComponent(GlPagination).exists()).toBe(true);
});
});
diff --git a/spec/frontend/pipelines/test_reports/test_summary_table_spec.js b/spec/frontend/pipelines/test_reports/test_summary_table_spec.js
index 0e1229f70673..cfe9ff564dcd 100644
--- a/spec/frontend/pipelines/test_reports/test_summary_table_spec.js
+++ b/spec/frontend/pipelines/test_reports/test_summary_table_spec.js
@@ -44,7 +44,7 @@ describe('Test reports summary table', () => {
describe('when test reports are supplied', () => {
beforeEach(() => createComponent());
- const findErrorIcon = () => wrapper.find({ ref: 'suiteErrorIcon' });
+ const findErrorIcon = () => wrapper.findComponent({ ref: 'suiteErrorIcon' });
it('renders the correct number of rows', () => {
expect(noSuitesToShow().exists()).toBe(false);
diff --git a/spec/frontend/pipelines/time_ago_spec.js b/spec/frontend/pipelines/time_ago_spec.js
index 3de7995b476c..f0da0df2ba6f 100644
--- a/spec/frontend/pipelines/time_ago_spec.js
+++ b/spec/frontend/pipelines/time_ago_spec.js
@@ -48,7 +48,7 @@ describe('Timeago component', () => {
});
it('should render duration and timer svg', () => {
- const icon = duration().find(GlIcon);
+ const icon = duration().findComponent(GlIcon);
expect(duration().exists()).toBe(true);
expect(icon.props('name')).toBe('timer');
@@ -71,7 +71,7 @@ describe('Timeago component', () => {
});
it('should render time and calendar icon', () => {
- const icon = finishedAt().find(GlIcon);
+ const icon = finishedAt().findComponent(GlIcon);
const time = finishedAt().find('time');
expect(finishedAt().exists()).toBe(true);
diff --git a/spec/frontend/pipelines/tokens/pipeline_branch_name_token_spec.js b/spec/frontend/pipelines/tokens/pipeline_branch_name_token_spec.js
index ba478363d042..497d03bff515 100644
--- a/spec/frontend/pipelines/tokens/pipeline_branch_name_token_spec.js
+++ b/spec/frontend/pipelines/tokens/pipeline_branch_name_token_spec.js
@@ -9,9 +9,9 @@ import { branches, mockBranchesAfterMap } from '../mock_data';
describe('Pipeline Branch Name Token', () => {
let wrapper;
- const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken);
+ const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken);
const findAllFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion);
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const getBranchSuggestions = () =>
findAllFilteredSearchSuggestions().wrappers.map((w) => w.text());
diff --git a/spec/frontend/pipelines/tokens/pipeline_source_token_spec.js b/spec/frontend/pipelines/tokens/pipeline_source_token_spec.js
index b8abf2c1727d..7d60a961621b 100644
--- a/spec/frontend/pipelines/tokens/pipeline_source_token_spec.js
+++ b/spec/frontend/pipelines/tokens/pipeline_source_token_spec.js
@@ -7,7 +7,7 @@ import PipelineSourceToken from '~/pipelines/components/pipelines_list/tokens/pi
describe('Pipeline Source Token', () => {
let wrapper;
- const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken);
+ const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken);
const findAllFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion);
const defaultProps = {
diff --git a/spec/frontend/pipelines/tokens/pipeline_status_token_spec.js b/spec/frontend/pipelines/tokens/pipeline_status_token_spec.js
index 2c5fa8b00e2b..1a51d8b251df 100644
--- a/spec/frontend/pipelines/tokens/pipeline_status_token_spec.js
+++ b/spec/frontend/pipelines/tokens/pipeline_status_token_spec.js
@@ -6,7 +6,7 @@ import PipelineStatusToken from '~/pipelines/components/pipelines_list/tokens/pi
describe('Pipeline Status Token', () => {
let wrapper;
- const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken);
+ const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken);
const findAllFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion);
const findAllGlIcons = () => wrapper.findAll(GlIcon);
diff --git a/spec/frontend/pipelines/tokens/pipeline_tag_name_token_spec.js b/spec/frontend/pipelines/tokens/pipeline_tag_name_token_spec.js
index 596a9218c398..8dd79bcfb88d 100644
--- a/spec/frontend/pipelines/tokens/pipeline_tag_name_token_spec.js
+++ b/spec/frontend/pipelines/tokens/pipeline_tag_name_token_spec.js
@@ -7,9 +7,9 @@ import { tags, mockTagsAfterMap } from '../mock_data';
describe('Pipeline Branch Name Token', () => {
let wrapper;
- const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken);
+ const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken);
const findAllFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion);
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const stubs = {
GlFilteredSearchToken: {
diff --git a/spec/frontend/pipelines/tokens/pipeline_trigger_author_token_spec.js b/spec/frontend/pipelines/tokens/pipeline_trigger_author_token_spec.js
index 397dbdf95a9c..39986ca7904b 100644
--- a/spec/frontend/pipelines/tokens/pipeline_trigger_author_token_spec.js
+++ b/spec/frontend/pipelines/tokens/pipeline_trigger_author_token_spec.js
@@ -8,9 +8,9 @@ import { users } from '../mock_data';
describe('Pipeline Trigger Author Token', () => {
let wrapper;
- const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken);
+ const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken);
const findAllFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion);
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
const defaultProps = {
config: {
diff --git a/spec/frontend/popovers/components/popovers_spec.js b/spec/frontend/popovers/components/popovers_spec.js
index 6fdcd34ae835..0d00cb043d55 100644
--- a/spec/frontend/popovers/components/popovers_spec.js
+++ b/spec/frontend/popovers/components/popovers_spec.js
@@ -42,7 +42,7 @@ describe('popovers/components/popovers.vue', () => {
it('attaches popovers to the targets specified', async () => {
const target = createPopoverTarget();
await buildWrapper(target);
- expect(wrapper.find(GlPopover).props('target')).toBe(target);
+ expect(wrapper.findComponent(GlPopover).props('target')).toBe(target);
});
it('does not attach a popover twice to the same element', async () => {
@@ -66,7 +66,7 @@ describe('popovers/components/popovers.vue', () => {
`('$description', async ({ content, render }) => {
await buildWrapper(createPopoverTarget({ content, html: true }));
- const html = wrapper.find(GlPopover).html();
+ const html = wrapper.findComponent(GlPopover).html();
expect(html).toContain(render);
});
});
@@ -78,7 +78,7 @@ describe('popovers/components/popovers.vue', () => {
`('sets $option to $value when data-$option is set in target', async ({ option, value }) => {
await buildWrapper(createPopoverTarget({ [option]: value }));
- expect(wrapper.find(GlPopover).props(option)).toBe(value);
+ expect(wrapper.findComponent(GlPopover).props(option)).toBe(value);
});
});
diff --git a/spec/frontend/profile/account/components/delete_account_modal_spec.js b/spec/frontend/profile/account/components/delete_account_modal_spec.js
index ad62d84c43c5..e4a316e1ee70 100644
--- a/spec/frontend/profile/account/components/delete_account_modal_spec.js
+++ b/spec/frontend/profile/account/components/delete_account_modal_spec.js
@@ -53,7 +53,7 @@ describe('DeleteAccountModal component', () => {
input: vm.$el.querySelector(`[name="${confirmation}"]`),
};
};
- const findModal = () => wrapper.find(GlModalStub);
+ const findModal = () => wrapper.findComponent(GlModalStub);
describe('with password confirmation', () => {
beforeEach(async () => {
diff --git a/spec/frontend/profile/account/components/update_username_spec.js b/spec/frontend/profile/account/components/update_username_spec.js
index 0e56bccf27ef..cdeeea125825 100644
--- a/spec/frontend/profile/account/components/update_username_spec.js
+++ b/spec/frontend/profile/account/components/update_username_spec.js
@@ -44,7 +44,7 @@ describe('UpdateUsername component', () => {
});
const findElements = () => {
- const modal = wrapper.find(GlModal);
+ const modal = wrapper.findComponent(GlModal);
return {
modal,
diff --git a/spec/frontend/profile/preferences/components/integration_view_spec.js b/spec/frontend/profile/preferences/components/integration_view_spec.js
index 92c53b8c91be..f650bee7fdae 100644
--- a/spec/frontend/profile/preferences/components/integration_view_spec.js
+++ b/spec/frontend/profile/preferences/components/integration_view_spec.js
@@ -98,6 +98,6 @@ describe('IntegrationView component', () => {
it('should render the help text', () => {
wrapper = createComponent();
- expect(wrapper.find(IntegrationHelpText).exists()).toBe(true);
+ expect(wrapper.findComponent(IntegrationHelpText).exists()).toBe(true);
});
});
diff --git a/spec/frontend/projects/commit/components/form_modal_spec.js b/spec/frontend/projects/commit/components/form_modal_spec.js
index 79e9dab935d9..20c312ec771c 100644
--- a/spec/frontend/projects/commit/components/form_modal_spec.js
+++ b/spec/frontend/projects/commit/components/form_modal_spec.js
@@ -99,7 +99,9 @@ describe('CommitFormModal', () => {
createComponent(shallowMount, {}, { prependedText: '_prepended_text_' });
expect(findPrependedText().exists()).toBe(true);
- expect(findPrependedText().find(GlSprintf).attributes('message')).toBe('_prepended_text_');
+ expect(findPrependedText().findComponent(GlSprintf).attributes('message')).toBe(
+ '_prepended_text_',
+ );
});
it('Does not show prepended text', () => {
@@ -124,7 +126,7 @@ describe('CommitFormModal', () => {
createComponent(shallowMount, { pushCode: false });
expect(findAppendedText().exists()).toBe(true);
- expect(findAppendedText().find(GlSprintf).attributes('message')).toContain(
+ expect(findAppendedText().findComponent(GlSprintf).attributes('message')).toContain(
mockData.modalPropsData.i18n.branchInFork,
);
});
@@ -133,7 +135,7 @@ describe('CommitFormModal', () => {
createComponent(shallowMount, { pushCode: false, branchCollaboration: true });
expect(findAppendedText().exists()).toBe(true);
- expect(findAppendedText().find(GlSprintf).attributes('message')).toContain(
+ expect(findAppendedText().findComponent(GlSprintf).attributes('message')).toContain(
mockData.modalPropsData.i18n.existingBranch,
);
});
diff --git a/spec/frontend/projects/commits/components/author_select_spec.js b/spec/frontend/projects/commits/components/author_select_spec.js
index 57e5ef0ed1db..287bfe1c14d4 100644
--- a/spec/frontend/projects/commits/components/author_select_spec.js
+++ b/spec/frontend/projects/commits/components/author_select_spec.js
@@ -58,10 +58,10 @@ describe('Author Select', () => {
resetHTMLFixture();
});
- const findDropdownContainer = () => wrapper.find({ ref: 'dropdownContainer' });
- const findDropdown = () => wrapper.find(GlDropdown);
- const findDropdownHeader = () => wrapper.find(GlDropdownSectionHeader);
- const findSearchBox = () => wrapper.find(GlSearchBoxByType);
+ const findDropdownContainer = () => wrapper.findComponent({ ref: 'dropdownContainer' });
+ const findDropdown = () => wrapper.findComponent(GlDropdown);
+ const findDropdownHeader = () => wrapper.findComponent(GlDropdownSectionHeader);
+ const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
const findDropdownItems = () => wrapper.findAll(GlDropdownItem);
describe('user is searching via "filter by commit message"', () => {
diff --git a/spec/frontend/projects/compare/components/app_spec.js b/spec/frontend/projects/compare/components/app_spec.js
index c9ffdf20c329..a24e40b842c5 100644
--- a/spec/frontend/projects/compare/components/app_spec.js
+++ b/spec/frontend/projects/compare/components/app_spec.js
@@ -66,7 +66,7 @@ describe('CompareApp component', () => {
});
describe('compare button', () => {
- const findCompareButton = () => wrapper.find(GlButton);
+ const findCompareButton = () => wrapper.findComponent(GlButton);
it('renders button', () => {
expect(findCompareButton().exists()).toBe(true);
diff --git a/spec/frontend/projects/compare/components/repo_dropdown_spec.js b/spec/frontend/projects/compare/components/repo_dropdown_spec.js
index 98aec347e4ba..8e720b40e6f1 100644
--- a/spec/frontend/projects/compare/components/repo_dropdown_spec.js
+++ b/spec/frontend/projects/compare/components/repo_dropdown_spec.js
@@ -21,7 +21,7 @@ describe('RepoDropdown component', () => {
wrapper = null;
});
- const findGlDropdown = () => wrapper.find(GlDropdown);
+ const findGlDropdown = () => wrapper.findComponent(GlDropdown);
const findHiddenInput = () => wrapper.find('input[type="hidden"]');
describe('Source Revision', () => {
diff --git a/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js b/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
index 102f95f65da7..8d4711a79ed3 100644
--- a/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
+++ b/spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
@@ -38,7 +38,7 @@ describe('RevisionDropdown component', () => {
axiosMock.restore();
});
- const findGlDropdown = () => wrapper.find(GlDropdown);
+ const findGlDropdown = () => wrapper.findComponent(GlDropdown);
it('sets hidden input', () => {
expect(wrapper.find('input[type="hidden"]').attributes('value')).toBe(
diff --git a/spec/frontend/projects/compare/components/revision_dropdown_spec.js b/spec/frontend/projects/compare/components/revision_dropdown_spec.js
index c8a908484922..bd8c0d2784fb 100644
--- a/spec/frontend/projects/compare/components/revision_dropdown_spec.js
+++ b/spec/frontend/projects/compare/components/revision_dropdown_spec.js
@@ -35,8 +35,8 @@ describe('RevisionDropdown component', () => {
axiosMock.restore();
});
- const findGlDropdown = () => wrapper.find(GlDropdown);
- const findSearchBox = () => wrapper.find(GlSearchBoxByType);
+ const findGlDropdown = () => wrapper.findComponent(GlDropdown);
+ const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
it('sets hidden input', () => {
createComponent();
diff --git a/spec/frontend/projects/components/project_delete_button_spec.js b/spec/frontend/projects/components/project_delete_button_spec.js
index a3bc4931eb3d..49e3218e5bce 100644
--- a/spec/frontend/projects/components/project_delete_button_spec.js
+++ b/spec/frontend/projects/components/project_delete_button_spec.js
@@ -8,7 +8,7 @@ jest.mock('lodash/uniqueId', () => () => 'fakeUniqueId');
describe('Project remove modal', () => {
let wrapper;
- const findSharedDeleteButton = () => wrapper.find(SharedDeleteButton);
+ const findSharedDeleteButton = () => wrapper.findComponent(SharedDeleteButton);
const defaultProps = {
confirmPhrase: 'foo',
diff --git a/spec/frontend/projects/components/shared/delete_button_spec.js b/spec/frontend/projects/components/shared/delete_button_spec.js
index 45c39ee91d88..097b18025a3c 100644
--- a/spec/frontend/projects/components/shared/delete_button_spec.js
+++ b/spec/frontend/projects/components/shared/delete_button_spec.js
@@ -11,7 +11,7 @@ describe('Project remove modal', () => {
const findFormElement = () => wrapper.find('form');
const findConfirmButton = () => wrapper.find('.js-modal-action-primary');
const findAuthenticityTokenInput = () => findFormElement().find('input[name=authenticity_token]');
- const findModal = () => wrapper.find(GlModal);
+ const findModal = () => wrapper.findComponent(GlModal);
const findTitle = () => wrapper.find('[data-testid="delete-alert-title"]');
const findAlertBody = () => wrapper.find('[data-testid="delete-alert-body"]');
diff --git a/spec/frontend/projects/details/upload_button_spec.js b/spec/frontend/projects/details/upload_button_spec.js
index d73089630889..50638755260f 100644
--- a/spec/frontend/projects/details/upload_button_spec.js
+++ b/spec/frontend/projects/details/upload_button_spec.js
@@ -32,11 +32,11 @@ describe('UploadButton', () => {
});
it('displays an upload button', () => {
- expect(wrapper.find(GlButton).exists()).toBe(true);
+ expect(wrapper.findComponent(GlButton).exists()).toBe(true);
});
it('contains a modal', () => {
- const modal = wrapper.find(UploadBlobModal);
+ const modal = wrapper.findComponent(UploadBlobModal);
expect(modal.exists()).toBe(true);
expect(modal.props('modalId')).toBe(MODAL_ID);
@@ -44,7 +44,7 @@ describe('UploadButton', () => {
describe('when clickinig the upload file button', () => {
beforeEach(() => {
- wrapper.find(GlButton).vm.$emit('click');
+ wrapper.findComponent(GlButton).vm.$emit('click');
});
it('opens the modal', () => {
diff --git a/spec/frontend/projects/pipelines/charts/components/app_spec.js b/spec/frontend/projects/pipelines/charts/components/app_spec.js
index 7b9011fa3d95..db9d7eb9a8af 100644
--- a/spec/frontend/projects/pipelines/charts/components/app_spec.js
+++ b/spec/frontend/projects/pipelines/charts/components/app_spec.js
@@ -47,15 +47,16 @@ describe('ProjectsPipelinesChartsApp', () => {
wrapper.destroy();
});
- const findGlTabs = () => wrapper.find(GlTabs);
+ const findGlTabs = () => wrapper.findComponent(GlTabs);
const findAllGlTabs = () => wrapper.findAll(GlTab);
const findGlTabAtIndex = (index) => findAllGlTabs().at(index);
- const findLeadTimeCharts = () => wrapper.find(LeadTimeChartsStub);
- const findTimeToRestoreServiceCharts = () => wrapper.find(TimeToRestoreServiceChartsStub);
- const findChangeFailureRateCharts = () => wrapper.find(ChangeFailureRateChartsStub);
- const findDeploymentFrequencyCharts = () => wrapper.find(DeploymentFrequencyChartsStub);
- const findPipelineCharts = () => wrapper.find(PipelineCharts);
- const findProjectQualitySummary = () => wrapper.find(ProjectQualitySummaryStub);
+ const findLeadTimeCharts = () => wrapper.findComponent(LeadTimeChartsStub);
+ const findTimeToRestoreServiceCharts = () =>
+ wrapper.findComponent(TimeToRestoreServiceChartsStub);
+ const findChangeFailureRateCharts = () => wrapper.findComponent(ChangeFailureRateChartsStub);
+ const findDeploymentFrequencyCharts = () => wrapper.findComponent(DeploymentFrequencyChartsStub);
+ const findPipelineCharts = () => wrapper.findComponent(PipelineCharts);
+ const findProjectQualitySummary = () => wrapper.findComponent(ProjectQualitySummaryStub);
describe('when all charts are available', () => {
beforeEach(() => {
diff --git a/spec/frontend/projects/pipelines/charts/components/ci_cd_analytics_charts_spec.js b/spec/frontend/projects/pipelines/charts/components/ci_cd_analytics_charts_spec.js
index 7bb289408b80..8c18d2992ea1 100644
--- a/spec/frontend/projects/pipelines/charts/components/ci_cd_analytics_charts_spec.js
+++ b/spec/frontend/projects/pipelines/charts/components/ci_cd_analytics_charts_spec.js
@@ -81,7 +81,7 @@ describe('~/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue', (
it('should select a different chart on change', async () => {
findSegmentedControl().vm.$emit('input', 1);
- const chart = wrapper.find(CiCdAnalyticsAreaChart);
+ const chart = wrapper.findComponent(CiCdAnalyticsAreaChart);
await nextTick();
@@ -92,7 +92,7 @@ describe('~/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue', (
it('should not display charts if there are no charts', () => {
wrapper = createWrapper({ charts: [] });
- expect(wrapper.find(CiCdAnalyticsAreaChart).exists()).toBe(false);
+ expect(wrapper.findComponent(CiCdAnalyticsAreaChart).exists()).toBe(false);
});
describe('slots', () => {
diff --git a/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js b/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js
index 3c91b913e671..2f452f909ff8 100644
--- a/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js
+++ b/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js
@@ -44,7 +44,7 @@ describe('~/projects/pipelines/charts/components/pipeline_charts.vue', () => {
describe('overall statistics', () => {
it('displays the statistics list', () => {
- const list = wrapper.find(StatisticsList);
+ const list = wrapper.findComponent(StatisticsList);
expect(list.exists()).toBe(true);
expect(list.props('counts')).toEqual({
@@ -56,7 +56,7 @@ describe('~/projects/pipelines/charts/components/pipeline_charts.vue', () => {
});
it('displays the commit duration chart', () => {
- const chart = wrapper.find(GlColumnChart);
+ const chart = wrapper.findComponent(GlColumnChart);
expect(chart.exists()).toBeTruthy();
expect(chart.props('yAxisTitle')).toBe('Minutes');
@@ -68,12 +68,12 @@ describe('~/projects/pipelines/charts/components/pipeline_charts.vue', () => {
describe('pipelines charts', () => {
it('displays the charts components', () => {
- expect(wrapper.find(CiCdAnalyticsCharts).exists()).toBe(true);
+ expect(wrapper.findComponent(CiCdAnalyticsCharts).exists()).toBe(true);
});
describe('displays individual correctly', () => {
it('renders with the correct data', () => {
- const charts = wrapper.find(CiCdAnalyticsCharts);
+ const charts = wrapper.findComponent(CiCdAnalyticsCharts);
expect(charts.props()).toEqual({
charts: wrapper.vm.areaCharts,
chartOptions: wrapper.vm.$options.areaChartOptions,
diff --git a/spec/frontend/projects/settings/components/shared_runners_toggle_spec.js b/spec/frontend/projects/settings/components/shared_runners_toggle_spec.js
index 0a05832ceb6c..329060b9d10c 100644
--- a/spec/frontend/projects/settings/components/shared_runners_toggle_spec.js
+++ b/spec/frontend/projects/settings/components/shared_runners_toggle_spec.js
@@ -27,9 +27,9 @@ describe('projects/settings/components/shared_runners', () => {
});
};
- const findErrorAlert = () => wrapper.find(GlAlert);
- const findSharedRunnersToggle = () => wrapper.find(GlToggle);
- const findToggleTooltip = () => wrapper.find(GlTooltip);
+ const findErrorAlert = () => wrapper.findComponent(GlAlert);
+ const findSharedRunnersToggle = () => wrapper.findComponent(GlToggle);
+ const findToggleTooltip = () => wrapper.findComponent(GlTooltip);
const getToggleValue = () => findSharedRunnersToggle().props('value');
const isToggleLoading = () => findSharedRunnersToggle().props('isLoading');
const isToggleDisabled = () => findSharedRunnersToggle().props('disabled');
diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js
index 763d54be753a..13f3eea277a6 100644
--- a/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js
+++ b/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js
@@ -26,7 +26,7 @@ describe('ServiceDeskRoot', () => {
publicProject: false,
};
- const getAlertText = () => wrapper.find(GlAlert).text();
+ const getAlertText = () => wrapper.findComponent(GlAlert).text();
const createComponent = (customInject = {}) =>
shallowMount(ServiceDeskRoot, {
@@ -51,7 +51,7 @@ describe('ServiceDeskRoot', () => {
it('is rendered', () => {
wrapper = createComponent();
- expect(wrapper.find(ServiceDeskSetting).props()).toEqual({
+ expect(wrapper.findComponent(ServiceDeskSetting).props()).toEqual({
customEmail: provideData.customEmail,
customEmailEnabled: provideData.customEmailEnabled,
incomingEmail: provideData.initialIncomingEmail,
@@ -89,7 +89,7 @@ describe('ServiceDeskRoot', () => {
beforeEach(async () => {
wrapper = createComponent();
- wrapper.find(ServiceDeskSetting).vm.$emit('toggle', true);
+ wrapper.findComponent(ServiceDeskSetting).vm.$emit('toggle', true);
await waitForPromises();
});
@@ -111,7 +111,7 @@ describe('ServiceDeskRoot', () => {
beforeEach(async () => {
wrapper = createComponent();
- wrapper.find(ServiceDeskSetting).vm.$emit('toggle', false);
+ wrapper.findComponent(ServiceDeskSetting).vm.$emit('toggle', false);
await waitForPromises();
});
@@ -143,7 +143,7 @@ describe('ServiceDeskRoot', () => {
projectKey: 'key',
};
- wrapper.find(ServiceDeskSetting).vm.$emit('save', payload);
+ wrapper.findComponent(ServiceDeskSetting).vm.$emit('save', payload);
await waitForPromises();
});
@@ -174,7 +174,7 @@ describe('ServiceDeskRoot', () => {
projectKey: 'key',
};
- wrapper.find(ServiceDeskSetting).vm.$emit('save', payload);
+ wrapper.findComponent(ServiceDeskSetting).vm.$emit('save', payload);
await waitForPromises();
});
diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js
index aac1a418142c..f9f520cb2abb 100644
--- a/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js
+++ b/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js
@@ -8,13 +8,13 @@ import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
describe('ServiceDeskSetting', () => {
let wrapper;
- const findButton = () => wrapper.find(GlButton);
- const findClipboardButton = () => wrapper.find(ClipboardButton);
+ const findButton = () => wrapper.findComponent(GlButton);
+ const findClipboardButton = () => wrapper.findComponent(ClipboardButton);
const findIncomingEmail = () => wrapper.findByTestId('incoming-email');
const findIncomingEmailLabel = () => wrapper.findByTestId('incoming-email-label');
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
- const findTemplateDropdown = () => wrapper.find(GlDropdown);
- const findToggle = () => wrapper.find(GlToggle);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
+ const findTemplateDropdown = () => wrapper.findComponent(GlDropdown);
+ const findToggle = () => wrapper.findComponent(GlToggle);
const createComponent = ({ props = {} } = {}) =>
extendedWrapper(
diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js
index cdb355f5a9b2..dde06d40a4d7 100644
--- a/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js
+++ b/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js
@@ -7,7 +7,7 @@ import { TEMPLATES } from './mock_data';
describe('ServiceDeskTemplateDropdown', () => {
let wrapper;
- const findTemplateDropdown = () => wrapper.find(GlDropdown);
+ const findTemplateDropdown = () => wrapper.findComponent(GlDropdown);
const createComponent = ({ props = {} } = {}) =>
extendedWrapper(
diff --git a/spec/frontend/ref/components/ref_selector_spec.js b/spec/frontend/ref/components/ref_selector_spec.js
index 882cb2c11994..851a3fcaf33e 100644
--- a/spec/frontend/ref/components/ref_selector_spec.js
+++ b/spec/frontend/ref/components/ref_selector_spec.js
@@ -93,9 +93,9 @@ describe('Ref selector component', () => {
const findNoResults = () => wrapper.find('[data-testid="no-results"]');
- const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
- const findSearchBox = () => wrapper.find(GlSearchBoxByType);
+ const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
const findBranchesSection = () => wrapper.find('[data-testid="branches-section"]');
const findBranchDropdownItems = () => findBranchesSection().findAll(GlDropdownItem);
@@ -530,13 +530,13 @@ describe('Ref selector component', () => {
});
it('renders a checkmark by the selected item', async () => {
- expect(findFirstBranchDropdownItem().find(GlIcon).element).toHaveClass(
+ expect(findFirstBranchDropdownItem().findComponent(GlIcon).element).toHaveClass(
'gl-visibility-hidden',
);
await selectFirstBranch();
- expect(findFirstBranchDropdownItem().find(GlIcon).element).not.toHaveClass(
+ expect(findFirstBranchDropdownItem().findComponent(GlIcon).element).not.toHaveClass(
'gl-visibility-hidden',
);
});
@@ -684,7 +684,8 @@ describe('Ref selector component', () => {
describe('validation state', () => {
const invalidClass = 'gl-inset-border-1-red-500!';
- const isInvalidClassApplied = () => wrapper.find(GlDropdown).props('toggleClass')[invalidClass];
+ const isInvalidClassApplied = () =>
+ wrapper.findComponent(GlDropdown).props('toggleClass')[invalidClass];
describe('valid state', () => {
describe('when the state prop is not provided', () => {
diff --git a/spec/frontend/related_issues/components/related_issuable_input_spec.js b/spec/frontend/related_issues/components/related_issuable_input_spec.js
index 7d11e3cffb06..f6a13856042a 100644
--- a/spec/frontend/related_issues/components/related_issuable_input_spec.js
+++ b/spec/frontend/related_issues/components/related_issuable_input_spec.js
@@ -33,7 +33,7 @@ describe('RelatedIssuableInput', () => {
it('shows placeholder text', () => {
const wrapper = shallowMount(RelatedIssuableInput, { propsData });
- expect(wrapper.find({ ref: 'input' }).element.placeholder).toBe(
+ expect(wrapper.findComponent({ ref: 'input' }).element.placeholder).toBe(
'Paste issue link or <#issue id>',
);
});
@@ -54,7 +54,7 @@ describe('RelatedIssuableInput', () => {
},
});
- expect(wrapper.find({ ref: 'input' }).element.value).toBe('');
+ expect(wrapper.findComponent({ ref: 'input' }).element.value).toBe('');
});
it('does not have GfmAutoComplete', () => {
@@ -85,7 +85,7 @@ describe('RelatedIssuableInput', () => {
await nextTick();
- expect(document.activeElement).toBe(wrapper.find({ ref: 'input' }).element);
+ expect(document.activeElement).toBe(wrapper.findComponent({ ref: 'input' }).element);
});
});
@@ -100,7 +100,7 @@ describe('RelatedIssuableInput', () => {
const newInputValue = 'filling in things';
const untouchedRawReferences = newInputValue.trim().split(/\s/);
const touchedReference = untouchedRawReferences.pop();
- const input = wrapper.find({ ref: 'input' });
+ const input = wrapper.findComponent({ ref: 'input' });
input.element.value = newInputValue;
input.element.selectionStart = newInputValue.length;
diff --git a/spec/frontend/releases/components/app_edit_new_spec.js b/spec/frontend/releases/components/app_edit_new_spec.js
index cb044b9e8917..649d8eef6ecc 100644
--- a/spec/frontend/releases/components/app_edit_new_spec.js
+++ b/spec/frontend/releases/components/app_edit_new_spec.js
@@ -220,7 +220,7 @@ describe('Release edit/new component', () => {
});
it('renders a checkbox to include release notes', () => {
- expect(wrapper.find(GlFormCheckbox).exists()).toBe(true);
+ expect(wrapper.findComponent(GlFormCheckbox).exists()).toBe(true);
});
});
@@ -238,7 +238,7 @@ describe('Release edit/new component', () => {
beforeEach(factory);
it('renders the asset links portion of the form', () => {
- expect(wrapper.find(AssetLinksForm).exists()).toBe(true);
+ expect(wrapper.findComponent(AssetLinksForm).exists()).toBe(true);
});
});
diff --git a/spec/frontend/releases/components/app_show_spec.js b/spec/frontend/releases/components/app_show_spec.js
index c2ea6900d6ed..9ca25b3b69a6 100644
--- a/spec/frontend/releases/components/app_show_spec.js
+++ b/spec/frontend/releases/components/app_show_spec.js
@@ -36,8 +36,8 @@ describe('Release show component', () => {
wrapper = null;
});
- const findLoadingSkeleton = () => wrapper.find(ReleaseSkeletonLoader);
- const findReleaseBlock = () => wrapper.find(ReleaseBlock);
+ const findLoadingSkeleton = () => wrapper.findComponent(ReleaseSkeletonLoader);
+ const findReleaseBlock = () => wrapper.findComponent(ReleaseBlock);
const expectLoadingIndicator = () => {
it('renders a loading indicator', () => {
diff --git a/spec/frontend/releases/components/asset_links_form_spec.js b/spec/frontend/releases/components/asset_links_form_spec.js
index 17f079ba5a62..1ff5766b0741 100644
--- a/spec/frontend/releases/components/asset_links_form_spec.js
+++ b/spec/frontend/releases/components/asset_links_form_spec.js
@@ -73,7 +73,7 @@ describe('Release edit component', () => {
it('calls the "addEmptyAssetLink" store method when the "Add another link" button is clicked', () => {
expect(actions.addEmptyAssetLink).not.toHaveBeenCalled();
- wrapper.find({ ref: 'addAnotherLinkButton' }).vm.$emit('click');
+ wrapper.findComponent({ ref: 'addAnotherLinkButton' }).vm.$emit('click');
expect(actions.addEmptyAssetLink).toHaveBeenCalledTimes(1);
});
@@ -92,7 +92,7 @@ describe('Release edit component', () => {
let newUrl;
beforeEach(() => {
- input = wrapper.find({ ref: 'urlInput' }).element;
+ input = wrapper.findComponent({ ref: 'urlInput' }).element;
linkIdToUpdate = release.assets.links[0].id;
newUrl = 'updated url';
});
@@ -118,7 +118,7 @@ describe('Release edit component', () => {
it('calls the "updateAssetLinkUrl" store method when text is entered into the "URL" input field', () => {
expectStoreMethodNotToBeCalled();
- wrapper.find({ ref: 'urlInput' }).vm.$emit('change', newUrl);
+ wrapper.findComponent({ ref: 'urlInput' }).vm.$emit('change', newUrl);
expectStoreMethodToBeCalled();
});
@@ -150,7 +150,7 @@ describe('Release edit component', () => {
let newName;
beforeEach(() => {
- input = wrapper.find({ ref: 'nameInput' }).element;
+ input = wrapper.findComponent({ ref: 'nameInput' }).element;
linkIdToUpdate = release.assets.links[0].id;
newName = 'updated name';
});
@@ -176,7 +176,7 @@ describe('Release edit component', () => {
it('calls the "updateAssetLinkName" store method when text is entered into the "Link title" input field', () => {
expectStoreMethodNotToBeCalled();
- wrapper.find({ ref: 'nameInput' }).vm.$emit('change', newName);
+ wrapper.findComponent({ ref: 'nameInput' }).vm.$emit('change', newName);
expectStoreMethodToBeCalled();
});
@@ -208,7 +208,7 @@ describe('Release edit component', () => {
expect(actions.updateAssetLinkType).not.toHaveBeenCalled();
- wrapper.find({ ref: 'typeSelect' }).vm.$emit('change', newType);
+ wrapper.findComponent({ ref: 'typeSelect' }).vm.$emit('change', newType);
expect(actions.updateAssetLinkType).toHaveBeenCalledTimes(1);
expect(actions.updateAssetLinkType).toHaveBeenCalledWith(expect.anything(), {
@@ -225,7 +225,7 @@ describe('Release edit component', () => {
});
it('selects the default asset type', () => {
- const selected = wrapper.find({ ref: 'typeSelect' }).element.value;
+ const selected = wrapper.findComponent({ ref: 'typeSelect' }).element.value;
expect(selected).toBe(DEFAULT_ASSET_LINK_TYPE);
});
diff --git a/spec/frontend/releases/components/evidence_block_spec.js b/spec/frontend/releases/components/evidence_block_spec.js
index f0d028843051..2db1e9e38a2d 100644
--- a/spec/frontend/releases/components/evidence_block_spec.js
+++ b/spec/frontend/releases/components/evidence_block_spec.js
@@ -32,19 +32,19 @@ describe('Evidence Block', () => {
});
it('renders the evidence icon', () => {
- expect(wrapper.find(GlIcon).props('name')).toBe('review-list');
+ expect(wrapper.findComponent(GlIcon).props('name')).toBe('review-list');
});
it('renders the title for the dowload link', () => {
- expect(wrapper.find(GlLink).text()).toBe(`v1.1-evidences-1.json`);
+ expect(wrapper.findComponent(GlLink).text()).toBe(`v1.1-evidences-1.json`);
});
it('renders the correct hover text for the download', () => {
- expect(wrapper.find(GlLink).attributes('title')).toBe('Download evidence JSON');
+ expect(wrapper.findComponent(GlLink).attributes('title')).toBe('Download evidence JSON');
});
it('renders the correct file link for download', () => {
- expect(wrapper.find(GlLink).attributes().download).toBe(`v1.1-evidences-1.json`);
+ expect(wrapper.findComponent(GlLink).attributes().download).toBe(`v1.1-evidences-1.json`);
});
describe('sha text', () => {
@@ -62,15 +62,15 @@ describe('Evidence Block', () => {
describe('copy to clipboard button', () => {
it('renders button', () => {
- expect(wrapper.find(ClipboardButton).exists()).toBe(true);
+ expect(wrapper.findComponent(ClipboardButton).exists()).toBe(true);
});
it('renders the correct hover text', () => {
- expect(wrapper.find(ClipboardButton).attributes('title')).toBe('Copy evidence SHA');
+ expect(wrapper.findComponent(ClipboardButton).attributes('title')).toBe('Copy evidence SHA');
});
it('copies the sha', () => {
- expect(wrapper.find(ClipboardButton).attributes('data-clipboard-text')).toBe(
+ expect(wrapper.findComponent(ClipboardButton).attributes('data-clipboard-text')).toBe(
release.evidences[0].sha,
);
});
diff --git a/spec/frontend/releases/components/issuable_stats_spec.js b/spec/frontend/releases/components/issuable_stats_spec.js
index 8fc0779da14a..3ac75e138ee5 100644
--- a/spec/frontend/releases/components/issuable_stats_spec.js
+++ b/spec/frontend/releases/components/issuable_stats_spec.js
@@ -16,9 +16,11 @@ describe('~/releases/components/issuable_stats.vue', () => {
});
};
- const findOpenStatLink = () => wrapper.find('[data-testid="open-stat"]').find(GlLink);
- const findMergedStatLink = () => wrapper.find('[data-testid="merged-stat"]').find(GlLink);
- const findClosedStatLink = () => wrapper.find('[data-testid="closed-stat"]').find(GlLink);
+ const findOpenStatLink = () => wrapper.find('[data-testid="open-stat"]').findComponent(GlLink);
+ const findMergedStatLink = () =>
+ wrapper.find('[data-testid="merged-stat"]').findComponent(GlLink);
+ const findClosedStatLink = () =>
+ wrapper.find('[data-testid="closed-stat"]').findComponent(GlLink);
beforeEach(() => {
defaultProps = {
diff --git a/spec/frontend/releases/components/release_block_assets_spec.js b/spec/frontend/releases/components/release_block_assets_spec.js
index c63689e11ac0..4f94e4dfd55f 100644
--- a/spec/frontend/releases/components/release_block_assets_spec.js
+++ b/spec/frontend/releases/components/release_block_assets_spec.js
@@ -44,7 +44,7 @@ describe('Release block assets', () => {
});
it('renders the accordion as expanded by default', () => {
- const accordion = wrapper.find(GlCollapse);
+ const accordion = wrapper.findComponent(GlCollapse);
expect(accordion.exists()).toBe(true);
expect(accordion.isVisible()).toBe(true);
diff --git a/spec/frontend/releases/components/release_block_footer_spec.js b/spec/frontend/releases/components/release_block_footer_spec.js
index 848e802df4bf..8f4efad197ff 100644
--- a/spec/frontend/releases/components/release_block_footer_spec.js
+++ b/spec/frontend/releases/components/release_block_footer_spec.js
@@ -38,16 +38,16 @@ describe('Release block footer', () => {
});
const commitInfoSection = () => wrapper.find('.js-commit-info');
- const commitInfoSectionLink = () => commitInfoSection().find(GlLink);
+ const commitInfoSectionLink = () => commitInfoSection().findComponent(GlLink);
const tagInfoSection = () => wrapper.find('.js-tag-info');
- const tagInfoSectionLink = () => tagInfoSection().find(GlLink);
+ const tagInfoSectionLink = () => tagInfoSection().findComponent(GlLink);
const authorDateInfoSection = () => wrapper.find('.js-author-date-info');
describe('with all props provided', () => {
beforeEach(() => factory());
it('renders the commit icon', () => {
- const commitIcon = commitInfoSection().find(GlIcon);
+ const commitIcon = commitInfoSection().findComponent(GlIcon);
expect(commitIcon.exists()).toBe(true);
expect(commitIcon.props('name')).toBe('commit');
@@ -62,14 +62,14 @@ describe('Release block footer', () => {
});
it('renders the tag icon', () => {
- const commitIcon = tagInfoSection().find(GlIcon);
+ const commitIcon = tagInfoSection().findComponent(GlIcon);
expect(commitIcon.exists()).toBe(true);
expect(commitIcon.props('name')).toBe('tag');
});
it('renders the tag name with a link', () => {
- const commitLink = tagInfoSection().find(GlLink);
+ const commitLink = tagInfoSection().findComponent(GlLink);
expect(commitLink.exists()).toBe(true);
expect(commitLink.text()).toBe(release.tagName);
@@ -120,7 +120,7 @@ describe('Release block footer', () => {
});
it("renders a link to the author's profile", () => {
- const authorLink = authorDateInfoSection().find(GlLink);
+ const authorLink = authorDateInfoSection().findComponent(GlLink);
expect(authorLink.exists()).toBe(true);
expect(authorLink.attributes('href')).toBe(release.author.webUrl);
diff --git a/spec/frontend/releases/components/release_block_header_spec.js b/spec/frontend/releases/components/release_block_header_spec.js
index c9921185bad6..fc421776d603 100644
--- a/spec/frontend/releases/components/release_block_header_spec.js
+++ b/spec/frontend/releases/components/release_block_header_spec.js
@@ -30,7 +30,7 @@ describe('Release block header', () => {
});
const findHeader = () => wrapper.find('h2');
- const findHeaderLink = () => findHeader().find(GlLink);
+ const findHeaderLink = () => findHeader().findComponent(GlLink);
const findEditButton = () => wrapper.find('.js-edit-button');
const findBadge = () => wrapper.findComponent(GlBadge);
diff --git a/spec/frontend/releases/components/release_block_milestone_info_spec.js b/spec/frontend/releases/components/release_block_milestone_info_spec.js
index 84a0080965b4..89ae556f9069 100644
--- a/spec/frontend/releases/components/release_block_milestone_info_spec.js
+++ b/spec/frontend/releases/components/release_block_milestone_info_spec.js
@@ -43,7 +43,7 @@ describe('Release block milestone info', () => {
});
it('renders a progress bar that displays the correct percentage', () => {
- const progressBar = milestoneProgressBarContainer().find(GlProgressBar);
+ const progressBar = milestoneProgressBarContainer().findComponent(GlProgressBar);
expect(progressBar.exists()).toBe(true);
expect(progressBar.attributes()).toEqual(
@@ -72,7 +72,7 @@ describe('Release block milestone info', () => {
expect(issuesContainerText).toContain(`Issues ${totalIssueCount}`);
- const badge = issuesContainer().find(GlBadge);
+ const badge = issuesContainer().findComponent(GlBadge);
expect(badge.text()).toBe(totalIssueCount.toString());
expect(issuesContainerText).toContain('Open: 5 • Closed: 4');
@@ -107,7 +107,7 @@ describe('Release block milestone info', () => {
});
const clickShowMoreFewerButton = async () => {
- milestoneListContainer().find(GlButton).trigger('click');
+ milestoneListContainer().findComponent(GlButton).trigger('click');
await nextTick();
};
diff --git a/spec/frontend/releases/components/release_block_spec.js b/spec/frontend/releases/components/release_block_spec.js
index 17e2af687a65..096c3db8902c 100644
--- a/spec/frontend/releases/components/release_block_spec.js
+++ b/spec/frontend/releases/components/release_block_spec.js
@@ -74,7 +74,7 @@ describe('Release block', () => {
});
it('renders the footer', () => {
- expect(wrapper.find(ReleaseBlockFooter).exists()).toBe(true);
+ expect(wrapper.findComponent(ReleaseBlockFooter).exists()).toBe(true);
});
});
@@ -133,7 +133,7 @@ describe('Release block', () => {
describe('evidence block', () => {
it('renders the evidence block when the evidence is available', () => {
return factory(release).then(() => {
- expect(wrapper.find(EvidenceBlock).exists()).toBe(true);
+ expect(wrapper.findComponent(EvidenceBlock).exists()).toBe(true);
});
});
@@ -141,7 +141,7 @@ describe('Release block', () => {
release.evidences = [];
return factory(release).then(() => {
- expect(wrapper.find(EvidenceBlock).exists()).toBe(false);
+ expect(wrapper.findComponent(EvidenceBlock).exists()).toBe(false);
});
});
});
diff --git a/spec/frontend/releases/components/release_skeleton_loader_spec.js b/spec/frontend/releases/components/release_skeleton_loader_spec.js
index 7f81081ff6c4..76dfe0d9777b 100644
--- a/spec/frontend/releases/components/release_skeleton_loader_spec.js
+++ b/spec/frontend/releases/components/release_skeleton_loader_spec.js
@@ -10,6 +10,6 @@ describe('release_skeleton_loader.vue', () => {
});
it('renders a GlSkeletonLoader', () => {
- expect(wrapper.find(GlSkeletonLoader).exists()).toBe(true);
+ expect(wrapper.findComponent(GlSkeletonLoader).exists()).toBe(true);
});
});
diff --git a/spec/frontend/releases/components/tag_field_exsting_spec.js b/spec/frontend/releases/components/tag_field_exsting_spec.js
index f45a28392b77..8105aa4f6f25 100644
--- a/spec/frontend/releases/components/tag_field_exsting_spec.js
+++ b/spec/frontend/releases/components/tag_field_exsting_spec.js
@@ -20,7 +20,7 @@ describe('releases/components/tag_field_existing', () => {
});
};
- const findInput = () => wrapper.find(GlFormInput);
+ const findInput = () => wrapper.findComponent(GlFormInput);
const findHelp = () => wrapper.find('[data-testid="tag-name-help"]');
beforeEach(() => {
diff --git a/spec/frontend/releases/components/tag_field_new_spec.js b/spec/frontend/releases/components/tag_field_new_spec.js
index 9f500c318eaa..b8047cae8c27 100644
--- a/spec/frontend/releases/components/tag_field_new_spec.js
+++ b/spec/frontend/releases/components/tag_field_new_spec.js
@@ -79,12 +79,12 @@ describe('releases/components/tag_field_new', () => {
});
const findTagNameFormGroup = () => wrapper.find('[data-testid="tag-name-field"]');
- const findTagNameDropdown = () => findTagNameFormGroup().find(RefSelectorStub);
+ const findTagNameDropdown = () => findTagNameFormGroup().findComponent(RefSelectorStub);
const findCreateFromFormGroup = () => wrapper.find('[data-testid="create-from-field"]');
- const findCreateFromDropdown = () => findCreateFromFormGroup().find(RefSelectorStub);
+ const findCreateFromDropdown = () => findCreateFromFormGroup().findComponent(RefSelectorStub);
- const findCreateNewTagOption = () => wrapper.find(GlDropdownItem);
+ const findCreateNewTagOption = () => wrapper.findComponent(GlDropdownItem);
describe('"Tag name" field', () => {
describe('rendering and behavior', () => {
diff --git a/spec/frontend/releases/components/tag_field_spec.js b/spec/frontend/releases/components/tag_field_spec.js
index e7b9aa4abbb6..85a40f02c53f 100644
--- a/spec/frontend/releases/components/tag_field_spec.js
+++ b/spec/frontend/releases/components/tag_field_spec.js
@@ -21,8 +21,8 @@ describe('releases/components/tag_field', () => {
wrapper = shallowMount(TagField, { store });
};
- const findTagFieldNew = () => wrapper.find(TagFieldNew);
- const findTagFieldExisting = () => wrapper.find(TagFieldExisting);
+ const findTagFieldNew = () => wrapper.findComponent(TagFieldNew);
+ const findTagFieldExisting = () => wrapper.findComponent(TagFieldExisting);
afterEach(() => {
wrapper.destroy();
diff --git a/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js b/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js
index ddabb7194cbc..d835ca4c7338 100644
--- a/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js
+++ b/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js
@@ -41,7 +41,7 @@ describe('CustomMetricsForm', () => {
});
it('Displays the issue message', () => {
- const description = wrapper.find({ ref: 'accessibility-issue-description' }).text();
+ const description = wrapper.findComponent({ ref: 'accessibility-issue-description' }).text();
expect(description).toContain(`Message: ${issue.message}`);
});
@@ -49,7 +49,7 @@ describe('CustomMetricsForm', () => {
describe('When an issue code is present', () => {
it('Creates the correct URL for learning more about the issue code', () => {
const learnMoreUrl = wrapper
- .find({ ref: 'accessibility-issue-learn-more' })
+ .findComponent({ ref: 'accessibility-issue-learn-more' })
.attributes('href');
expect(learnMoreUrl).toBe(issue.learnMoreUrl);
@@ -66,7 +66,7 @@ describe('CustomMetricsForm', () => {
it('Creates a URL leading to the overview documentation page', () => {
const learnMoreUrl = wrapper
- .find({ ref: 'accessibility-issue-learn-more' })
+ .findComponent({ ref: 'accessibility-issue-learn-more' })
.attributes('href');
expect(learnMoreUrl).toBe('https://www.w3.org/TR/WCAG20-TECHS/Overview.html');
@@ -83,7 +83,7 @@ describe('CustomMetricsForm', () => {
it('Creates a URL leading to the overview documentation page', () => {
const learnMoreUrl = wrapper
- .find({ ref: 'accessibility-issue-learn-more' })
+ .findComponent({ ref: 'accessibility-issue-learn-more' })
.attributes('href');
expect(learnMoreUrl).toBe('https://www.w3.org/TR/WCAG20-TECHS/Overview.html');
diff --git a/spec/frontend/reports/accessibility_report/grouped_accessibility_reports_app_spec.js b/spec/frontend/reports/accessibility_report/grouped_accessibility_reports_app_spec.js
index 34b1cdd92bc8..9d3535291ebd 100644
--- a/spec/frontend/reports/accessibility_report/grouped_accessibility_reports_app_spec.js
+++ b/spec/frontend/reports/accessibility_report/grouped_accessibility_reports_app_spec.js
@@ -114,7 +114,7 @@ describe('Grouped accessibility reports app', () => {
});
it('renders custom accessibility issue body', () => {
- const issueBody = wrapper.find(AccessibilityIssueBody);
+ const issueBody = wrapper.findComponent(AccessibilityIssueBody);
expect(issueBody.props('issue').code).toBe(mockReport.new_errors[0].code);
expect(issueBody.props('issue').message).toBe(mockReport.new_errors[0].message);
diff --git a/spec/frontend/reports/codequality_report/components/codequality_issue_body_spec.js b/spec/frontend/reports/codequality_report/components/codequality_issue_body_spec.js
index 17f07ac2b8f7..c32b52d9e77d 100644
--- a/spec/frontend/reports/codequality_report/components/codequality_issue_body_spec.js
+++ b/spec/frontend/reports/codequality_report/components/codequality_issue_body_spec.js
@@ -8,7 +8,7 @@ describe('code quality issue body issue body', () => {
let wrapper;
const findSeverityIcon = () => wrapper.findByTestId('codequality-severity-icon');
- const findGlIcon = () => wrapper.find(GlIcon);
+ const findGlIcon = () => wrapper.findComponent(GlIcon);
const codequalityIssue = {
name:
diff --git a/spec/frontend/reports/codequality_report/grouped_codequality_reports_app_spec.js b/spec/frontend/reports/codequality_report/grouped_codequality_reports_app_spec.js
index b61b65c2713a..962ff068b926 100644
--- a/spec/frontend/reports/codequality_report/grouped_codequality_reports_app_spec.js
+++ b/spec/frontend/reports/codequality_report/grouped_codequality_reports_app_spec.js
@@ -30,7 +30,7 @@ describe('Grouped code quality reports app', () => {
};
const findWidget = () => wrapper.find('.js-codequality-widget');
- const findIssueBody = () => wrapper.find(CodequalityIssueBody);
+ const findIssueBody = () => wrapper.findComponent(CodequalityIssueBody);
beforeEach(() => {
const { state, ...storeConfig } = getStoreConfig();
diff --git a/spec/frontend/reports/components/grouped_issues_list_spec.js b/spec/frontend/reports/components/grouped_issues_list_spec.js
index 95ef0bcbcc71..74c17b0b8fcd 100644
--- a/spec/frontend/reports/components/grouped_issues_list_spec.js
+++ b/spec/frontend/reports/components/grouped_issues_list_spec.js
@@ -30,7 +30,7 @@ describe('Grouped Issues List', () => {
},
});
- expect(wrapper.find(SmartVirtualList).props()).toMatchSnapshot();
+ expect(wrapper.findComponent(SmartVirtualList).props()).toMatchSnapshot();
});
describe('without data', () => {
@@ -43,7 +43,7 @@ describe('Grouped Issues List', () => {
});
it.each(['resolved', 'unresolved'])('does not render report items for %s issues', () => {
- expect(wrapper.find(ReportItem).exists()).toBe(false);
+ expect(wrapper.findComponent(ReportItem).exists()).toBe(false);
});
});
@@ -81,7 +81,7 @@ describe('Grouped Issues List', () => {
},
});
- expect(wrapper.find(ReportItem).props()).toMatchSnapshot();
+ expect(wrapper.findComponent(ReportItem).props()).toMatchSnapshot();
});
});
});
diff --git a/spec/frontend/reports/components/report_item_spec.js b/spec/frontend/reports/components/report_item_spec.js
index a7243c5377b6..b52c163eb263 100644
--- a/spec/frontend/reports/components/report_item_spec.js
+++ b/spec/frontend/reports/components/report_item_spec.js
@@ -16,7 +16,7 @@ describe('ReportItem', () => {
},
});
- expect(wrapper.find(IssueStatusIcon).exists()).toBe(false);
+ expect(wrapper.findComponent(IssueStatusIcon).exists()).toBe(false);
});
it('shows status icon when unspecified', () => {
@@ -28,7 +28,7 @@ describe('ReportItem', () => {
},
});
- expect(wrapper.find(IssueStatusIcon).exists()).toBe(true);
+ expect(wrapper.findComponent(IssueStatusIcon).exists()).toBe(true);
});
});
});
diff --git a/spec/frontend/reports/grouped_test_report/components/modal_spec.js b/spec/frontend/reports/grouped_test_report/components/modal_spec.js
index 3de81f754fda..e8564d2428d8 100644
--- a/spec/frontend/reports/grouped_test_report/components/modal_spec.js
+++ b/spec/frontend/reports/grouped_test_report/components/modal_spec.js
@@ -40,7 +40,9 @@ describe('Grouped Test Reports Modal', () => {
});
it('renders code block', () => {
- expect(wrapper.find(CodeBlock).props().code).toEqual(modalDataStructure.system_output.value);
+ expect(wrapper.findComponent(CodeBlock).props().code).toEqual(
+ modalDataStructure.system_output.value,
+ );
});
it('renders link', () => {
diff --git a/spec/frontend/repository/components/breadcrumbs_spec.js b/spec/frontend/repository/components/breadcrumbs_spec.js
index 40b329045895..a1a292e96789 100644
--- a/spec/frontend/repository/components/breadcrumbs_spec.js
+++ b/spec/frontend/repository/components/breadcrumbs_spec.js
@@ -39,8 +39,8 @@ describe('Repository breadcrumbs component', () => {
});
};
- const findUploadBlobModal = () => wrapper.find(UploadBlobModal);
- const findNewDirectoryModal = () => wrapper.find(NewDirectoryModal);
+ const findUploadBlobModal = () => wrapper.findComponent(UploadBlobModal);
+ const findNewDirectoryModal = () => wrapper.findComponent(NewDirectoryModal);
afterEach(() => {
wrapper.destroy();
@@ -95,7 +95,7 @@ describe('Repository breadcrumbs component', () => {
await nextTick();
- expect(wrapper.find(GlDropdown).exists()).toBe(false);
+ expect(wrapper.findComponent(GlDropdown).exists()).toBe(false);
});
it.each`
@@ -109,7 +109,7 @@ describe('Repository breadcrumbs component', () => {
'does render add to tree dropdown $isRendered when route is $routeName',
({ routeName, isRendered }) => {
factory('app/assets/javascripts.js', { canCollaborate: true }, { name: routeName });
- expect(wrapper.find(GlDropdown).exists()).toBe(isRendered);
+ expect(wrapper.findComponent(GlDropdown).exists()).toBe(isRendered);
},
);
@@ -122,7 +122,7 @@ describe('Repository breadcrumbs component', () => {
await nextTick();
- expect(wrapper.find(GlDropdown).exists()).toBe(true);
+ expect(wrapper.findComponent(GlDropdown).exists()).toBe(true);
});
describe('renders the upload blob modal', () => {
diff --git a/spec/frontend/repository/components/preview/index_spec.js b/spec/frontend/repository/components/preview/index_spec.js
index 0d9bfc62ed53..e4eba65795e0 100644
--- a/spec/frontend/repository/components/preview/index_spec.js
+++ b/spec/frontend/repository/components/preview/index_spec.js
@@ -68,6 +68,6 @@ describe('Repository file preview component', () => {
vm.setData({ loading: 1 });
await nextTick();
- expect(vm.find(GlLoadingIcon).exists()).toBe(true);
+ expect(vm.findComponent(GlLoadingIcon).exists()).toBe(true);
});
});
--
GitLab