diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-09-12 21:10:38 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-09-12 21:10:38 +0000 |
commit | 3b69a04945341516a2ed6a291769c50fe04336df (patch) | |
tree | 5910b5f0c80bf98aded05305bbaa7fd30d2742c4 /spec/frontend | |
parent | e4cfc16da343c2008053ee09bb6af7145a6924cb (diff) | |
download | gitlab-ce-3b69a04945341516a2ed6a291769c50fe04336df.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend')
97 files changed, 437 insertions, 377 deletions
diff --git a/spec/frontend/__helpers__/dl_locator_helper.js b/spec/frontend/__helpers__/dl_locator_helper.js index b507dcd599d..591c034be9b 100644 --- a/spec/frontend/__helpers__/dl_locator_helper.js +++ b/spec/frontend/__helpers__/dl_locator_helper.js @@ -19,10 +19,13 @@ import { createWrapper, ErrorWrapper } from '@vue/test-utils'; * @returns Wrapper */ export const findDd = (dtLabel, wrapper) => { - const dt = wrapper.findByText(dtLabel).element; - const dd = dt.nextElementSibling; - if (dt.tagName === 'DT' && dd.tagName === 'DD') { - return createWrapper(dd, {}); + const dtw = wrapper.findByText(dtLabel); + if (dtw.exists()) { + const dt = dtw.element; + const dd = dt.nextElementSibling; + if (dt.tagName === 'DT' && dd.tagName === 'DD') { + return createWrapper(dd, {}); + } } - return ErrorWrapper(dtLabel); + return new ErrorWrapper(dtLabel); }; diff --git a/spec/frontend/emoji/components/category_spec.js b/spec/frontend/emoji/components/category_spec.js index 82dc0cdc250..b72aa659d56 100644 --- a/spec/frontend/emoji/components/category_spec.js +++ b/spec/frontend/emoji/components/category_spec.js @@ -30,19 +30,19 @@ describe('Emoji category component', () => { // eslint-disable-next-line no-restricted-syntax await wrapper.setData({ renderGroup: true }); - expect(wrapper.find(EmojiGroup).attributes('rendergroup')).toBe('true'); + expect(wrapper.findComponent(EmojiGroup).attributes('rendergroup')).toBe('true'); }); it('renders group on appear', async () => { - wrapper.find(GlIntersectionObserver).vm.$emit('appear'); + wrapper.findComponent(GlIntersectionObserver).vm.$emit('appear'); await nextTick(); - expect(wrapper.find(EmojiGroup).attributes('rendergroup')).toBe('true'); + expect(wrapper.findComponent(EmojiGroup).attributes('rendergroup')).toBe('true'); }); it('emits appear event on appear', async () => { - wrapper.find(GlIntersectionObserver).vm.$emit('appear'); + wrapper.findComponent(GlIntersectionObserver).vm.$emit('appear'); await nextTick(); diff --git a/spec/frontend/error_tracking_settings/components/app_spec.js b/spec/frontend/error_tracking_settings/components/app_spec.js index a1b9a1fc7eb..7a714cc1ebc 100644 --- a/spec/frontend/error_tracking_settings/components/app_spec.js +++ b/spec/frontend/error_tracking_settings/components/app_spec.js @@ -76,8 +76,8 @@ describe('error tracking settings app', () => { describe('section', () => { it('renders the form and dropdown', () => { - expect(wrapper.find(ErrorTrackingForm).exists()).toBe(true); - expect(wrapper.find(ProjectDropdown).exists()).toBe(true); + expect(wrapper.findComponent(ErrorTrackingForm).exists()).toBe(true); + expect(wrapper.findComponent(ProjectDropdown).exists()).toBe(true); }); it('renders the Save Changes button', () => { diff --git a/spec/frontend/error_tracking_settings/components/project_dropdown_spec.js b/spec/frontend/error_tracking_settings/components/project_dropdown_spec.js index b44af547658..d210f15ea6f 100644 --- a/spec/frontend/error_tracking_settings/components/project_dropdown_spec.js +++ b/spec/frontend/error_tracking_settings/components/project_dropdown_spec.js @@ -42,7 +42,7 @@ describe('error tracking settings project dropdown', () => { describe('empty project list', () => { it('renders the dropdown', () => { expect(wrapper.find('#project-dropdown').exists()).toBe(true); - expect(wrapper.find(GlDropdown).exists()).toBe(true); + expect(wrapper.findComponent(GlDropdown).exists()).toBe(true); }); it('shows helper text', () => { @@ -57,8 +57,8 @@ describe('error tracking settings project dropdown', () => { }); it('does not contain any dropdown items', () => { - expect(wrapper.find(GlDropdownItem).exists()).toBe(false); - expect(wrapper.find(GlDropdown).props('text')).toBe('No projects available'); + expect(wrapper.findComponent(GlDropdownItem).exists()).toBe(false); + expect(wrapper.findComponent(GlDropdown).props('text')).toBe('No projects available'); }); }); @@ -71,11 +71,11 @@ describe('error tracking settings project dropdown', () => { it('renders the dropdown', () => { expect(wrapper.find('#project-dropdown').exists()).toBe(true); - expect(wrapper.find(GlDropdown).exists()).toBe(true); + expect(wrapper.findComponent(GlDropdown).exists()).toBe(true); }); it('contains a number of dropdown items', () => { - expect(wrapper.find(GlDropdownItem).exists()).toBe(true); + expect(wrapper.findComponent(GlDropdownItem).exists()).toBe(true); expect(wrapper.findAll(GlDropdownItem).length).toBe(2); }); }); diff --git a/spec/frontend/filtered_search/components/recent_searches_dropdown_content_spec.js b/spec/frontend/filtered_search/components/recent_searches_dropdown_content_spec.js index 897ad5ee2bf..878cf5ed43b 100644 --- a/spec/frontend/filtered_search/components/recent_searches_dropdown_content_spec.js +++ b/spec/frontend/filtered_search/components/recent_searches_dropdown_content_spec.js @@ -6,9 +6,9 @@ import IssuableFilteredSearchTokenKeys from '~/filtered_search/issuable_filtered describe('Recent Searches Dropdown Content', () => { let wrapper; - const findLocalStorageNote = () => wrapper.find({ ref: 'localStorageNote' }); + const findLocalStorageNote = () => wrapper.findComponent({ ref: 'localStorageNote' }); const findDropdownItems = () => wrapper.findAll({ ref: 'dropdownItem' }); - const findDropdownNote = () => wrapper.find({ ref: 'dropdownNote' }); + const findDropdownNote = () => wrapper.findComponent({ ref: 'dropdownNote' }); const createComponent = (props) => { wrapper = shallowMount(RecentSearchesDropdownContent, { @@ -94,7 +94,7 @@ describe('Recent Searches Dropdown Content', () => { }); it('emits requestClearRecentSearches on Clear resent searches button', () => { - wrapper.find({ ref: 'clearButton' }).trigger('click'); + wrapper.findComponent({ ref: 'clearButton' }).trigger('click'); expect(onRequestClearRecentSearchesSpy).toHaveBeenCalled(); }); diff --git a/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js b/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js index eef5dc86c1a..85e5e2273a5 100644 --- a/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js +++ b/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js @@ -16,10 +16,10 @@ describe('FrequentItemsListItemComponent', () => { let trackingSpy; let store; - const findTitle = () => wrapper.find({ ref: 'frequentItemsItemTitle' }); + const findTitle = () => wrapper.findComponent({ ref: 'frequentItemsItemTitle' }); const findAvatar = () => wrapper.findComponent(ProjectAvatar); const findAllTitles = () => wrapper.findAll({ ref: 'frequentItemsItemTitle' }); - const findNamespace = () => wrapper.find({ ref: 'frequentItemsItemNamespace' }); + const findNamespace = () => wrapper.findComponent({ ref: 'frequentItemsItemNamespace' }); const findAllButtons = () => wrapper.findAllComponents(GlButton); const findAllNamespace = () => wrapper.findAll({ ref: 'frequentItemsItemNamespace' }); const findAllAvatars = () => wrapper.findAllComponents(ProjectAvatar); diff --git a/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js index d0a4cf70f5f..94fc97b82c2 100644 --- a/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js +++ b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js @@ -23,7 +23,7 @@ describe('FrequentItemsSearchInputComponent', () => { }, }); - const findSearchBoxByType = () => wrapper.find(GlSearchBoxByType); + const findSearchBoxByType = () => wrapper.findComponent(GlSearchBoxByType); beforeEach(() => { store = createStore(); diff --git a/spec/frontend/import_entities/components/group_dropdown_spec.js b/spec/frontend/import_entities/components/group_dropdown_spec.js index 1c1e1e7ebd4..b896437ecb2 100644 --- a/spec/frontend/import_entities/components/group_dropdown_spec.js +++ b/spec/frontend/import_entities/components/group_dropdown_spec.js @@ -42,7 +42,7 @@ describe('Import entities group dropdown component', () => { createComponent({ namespaces }); namespacesTracker.mockReset(); - wrapper.find(GlSearchBoxByType).vm.$emit('input', 'match'); + wrapper.findComponent(GlSearchBoxByType).vm.$emit('input', 'match'); await nextTick(); diff --git a/spec/frontend/import_entities/import_groups/components/import_table_spec.js b/spec/frontend/import_entities/import_groups/components/import_table_spec.js index cdc508a0033..f97ea046cbe 100644 --- a/spec/frontend/import_entities/import_groups/components/import_table_spec.js +++ b/spec/frontend/import_entities/import_groups/components/import_table_spec.js @@ -99,7 +99,7 @@ describe('import table', () => { }); await waitForPromises(); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); }); it('does not renders loading icon when request is completed', async () => { @@ -108,7 +108,7 @@ describe('import table', () => { }); await waitForPromises(); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); }); }); @@ -123,7 +123,7 @@ describe('import table', () => { }); await waitForPromises(); - expect(wrapper.find(GlEmptyState).props().title).toBe(i18n.NO_GROUPS_FOUND); + expect(wrapper.findComponent(GlEmptyState).props().title).toBe(i18n.NO_GROUPS_FOUND); }); }); @@ -268,7 +268,7 @@ describe('import table', () => { }); it('correctly passes pagination info from query', () => { - expect(wrapper.find(PaginationLinks).props().pageInfo).toStrictEqual(FAKE_PAGE_INFO); + expect(wrapper.findComponent(PaginationLinks).props().pageInfo).toStrictEqual(FAKE_PAGE_INFO); }); it('renders pagination dropdown', () => { @@ -293,7 +293,7 @@ describe('import table', () => { it('updates page when page change is requested', async () => { const REQUESTED_PAGE = 2; - wrapper.find(PaginationLinks).props().change(REQUESTED_PAGE); + wrapper.findComponent(PaginationLinks).props().change(REQUESTED_PAGE); await waitForPromises(); expect(bulkImportSourceGroupsQueryMock).toHaveBeenCalledWith( @@ -316,7 +316,7 @@ describe('import table', () => { }, versionValidation: FAKE_VERSION_VALIDATION, }); - wrapper.find(PaginationLinks).props().change(REQUESTED_PAGE); + wrapper.findComponent(PaginationLinks).props().change(REQUESTED_PAGE); await waitForPromises(); expect(wrapper.text()).toContain('Showing 21-21 of 38 groups that you own from'); @@ -539,8 +539,8 @@ describe('import table', () => { }); await waitForPromises(); - expect(wrapper.find(GlAlert).exists()).toBe(true); - expect(wrapper.find(GlAlert).text()).toContain('projects (require v14.8.0)'); + expect(wrapper.findComponent(GlAlert).exists()).toBe(true); + expect(wrapper.findComponent(GlAlert).text()).toContain('projects (require v14.8.0)'); }); it('does not renders alert when there are no unavailable features', async () => { @@ -558,7 +558,7 @@ describe('import table', () => { }); await waitForPromises(); - expect(wrapper.find(GlAlert).exists()).toBe(false); + expect(wrapper.findComponent(GlAlert).exists()).toBe(false); }); }); }); diff --git a/spec/frontend/import_entities/import_groups/components/import_target_cell_spec.js b/spec/frontend/import_entities/import_groups/components/import_target_cell_spec.js index d3f86672f33..18dc1217fec 100644 --- a/spec/frontend/import_entities/import_groups/components/import_target_cell_spec.js +++ b/spec/frontend/import_entities/import_groups/components/import_target_cell_spec.js @@ -22,8 +22,8 @@ describe('import target cell', () => { let wrapper; let group; - const findNameInput = () => wrapper.find(GlFormInput); - const findNamespaceDropdown = () => wrapper.find(ImportGroupDropdown); + const findNameInput = () => wrapper.findComponent(GlFormInput); + const findNamespaceDropdown = () => wrapper.findComponent(ImportGroupDropdown); const createComponent = (props) => { wrapper = shallowMount(ImportTargetCell, { diff --git a/spec/frontend/import_entities/import_projects/components/bitbucket_status_table_spec.js b/spec/frontend/import_entities/import_projects/components/bitbucket_status_table_spec.js index ea88c361f7b..9eae4ed974e 100644 --- a/spec/frontend/import_entities/import_projects/components/bitbucket_status_table_spec.js +++ b/spec/frontend/import_entities/import_projects/components/bitbucket_status_table_spec.js @@ -33,12 +33,12 @@ describe('BitbucketStatusTable', () => { it('renders import table component', () => { createComponent({ providerTitle: 'Test' }); - expect(wrapper.find(ImportProjectsTable).exists()).toBe(true); + expect(wrapper.findComponent(ImportProjectsTable).exists()).toBe(true); }); it('passes alert in incompatible-repos-warning slot', () => { createComponent({ providerTitle: 'Test' }, ImportProjectsTableStub); - expect(wrapper.find(GlAlert).exists()).toBe(true); + expect(wrapper.findComponent(GlAlert).exists()).toBe(true); }); it('passes actions slot to import project table component', () => { @@ -46,14 +46,14 @@ describe('BitbucketStatusTable', () => { createComponent({ providerTitle: 'Test' }, ImportProjectsTableStub, { actions: actionsSlotContent, }); - expect(wrapper.find(ImportProjectsTable).text()).toBe(actionsSlotContent); + expect(wrapper.findComponent(ImportProjectsTable).text()).toBe(actionsSlotContent); }); it('dismisses alert when requested', async () => { createComponent({ providerTitle: 'Test' }, ImportProjectsTableStub); - wrapper.find(GlAlert).vm.$emit('dismiss'); + wrapper.findComponent(GlAlert).vm.$emit('dismiss'); await nextTick(); - expect(wrapper.find(GlAlert).exists()).toBe(false); + expect(wrapper.findComponent(GlAlert).exists()).toBe(false); }); }); diff --git a/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js b/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js index 140fec3863b..8060fb9af7f 100644 --- a/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js +++ b/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js @@ -33,7 +33,7 @@ describe('ImportProjectsTable', () => { .findAll(GlButton) .filter((w) => w.props().variant === 'confirm') .at(0); - const findImportAllModal = () => wrapper.find({ ref: 'importAllModal' }); + const findImportAllModal = () => wrapper.findComponent({ ref: 'importAllModal' }); const importAllFn = jest.fn(); const importAllModalShowFn = jest.fn(); @@ -89,13 +89,13 @@ describe('ImportProjectsTable', () => { it('renders a loading icon while repos are loading', () => { createComponent({ state: { isLoadingRepos: true } }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); }); it('renders a loading icon while namespaces are loading', () => { createComponent({ state: { isLoadingNamespaces: true } }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); }); it('renders a table with provider repos', () => { @@ -109,7 +109,7 @@ describe('ImportProjectsTable', () => { state: { namespaces: [{ fullPath: 'path' }], repositories }, }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); expect(wrapper.find('table').exists()).toBe(true); expect( wrapper @@ -170,7 +170,7 @@ describe('ImportProjectsTable', () => { it('renders an empty state if there are no repositories available', () => { createComponent({ state: { repositories: [] } }); - expect(wrapper.find(ProviderRepoTableRow).exists()).toBe(false); + expect(wrapper.findComponent(ProviderRepoTableRow).exists()).toBe(false); expect(wrapper.text()).toContain(`No ${providerTitle} repositories found`); }); @@ -231,11 +231,11 @@ describe('ImportProjectsTable', () => { }); it('renders intersection observer component', () => { - expect(wrapper.find(GlIntersectionObserver).exists()).toBe(true); + expect(wrapper.findComponent(GlIntersectionObserver).exists()).toBe(true); }); it('calls fetchRepos when intersection observer appears', async () => { - wrapper.find(GlIntersectionObserver).vm.$emit('appear'); + wrapper.findComponent(GlIntersectionObserver).vm.$emit('appear'); await nextTick(); diff --git a/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js b/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js index 41a005199e1..17a07b1e9f9 100644 --- a/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js +++ b/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js @@ -74,11 +74,13 @@ describe('ProviderRepoTableRow', () => { }); it('renders empty import status', () => { - expect(wrapper.find(ImportStatus).props().status).toBe(STATUSES.NONE); + expect(wrapper.findComponent(ImportStatus).props().status).toBe(STATUSES.NONE); }); it('renders a group namespace select', () => { - expect(wrapper.find(ImportGroupDropdown).props().namespaces).toBe(availableNamespaces); + expect(wrapper.findComponent(ImportGroupDropdown).props().namespaces).toBe( + availableNamespaces, + ); }); it('renders import button', () => { @@ -127,11 +129,13 @@ describe('ProviderRepoTableRow', () => { }); it('renders proper import status', () => { - expect(wrapper.find(ImportStatus).props().status).toBe(repo.importedProject.importStatus); + expect(wrapper.findComponent(ImportStatus).props().status).toBe( + repo.importedProject.importStatus, + ); }); it('does not renders a namespace select', () => { - expect(wrapper.find(GlDropdown).exists()).toBe(false); + expect(wrapper.findComponent(GlDropdown).exists()).toBe(false); }); it('does not render import button', () => { @@ -139,7 +143,7 @@ describe('ProviderRepoTableRow', () => { }); it('passes stats to import status component', () => { - expect(wrapper.find(ImportStatus).props().stats).toBe(FAKE_STATS); + expect(wrapper.findComponent(ImportStatus).props().stats).toBe(FAKE_STATS); }); }); @@ -165,7 +169,7 @@ describe('ProviderRepoTableRow', () => { }); it('renders badge with error', () => { - expect(wrapper.find(GlBadge).text()).toBe('Incompatible project'); + expect(wrapper.findComponent(GlBadge).text()).toBe('Incompatible project'); }); }); }); diff --git a/spec/frontend/incidents/components/incidents_list_spec.js b/spec/frontend/incidents/components/incidents_list_spec.js index 356480f931e..5f71fde934f 100644 --- a/spec/frontend/incidents/components/incidents_list_spec.js +++ b/spec/frontend/incidents/components/incidents_list_spec.js @@ -40,15 +40,15 @@ describe('Incidents List', () => { all: 26, }; - const findTable = () => wrapper.find(GlTable); + const findTable = () => wrapper.findComponent(GlTable); const findTableRows = () => wrapper.findAll('table tbody tr'); - const findAlert = () => wrapper.find(GlAlert); - const findLoader = () => wrapper.find(GlLoadingIcon); + const findAlert = () => wrapper.findComponent(GlAlert); + const findLoader = () => wrapper.findComponent(GlLoadingIcon); const findTimeAgo = () => wrapper.findAll(TimeAgoTooltip); const findAssignees = () => wrapper.findAll('[data-testid="incident-assignees"]'); const findCreateIncidentBtn = () => wrapper.find('[data-testid="createIncidentBtn"]'); const findClosedIcon = () => wrapper.findAll("[data-testid='incident-closed']"); - const findEmptyState = () => wrapper.find(GlEmptyState); + const findEmptyState = () => wrapper.findComponent(GlEmptyState); const findSeverity = () => wrapper.findAll(SeverityToken); const findEscalationStatus = () => wrapper.findAll('[data-testid="incident-escalation-status"]'); const findIncidentLink = () => wrapper.findByTestId('incident-link'); @@ -179,7 +179,7 @@ describe('Incidents List', () => { }); it('renders an avatar component when there is an assignee', () => { - const avatar = findAssignees().at(1).find(GlAvatar); + const avatar = findAssignees().at(1).findComponent(GlAvatar); const { src, label } = avatar.attributes(); const { name, avatarUrl } = mockIncidents[1].assignees.nodes[0]; diff --git a/spec/frontend/incidents_settings/components/incidents_settings_tabs_spec.js b/spec/frontend/incidents_settings/components/incidents_settings_tabs_spec.js index ff40f1fa008..e0ebebf1c7d 100644 --- a/spec/frontend/incidents_settings/components/incidents_settings_tabs_spec.js +++ b/spec/frontend/incidents_settings/components/incidents_settings_tabs_spec.js @@ -20,8 +20,8 @@ describe('IncidentsSettingTabs', () => { } }); - const findToggleButton = () => wrapper.find({ ref: 'toggleBtn' }); - const findSectionHeader = () => wrapper.find({ ref: 'sectionHeader' }); + const findToggleButton = () => wrapper.findComponent({ ref: 'toggleBtn' }); + const findSectionHeader = () => wrapper.findComponent({ ref: 'sectionHeader' }); const findIntegrationTabs = () => wrapper.findAll(GlTab); it('renders header text', () => { diff --git a/spec/frontend/integrations/edit/components/trigger_fields_spec.js b/spec/frontend/integrations/edit/components/trigger_fields_spec.js index 8ee55928926..e13fd39999b 100644 --- a/spec/frontend/integrations/edit/components/trigger_fields_spec.js +++ b/spec/frontend/integrations/edit/components/trigger_fields_spec.js @@ -86,7 +86,7 @@ describe('TriggerFields', () => { expect(checkboxes).toHaveLength(2); checkboxes.wrappers.forEach((checkbox, index) => { - const checkBox = checkbox.find(GlFormCheckbox); + const checkBox = checkbox.findComponent(GlFormCheckbox); expect(checkbox.find('label').text()).toBe(expectedResults[index].labelText); expect(checkbox.find('[type=hidden]').attributes('name')).toBe( diff --git a/spec/frontend/invite_members/components/import_project_members_modal_spec.js b/spec/frontend/invite_members/components/import_project_members_modal_spec.js index b4d42d90d99..8b2d13be309 100644 --- a/spec/frontend/invite_members/components/import_project_members_modal_spec.js +++ b/spec/frontend/invite_members/components/import_project_members_modal_spec.js @@ -53,7 +53,7 @@ afterEach(() => { describe('ImportProjectMembersModal', () => { const findGlModal = () => wrapper.findComponent(GlModal); - const findIntroText = () => wrapper.find({ ref: 'modalIntro' }).text(); + const findIntroText = () => wrapper.findComponent({ ref: 'modalIntro' }).text(); const clickImportButton = () => findGlModal().vm.$emit('primary', { preventDefault: jest.fn() }); const closeModal = () => findGlModal().vm.$emit('hidden', { preventDefault: jest.fn() }); const findFormGroup = () => wrapper.findByTestId('form-group'); diff --git a/spec/frontend/issuable/components/issue_milestone_spec.js b/spec/frontend/issuable/components/issue_milestone_spec.js index 9d67f602136..eac53c5f761 100644 --- a/spec/frontend/issuable/components/issue_milestone_spec.js +++ b/spec/frontend/issuable/components/issue_milestone_spec.js @@ -144,7 +144,7 @@ describe('IssueMilestoneComponent', () => { }); it('renders milestone icon', () => { - expect(wrapper.find(GlIcon).props('name')).toBe('clock'); + expect(wrapper.findComponent(GlIcon).props('name')).toBe('clock'); }); it('renders milestone title', () => { diff --git a/spec/frontend/issuable/related_issues/components/issue_token_spec.js b/spec/frontend/issuable/related_issues/components/issue_token_spec.js index d6aeacfe07a..bacebbade7f 100644 --- a/spec/frontend/issuable/related_issues/components/issue_token_spec.js +++ b/spec/frontend/issuable/related_issues/components/issue_token_spec.js @@ -31,11 +31,11 @@ describe('IssueToken', () => { } }); - const findLink = () => wrapper.find({ ref: 'link' }); - const findReference = () => wrapper.find({ ref: 'reference' }); + const findLink = () => wrapper.findComponent({ ref: 'link' }); + const findReference = () => wrapper.findComponent({ ref: 'reference' }); const findReferenceIcon = () => wrapper.find('[data-testid="referenceIcon"]'); const findRemoveBtn = () => wrapper.find('[data-testid="removeBtn"]'); - const findTitle = () => wrapper.find({ ref: 'title' }); + const findTitle = () => wrapper.findComponent({ ref: 'title' }); describe('with reference supplied', () => { beforeEach(() => { diff --git a/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js b/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js index 772cc75a205..1b2935ce5d1 100644 --- a/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js +++ b/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js @@ -153,7 +153,7 @@ describe('RelatedIssuesBlock', () => { }); it('sets `autoCompleteEpics` to false for add-issuable-form', () => { - expect(wrapper.find(AddIssuableForm).props('autoCompleteEpics')).toBe(false); + expect(wrapper.findComponent(AddIssuableForm).props('autoCompleteEpics')).toBe(false); }); }); @@ -227,7 +227,7 @@ describe('RelatedIssuesBlock', () => { }, }); - const iconComponent = wrapper.find(GlIcon); + const iconComponent = wrapper.findComponent(GlIcon); expect(iconComponent.exists()).toBe(true); expect(iconComponent.props('name')).toBe(icon); }); diff --git a/spec/frontend/issuable/related_issues/components/related_issues_list_spec.js b/spec/frontend/issuable/related_issues/components/related_issues_list_spec.js index fd623ad9a5f..9bb71ec3dcb 100644 --- a/spec/frontend/issuable/related_issues/components/related_issues_list_spec.js +++ b/spec/frontend/issuable/related_issues/components/related_issues_list_spec.js @@ -187,7 +187,9 @@ describe('RelatedIssuesList', () => { }); it('shows due date', () => { - expect(wrapper.find(IssueDueDate).find('.board-card-info-text').text()).toBe('Nov 22, 2010'); + expect(wrapper.findComponent(IssueDueDate).find('.board-card-info-text').text()).toBe( + 'Nov 22, 2010', + ); }); }); }); diff --git a/spec/frontend/issues/list/components/issue_card_time_info_spec.js b/spec/frontend/issues/list/components/issue_card_time_info_spec.js index c3f13ca6f9a..b0d3a63a8cf 100644 --- a/spec/frontend/issues/list/components/issue_card_time_info_spec.js +++ b/spec/frontend/issues/list/components/issue_card_time_info_spec.js @@ -21,7 +21,7 @@ describe('CE IssueCardTimeInfo component', () => { }; const findMilestone = () => wrapper.find('[data-testid="issuable-milestone"]'); - const findMilestoneTitle = () => findMilestone().find(GlLink).attributes('title'); + const findMilestoneTitle = () => findMilestone().findComponent(GlLink).attributes('title'); const findDueDate = () => wrapper.find('[data-testid="issuable-due-date"]'); const mountComponent = ({ @@ -56,8 +56,8 @@ describe('CE IssueCardTimeInfo component', () => { const milestone = findMilestone(); expect(milestone.text()).toBe(issue.milestone.title); - expect(milestone.find(GlIcon).props('name')).toBe('clock'); - expect(milestone.find(GlLink).attributes('href')).toBe(issue.milestone.webPath); + expect(milestone.findComponent(GlIcon).props('name')).toBe('clock'); + expect(milestone.findComponent(GlLink).attributes('href')).toBe(issue.milestone.webPath); }); describe.each` @@ -84,7 +84,7 @@ describe('CE IssueCardTimeInfo component', () => { expect(dueDate.text()).toBe('Dec 12, 2020'); expect(dueDate.attributes('title')).toBe('Due date'); - expect(dueDate.find(GlIcon).props('name')).toBe('calendar'); + expect(dueDate.findComponent(GlIcon).props('name')).toBe('calendar'); expect(dueDate.classes()).not.toContain('gl-text-red-500'); }); }); @@ -118,6 +118,6 @@ describe('CE IssueCardTimeInfo component', () => { expect(timeEstimate.text()).toBe(issue.humanTimeEstimate); expect(timeEstimate.attributes('title')).toBe('Estimate'); - expect(timeEstimate.find(GlIcon).props('name')).toBe('timer'); + expect(timeEstimate.findComponent(GlIcon).props('name')).toBe('timer'); }); }); diff --git a/spec/frontend/issues/list/components/jira_issues_import_status_app_spec.js b/spec/frontend/issues/list/components/jira_issues_import_status_app_spec.js index 2d773e8bf56..406b1fbc1af 100644 --- a/spec/frontend/issues/list/components/jira_issues_import_status_app_spec.js +++ b/spec/frontend/issues/list/components/jira_issues_import_status_app_spec.js @@ -11,9 +11,9 @@ describe('JiraIssuesImportStatus', () => { }; let wrapper; - const findAlert = () => wrapper.find(GlAlert); + const findAlert = () => wrapper.findComponent(GlAlert); - const findAlertLabel = () => wrapper.find(GlAlert).find(GlLabel); + const findAlertLabel = () => wrapper.findComponent(GlAlert).findComponent(GlLabel); const mountComponent = ({ shouldShowFinishedAlert = false, @@ -49,7 +49,7 @@ describe('JiraIssuesImportStatus', () => { }); it('does not show an alert', () => { - expect(wrapper.find(GlAlert).exists()).toBe(false); + expect(wrapper.findComponent(GlAlert).exists()).toBe(false); }); }); @@ -105,12 +105,12 @@ describe('JiraIssuesImportStatus', () => { shouldShowInProgressAlert: true, }); - expect(wrapper.find(GlAlert).exists()).toBe(true); + expect(wrapper.findComponent(GlAlert).exists()).toBe(true); findAlert().vm.$emit('dismiss'); await nextTick(); - expect(wrapper.find(GlAlert).exists()).toBe(false); + expect(wrapper.findComponent(GlAlert).exists()).toBe(false); }); }); }); diff --git a/spec/frontend/issues/new/components/title_suggestions_item_spec.js b/spec/frontend/issues/new/components/title_suggestions_item_spec.js index 5eb30b52de5..eee6804528f 100644 --- a/spec/frontend/issues/new/components/title_suggestions_item_spec.js +++ b/spec/frontend/issues/new/components/title_suggestions_item_spec.js @@ -105,7 +105,7 @@ describe('Issue title suggestions item component', () => { const count = wrapper.findAll('.suggestion-counts span').at(0); expect(count.text()).toContain('1'); - expect(count.find(GlIcon).props('name')).toBe('thumb-up'); + expect(count.findComponent(GlIcon).props('name')).toBe('thumb-up'); }); it('renders notes count', () => { @@ -114,7 +114,7 @@ describe('Issue title suggestions item component', () => { const count = wrapper.findAll('.suggestion-counts span').at(1); expect(count.text()).toContain('2'); - expect(count.find(GlIcon).props('name')).toBe('comment'); + expect(count.findComponent(GlIcon).props('name')).toBe('comment'); }); }); diff --git a/spec/frontend/issues/show/components/app_spec.js b/spec/frontend/issues/show/components/app_spec.js index 12f9707da04..3d027e2084c 100644 --- a/spec/frontend/issues/show/components/app_spec.js +++ b/spec/frontend/issues/show/components/app_spec.js @@ -461,7 +461,7 @@ describe('Issuable output', () => { describe('when title is not in view', () => { beforeEach(() => { wrapper.vm.state.titleText = 'Sticky header title'; - wrapper.find(GlIntersectionObserver).vm.$emit('disappear'); + wrapper.findComponent(GlIntersectionObserver).vm.$emit('disappear'); }); it('shows with title', () => { diff --git a/spec/frontend/issues/show/components/fields/description_spec.js b/spec/frontend/issues/show/components/fields/description_spec.js index d0e33f0b980..61433607a2b 100644 --- a/spec/frontend/issues/show/components/fields/description_spec.js +++ b/spec/frontend/issues/show/components/fields/description_spec.js @@ -6,7 +6,7 @@ import MarkdownField from '~/vue_shared/components/markdown/field.vue'; describe('Description field component', () => { let wrapper; - const findTextarea = () => wrapper.find({ ref: 'textarea' }); + const findTextarea = () => wrapper.findComponent({ ref: 'textarea' }); const mountComponent = (description = 'test') => shallowMount(DescriptionField, { diff --git a/spec/frontend/issues/show/components/fields/title_spec.js b/spec/frontend/issues/show/components/fields/title_spec.js index de04405d89b..a5fa96d8d64 100644 --- a/spec/frontend/issues/show/components/fields/title_spec.js +++ b/spec/frontend/issues/show/components/fields/title_spec.js @@ -5,7 +5,7 @@ import eventHub from '~/issues/show/event_hub'; describe('Title field component', () => { let wrapper; - const findInput = () => wrapper.find({ ref: 'input' }); + const findInput = () => wrapper.findComponent({ ref: 'input' }); beforeEach(() => { jest.spyOn(eventHub, '$emit'); diff --git a/spec/frontend/issues/show/components/header_actions_spec.js b/spec/frontend/issues/show/components/header_actions_spec.js index 329c4234f30..d7fa1fa41da 100644 --- a/spec/frontend/issues/show/components/header_actions_spec.js +++ b/spec/frontend/issues/show/components/header_actions_spec.js @@ -65,7 +65,7 @@ describe('HeaderActions component', () => { }, }; - const findToggleIssueStateButton = () => wrapper.find(GlButton); + const findToggleIssueStateButton = () => wrapper.findComponent(GlButton); const findDropdownBy = (dataTestId) => wrapper.find(`[data-testid="${dataTestId}"]`); const findMobileDropdown = () => findDropdownBy('mobile-dropdown'); @@ -73,7 +73,7 @@ describe('HeaderActions component', () => { const findMobileDropdownItems = () => findMobileDropdown().findAll(GlDropdownItem); const findDesktopDropdownItems = () => findDesktopDropdown().findAll(GlDropdownItem); - const findModal = () => wrapper.find(GlModal); + const findModal = () => wrapper.findComponent(GlModal); const findModalLinkAt = (index) => findModal().findAll(GlLink).at(index); diff --git a/spec/frontend/issues/show/components/incidents/highlight_bar_spec.js b/spec/frontend/issues/show/components/incidents/highlight_bar_spec.js index 155ae703e48..1cfb7d12a91 100644 --- a/spec/frontend/issues/show/components/incidents/highlight_bar_spec.js +++ b/spec/frontend/issues/show/components/incidents/highlight_bar_spec.js @@ -41,7 +41,7 @@ describe('Highlight Bar', () => { } }); - const findLink = () => wrapper.find(GlLink); + const findLink = () => wrapper.findComponent(GlLink); describe('empty state', () => { beforeEach(() => { diff --git a/spec/frontend/issues/show/components/incidents/incident_tabs_spec.js b/spec/frontend/issues/show/components/incidents/incident_tabs_spec.js index 8e090645be2..6960eb1416e 100644 --- a/spec/frontend/issues/show/components/incidents/incident_tabs_spec.js +++ b/spec/frontend/issues/show/components/incidents/incident_tabs_spec.js @@ -64,9 +64,9 @@ describe('Incident Tabs component', () => { const findTabs = () => wrapper.findAll(GlTab); const findSummaryTab = () => findTabs().at(0); const findAlertDetailsTab = () => wrapper.find('[data-testid="alert-details-tab"]'); - const findAlertDetailsComponent = () => wrapper.find(AlertDetailsTable); - const findDescriptionComponent = () => wrapper.find(DescriptionComponent); - const findHighlightBarComponent = () => wrapper.find(HighlightBar); + const findAlertDetailsComponent = () => wrapper.findComponent(AlertDetailsTable); + const findDescriptionComponent = () => wrapper.findComponent(DescriptionComponent); + const findHighlightBarComponent = () => wrapper.findComponent(HighlightBar); const findTimelineTab = () => wrapper.findComponent(TimelineTab); describe('empty state', () => { diff --git a/spec/frontend/issues/show/components/sentry_error_stack_trace_spec.js b/spec/frontend/issues/show/components/sentry_error_stack_trace_spec.js index b38d2b60057..d4202f4a6ab 100644 --- a/spec/frontend/issues/show/components/sentry_error_stack_trace_spec.js +++ b/spec/frontend/issues/show/components/sentry_error_stack_trace_spec.js @@ -62,8 +62,8 @@ describe('Sentry Error Stack Trace', () => { describe('loading', () => { it('should show spinner while loading', () => { mountComponent(); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); - expect(wrapper.find(Stacktrace).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(Stacktrace).exists()).toBe(false); }); }); @@ -74,8 +74,8 @@ describe('Sentry Error Stack Trace', () => { it('should show stacktrace', () => { mountComponent({ stubs: {} }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); - expect(wrapper.find(Stacktrace).exists()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(Stacktrace).exists()).toBe(true); }); }); }); diff --git a/spec/frontend/jira_import/components/jira_import_app_spec.js b/spec/frontend/jira_import/components/jira_import_app_spec.js index cd8024d4962..022a0f81aaa 100644 --- a/spec/frontend/jira_import/components/jira_import_app_spec.js +++ b/spec/frontend/jira_import/components/jira_import_app_spec.js @@ -21,15 +21,15 @@ describe('JiraImportApp', () => { const setupIllustration = 'setup-illustration.svg'; - const getFormComponent = () => wrapper.find(JiraImportForm); + const getFormComponent = () => wrapper.findComponent(JiraImportForm); - const getProgressComponent = () => wrapper.find(JiraImportProgress); + const getProgressComponent = () => wrapper.findComponent(JiraImportProgress); - const getSetupComponent = () => wrapper.find(JiraImportSetup); + const getSetupComponent = () => wrapper.findComponent(JiraImportSetup); - const getAlert = () => wrapper.find(GlAlert); + const getAlert = () => wrapper.findComponent(GlAlert); - const getLoadingIcon = () => wrapper.find(GlLoadingIcon); + const getLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); const mountComponent = ({ isJiraConfigured = true, diff --git a/spec/frontend/jira_import/components/jira_import_form_spec.js b/spec/frontend/jira_import/components/jira_import_form_spec.js index 41d3cd46d01..783ecec14a2 100644 --- a/spec/frontend/jira_import/components/jira_import_form_spec.js +++ b/spec/frontend/jira_import/components/jira_import_form_spec.js @@ -289,7 +289,7 @@ describe('JiraImportForm', () => { it('updates the user list', () => { expect(getUserDropdown().findAll(GlDropdownItem)).toHaveLength(1); - expect(getUserDropdown().find(GlDropdownItem).text()).toContain( + expect(getUserDropdown().findComponent(GlDropdownItem).text()).toContain( 'fchopin (Frederic Chopin)', ); }); diff --git a/spec/frontend/jira_import/components/jira_import_progress_spec.js b/spec/frontend/jira_import/components/jira_import_progress_spec.js index 04b2a2da622..42356763492 100644 --- a/spec/frontend/jira_import/components/jira_import_progress_spec.js +++ b/spec/frontend/jira_import/components/jira_import_progress_spec.js @@ -8,7 +8,7 @@ describe('JiraImportProgress', () => { const importProject = 'JIRAPROJECT'; - const getGlEmptyStateProp = (attribute) => wrapper.find(GlEmptyState).props(attribute); + const getGlEmptyStateProp = (attribute) => wrapper.findComponent(GlEmptyState).props(attribute); const getParagraphText = () => wrapper.find('p').text(); diff --git a/spec/frontend/jira_import/components/jira_import_setup_spec.js b/spec/frontend/jira_import/components/jira_import_setup_spec.js index 320e270b493..0085a2b5572 100644 --- a/spec/frontend/jira_import/components/jira_import_setup_spec.js +++ b/spec/frontend/jira_import/components/jira_import_setup_spec.js @@ -6,7 +6,7 @@ import { illustration, jiraIntegrationPath } from '../mock_data'; describe('JiraImportSetup', () => { let wrapper; - const getGlEmptyStateProp = (attribute) => wrapper.find(GlEmptyState).props(attribute); + const getGlEmptyStateProp = (attribute) => wrapper.findComponent(GlEmptyState).props(attribute); beforeEach(() => { wrapper = shallowMount(JiraImportSetup, { diff --git a/spec/frontend/labels/components/delete_label_modal_spec.js b/spec/frontend/labels/components/delete_label_modal_spec.js index 6204138f885..24a803d3f16 100644 --- a/spec/frontend/labels/components/delete_label_modal_spec.js +++ b/spec/frontend/labels/components/delete_label_modal_spec.js @@ -34,7 +34,7 @@ describe('~/labels/components/delete_label_modal', () => { wrapper.destroy(); }); - const findModal = () => wrapper.find(GlModal); + const findModal = () => wrapper.findComponent(GlModal); const findPrimaryModalButton = () => wrapper.findByTestId('delete-button'); describe('template', () => { diff --git a/spec/frontend/members/components/avatars/user_avatar_spec.js b/spec/frontend/members/components/avatars/user_avatar_spec.js index 9b908e5b6f0..9172876e76f 100644 --- a/spec/frontend/members/components/avatars/user_avatar_spec.js +++ b/spec/frontend/members/components/avatars/user_avatar_spec.js @@ -1,7 +1,7 @@ import { GlAvatarLink, GlBadge } from '@gitlab/ui'; import { mountExtended } from 'helpers/vue_test_utils_helper'; import UserAvatar from '~/members/components/avatars/user_avatar.vue'; -import { AVAILABILITY_STATUS } from '~/set_status_modal/utils'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; import { member as memberMock, member2faEnabled, orphanedMember } from '../../mock_data'; diff --git a/spec/frontend/merge_conflicts/components/merge_conflict_resolver_app_spec.js b/spec/frontend/merge_conflicts/components/merge_conflict_resolver_app_spec.js index 4fdc4024e10..9b5641ef7b3 100644 --- a/spec/frontend/merge_conflicts/components/merge_conflict_resolver_app_spec.js +++ b/spec/frontend/merge_conflicts/components/merge_conflict_resolver_app_spec.js @@ -49,8 +49,8 @@ describe('Merge Conflict Resolver App', () => { extendedWrapper(w).findByTestId('interactive-button'); const findFileInlineButton = (w = wrapper) => extendedWrapper(w).findByTestId('inline-button'); const findSideBySideButton = () => wrapper.findByTestId('side-by-side'); - const findInlineConflictLines = (w = wrapper) => w.find(InlineConflictLines); - const findParallelConflictLines = (w = wrapper) => w.find(ParallelConflictLines); + const findInlineConflictLines = (w = wrapper) => w.findComponent(InlineConflictLines); + const findParallelConflictLines = (w = wrapper) => w.findComponent(ParallelConflictLines); const findCommitMessageTextarea = () => wrapper.findByTestId('commit-message'); it('shows the amount of conflicts', () => { diff --git a/spec/frontend/milestones/components/milestone_combobox_spec.js b/spec/frontend/milestones/components/milestone_combobox_spec.js index a8e3d13dca0..aee13beacbb 100644 --- a/spec/frontend/milestones/components/milestone_combobox_spec.js +++ b/spec/frontend/milestones/components/milestone_combobox_spec.js @@ -96,9 +96,9 @@ describe('Milestone combobox component', () => { const findNoResults = () => wrapper.find('[data-testid="milestone-combobox-no-results"]'); - const findLoadingIcon = () => wrapper.find(GlLoadingIcon); + const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); - const findSearchBox = () => wrapper.find(GlSearchBoxByType); + const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType); const findProjectMilestonesSection = () => wrapper.find('[data-testid="project-milestones-section"]'); diff --git a/spec/frontend/nav/components/top_nav_dropdown_menu_spec.js b/spec/frontend/nav/components/top_nav_dropdown_menu_spec.js index 6cfbdb16111..048fca846ad 100644 --- a/spec/frontend/nav/components/top_nav_dropdown_menu_spec.js +++ b/spec/frontend/nav/components/top_nav_dropdown_menu_spec.js @@ -25,7 +25,7 @@ describe('~/nav/components/top_nav_dropdown_menu.vue', () => { }; const findMenuItems = () => wrapper.findAllComponents(TopNavMenuItem); - const findMenuSections = () => wrapper.find(TopNavMenuSections); + const findMenuSections = () => wrapper.findComponent(TopNavMenuSections); const findMenuSidebar = () => wrapper.find('[data-testid="menu-sidebar"]'); const findMenuSubview = () => wrapper.findComponent(KeepAliveSlots); const hasFullWidthMenuSidebar = () => findMenuSidebar().classes('gl-w-full'); diff --git a/spec/frontend/nav/components/top_nav_menu_item_spec.js b/spec/frontend/nav/components/top_nav_menu_item_spec.js index a7430d8c73f..b9cf39b8c1d 100644 --- a/spec/frontend/nav/components/top_nav_menu_item_spec.js +++ b/spec/frontend/nav/components/top_nav_menu_item_spec.js @@ -26,7 +26,7 @@ describe('~/nav/components/top_nav_menu_item.vue', () => { }); }; - const findButton = () => wrapper.find(GlButton); + const findButton = () => wrapper.findComponent(GlButton); const findButtonIcons = () => findButton() .findAllComponents(GlIcon) diff --git a/spec/frontend/notebook/cells/output/latex_spec.js b/spec/frontend/notebook/cells/output/latex_spec.js index 848d2069421..ed3b63be50a 100644 --- a/spec/frontend/notebook/cells/output/latex_spec.js +++ b/spec/frontend/notebook/cells/output/latex_spec.js @@ -27,7 +27,7 @@ describe('LaTeX output cell', () => { ${1} | ${false} `('sets `Prompt.show-output` to $expectation when index is $index', ({ index, expectation }) => { const wrapper = createComponent(inlineLatex, index); - const prompt = wrapper.find(Prompt); + const prompt = wrapper.findComponent(Prompt); expect(prompt.props().count).toEqual(count); expect(prompt.props().showOutput).toEqual(expectation); diff --git a/spec/frontend/notes/components/note_header_spec.js b/spec/frontend/notes/components/note_header_spec.js index 8befcc496d6..76177229cff 100644 --- a/spec/frontend/notes/components/note_header_spec.js +++ b/spec/frontend/notes/components/note_header_spec.js @@ -3,7 +3,7 @@ import Vue, { nextTick } from 'vue'; import Vuex from 'vuex'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import NoteHeader from '~/notes/components/note_header.vue'; -import { AVAILABILITY_STATUS } from '~/set_status_modal/utils'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; import UserNameWithStatus from '~/sidebar/components/assignees/user_name_with_status.vue'; Vue.use(Vuex); diff --git a/spec/frontend/notifications/components/custom_notifications_modal_spec.js b/spec/frontend/notifications/components/custom_notifications_modal_spec.js index c5d201c3aec..02de67f788d 100644 --- a/spec/frontend/notifications/components/custom_notifications_modal_spec.js +++ b/spec/frontend/notifications/components/custom_notifications_modal_spec.js @@ -56,7 +56,7 @@ describe('CustomNotificationsModal', () => { ); } - const findModalBodyDescription = () => wrapper.find(GlSprintf); + const findModalBodyDescription = () => wrapper.findComponent(GlSprintf); const findAllCheckboxes = () => wrapper.findAll(GlFormCheckbox); const findCheckboxAt = (index) => findAllCheckboxes().at(index); @@ -111,7 +111,7 @@ describe('CustomNotificationsModal', () => { const checkbox = findCheckboxAt(index); expect(checkbox.text()).toContain(eventName); expect(checkbox.vm.$attrs.checked).toBe(enabled); - expect(checkbox.find(GlLoadingIcon).exists()).toBe(loading); + expect(checkbox.findComponent(GlLoadingIcon).exists()).toBe(loading); }, ); }); @@ -142,7 +142,7 @@ describe('CustomNotificationsModal', () => { wrapper = createComponent({ injectedProperties }); - wrapper.find(GlModal).vm.$emit('show'); + wrapper.findComponent(GlModal).vm.$emit('show'); await waitForPromises(); @@ -159,7 +159,7 @@ describe('CustomNotificationsModal', () => { wrapper = createComponent(); - wrapper.find(GlModal).vm.$emit('show'); + wrapper.findComponent(GlModal).vm.$emit('show'); expect(wrapper.vm.isLoading).toBe(true); await waitForPromises(); @@ -176,7 +176,7 @@ describe('CustomNotificationsModal', () => { mockAxios.onGet('/api/v4/notification_settings').reply(httpStatus.NOT_FOUND, {}); wrapper = createComponent(); - wrapper.find(GlModal).vm.$emit('show'); + wrapper.findComponent(GlModal).vm.$emit('show'); await waitForPromises(); diff --git a/spec/frontend/notifications/components/notifications_dropdown_spec.js b/spec/frontend/notifications/components/notifications_dropdown_spec.js index 7ca6c2052ae..1f950683630 100644 --- a/spec/frontend/notifications/components/notifications_dropdown_spec.js +++ b/spec/frontend/notifications/components/notifications_dropdown_spec.js @@ -40,12 +40,12 @@ describe('NotificationsDropdown', () => { }); } - const findDropdown = () => wrapper.find(GlDropdown); + const findDropdown = () => wrapper.findComponent(GlDropdown); const findByTestId = (testId) => wrapper.find(`[data-testid="${testId}"]`); const findAllNotificationsDropdownItems = () => wrapper.findAll(NotificationsDropdownItem); const findDropdownItemAt = (index) => - findAllNotificationsDropdownItems().at(index).find(GlDropdownItem); - const findNotificationsModal = () => wrapper.find(CustomNotificationsModal); + findAllNotificationsDropdownItems().at(index).findComponent(GlDropdownItem); + const findNotificationsModal = () => wrapper.findComponent(CustomNotificationsModal); const clickDropdownItemAt = async (index) => { const dropdownItem = findDropdownItemAt(index); diff --git a/spec/frontend/operation_settings/components/metrics_settings_spec.js b/spec/frontend/operation_settings/components/metrics_settings_spec.js index 21145466016..810049220ae 100644 --- a/spec/frontend/operation_settings/components/metrics_settings_spec.js +++ b/spec/frontend/operation_settings/components/metrics_settings_spec.js @@ -63,7 +63,7 @@ describe('operation settings external dashboard component', () => { describe('expand/collapse button', () => { it('renders as an expand button by default', () => { mountComponent(); - const button = wrapper.find(GlButton); + const button = wrapper.findComponent(GlButton); expect(button.text()).toBe('Expand'); }); @@ -82,7 +82,7 @@ describe('operation settings external dashboard component', () => { }); it('renders help page link', () => { - const link = subHeader.find(GlLink); + const link = subHeader.findComponent(GlLink); expect(link.text()).toBe('Learn more.'); expect(link.attributes().href).toBe(helpPage); @@ -96,7 +96,7 @@ describe('operation settings external dashboard component', () => { beforeEach(() => { mountComponent(false); - formGroup = wrapper.find(DashboardTimezone).find(GlFormGroup); + formGroup = wrapper.findComponent(DashboardTimezone).findComponent(GlFormGroup); }); it('uses label text', () => { @@ -117,7 +117,7 @@ describe('operation settings external dashboard component', () => { beforeEach(() => { mountComponent(); - select = wrapper.find(DashboardTimezone).find(GlFormSelect); + select = wrapper.findComponent(DashboardTimezone).findComponent(GlFormSelect); }); it('defaults to externalDashboardUrl', () => { @@ -132,7 +132,7 @@ describe('operation settings external dashboard component', () => { beforeEach(() => { mountComponent(false); - formGroup = wrapper.find(ExternalDashboard).find(GlFormGroup); + formGroup = wrapper.findComponent(ExternalDashboard).findComponent(GlFormGroup); }); it('uses label text', () => { @@ -153,7 +153,7 @@ describe('operation settings external dashboard component', () => { beforeEach(() => { mountComponent(); - input = wrapper.find(ExternalDashboard).find(GlFormInput); + input = wrapper.findComponent(ExternalDashboard).findComponent(GlFormInput); }); it('defaults to externalDashboardUrl', () => { @@ -167,7 +167,7 @@ describe('operation settings external dashboard component', () => { }); describe('submit button', () => { - const findSubmitButton = () => wrapper.find('.settings-content form').find(GlButton); + const findSubmitButton = () => wrapper.find('.settings-content form').findComponent(GlButton); const endpointRequest = [ operationsSettingsEndpoint, diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/delete_button_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/delete_button_spec.js index ad67128502a..ff11c8843bb 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/delete_button_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/delete_button_spec.js @@ -11,8 +11,8 @@ describe('delete_button', () => { tooltipTitle: 'Bar tooltipTitle', }; - const findButton = () => wrapper.find(GlButton); - const findTooltip = () => wrapper.find(GlTooltip); + const findButton = () => wrapper.findComponent(GlButton); + const findTooltip = () => wrapper.findComponent(GlTooltip); const mountComponent = (props) => { wrapper = shallowMount(component, { diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/delete_alert_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/delete_alert_spec.js index 9680e273add..4a026f35822 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/delete_alert_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/delete_alert_spec.js @@ -13,8 +13,8 @@ import { describe('Delete alert', () => { let wrapper; - const findAlert = () => wrapper.find(GlAlert); - const findLink = () => wrapper.find(GlLink); + const findAlert = () => wrapper.findComponent(GlAlert); + const findLink = () => wrapper.findComponent(GlLink); const mountComponent = (propsData) => { wrapper = shallowMount(component, { stubs: { GlSprintf }, propsData }); diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/partial_cleanup_alert_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/partial_cleanup_alert_spec.js index 1a27481a828..ce5ecfe4608 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/partial_cleanup_alert_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/partial_cleanup_alert_spec.js @@ -9,7 +9,7 @@ import { describe('Partial Cleanup alert', () => { let wrapper; - const findAlert = () => wrapper.find(GlAlert); + const findAlert = () => wrapper.findComponent(GlAlert); const findRunLink = () => wrapper.find('[data-testid="run-link"'); const findHelpLink = () => wrapper.find('[data-testid="help-link"'); diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/status_alert_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/status_alert_spec.js index a11b102d9a6..d83a5099bcd 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/status_alert_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/status_alert_spec.js @@ -14,8 +14,8 @@ import { describe('Status Alert', () => { let wrapper; - const findLink = () => wrapper.find(GlLink); - const findAlert = () => wrapper.find(GlAlert); + const findLink = () => wrapper.findComponent(GlLink); + const findAlert = () => wrapper.findComponent(GlAlert); const findMessage = () => wrapper.find('[data-testid="message"]'); const mountComponent = (propsData) => { diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/tags_list_row_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/tags_list_row_spec.js index 84f01f10f21..88979ea2b25 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/tags_list_row_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/details_page/tags_list_row_spec.js @@ -359,7 +359,7 @@ describe('tags list row', () => { mountComponent(); await nextTick(); - expect(finderFunction().find(ClipboardButton).exists()).toBe(clipboard); + expect(finderFunction().findComponent(ClipboardButton).exists()).toBe(clipboard); }); it('is disabled when the component is disabled', async () => { diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/cleanup_status_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/cleanup_status_spec.js index 61503d0f3bf..535faebdd4e 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/cleanup_status_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/cleanup_status_spec.js @@ -16,7 +16,7 @@ describe('cleanup_status', () => { let wrapper; const findMainIcon = () => wrapper.findByTestId('main-icon'); - const findMainIconName = () => wrapper.findByTestId('main-icon').find(GlIcon); + const findMainIconName = () => wrapper.findByTestId('main-icon').findComponent(GlIcon); const findExtraInfoIcon = () => wrapper.findByTestId('extra-info'); const findPopover = () => wrapper.findComponent(GlPopover); diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_row_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_row_spec.js index d12933526bc..0b59fe2d8ce 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_row_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_row_spec.js @@ -233,7 +233,7 @@ describe('Image List Row', () => { it('contains a tag icon', () => { mountComponent(); - const icon = findTagsCount().find(GlIcon); + const icon = findTagsCount().findComponent(GlIcon); expect(icon.exists()).toBe(true); expect(icon.props('name')).toBe('tag'); }); diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_spec.js index e0119954ed4..4d33f75a5fd 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/image_list_spec.js @@ -9,7 +9,7 @@ describe('Image List', () => { let wrapper; const findRow = () => wrapper.findAll(ImageListRow); - const findPagination = () => wrapper.find(GlKeysetPagination); + const findPagination = () => wrapper.findComponent(GlKeysetPagination); const mountComponent = (props) => { wrapper = shallowMount(Component, { diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/registry_header_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/registry_header_spec.js index a006de9f00c..e6d81d4a28f 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/registry_header_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/components/list_page/registry_header_spec.js @@ -17,7 +17,7 @@ jest.mock('~/lib/utils/datetime_utility', () => ({ describe('registry_header', () => { let wrapper; - const findTitleArea = () => wrapper.find(TitleArea); + const findTitleArea = () => wrapper.findComponent(TitleArea); const findCommandsSlot = () => wrapper.find('[data-testid="commands-slot"]'); const findImagesCountSubHeader = () => wrapper.find('[data-testid="images-count"]'); const findExpirationPolicySubHeader = () => wrapper.find('[data-testid="expiration-policy"]'); diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/pages/details_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/pages/details_spec.js index 1d161888a4d..ee6470a9df8 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/pages/details_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/pages/details_spec.js @@ -45,16 +45,16 @@ describe('Details Page', () => { let wrapper; let apolloProvider; - const findDeleteModal = () => wrapper.find(DeleteModal); - const findPagination = () => wrapper.find(GlKeysetPagination); - const findTagsLoader = () => wrapper.find(TagsLoader); - const findTagsList = () => wrapper.find(TagsList); - const findDeleteAlert = () => wrapper.find(DeleteAlert); - const findDetailsHeader = () => wrapper.find(DetailsHeader); - const findEmptyState = () => wrapper.find(GlEmptyState); - const findPartialCleanupAlert = () => wrapper.find(PartialCleanupAlert); - const findStatusAlert = () => wrapper.find(StatusAlert); - const findDeleteImage = () => wrapper.find(DeleteImage); + const findDeleteModal = () => wrapper.findComponent(DeleteModal); + const findPagination = () => wrapper.findComponent(GlKeysetPagination); + const findTagsLoader = () => wrapper.findComponent(TagsLoader); + const findTagsList = () => wrapper.findComponent(TagsList); + const findDeleteAlert = () => wrapper.findComponent(DeleteAlert); + const findDetailsHeader = () => wrapper.findComponent(DetailsHeader); + const findEmptyState = () => wrapper.findComponent(GlEmptyState); + const findPartialCleanupAlert = () => wrapper.findComponent(PartialCleanupAlert); + const findStatusAlert = () => wrapper.findComponent(StatusAlert); + const findDeleteImage = () => wrapper.findComponent(DeleteImage); const routeId = 1; diff --git a/spec/frontend/packages_and_registries/container_registry/explorer/pages/index_spec.js b/spec/frontend/packages_and_registries/container_registry/explorer/pages/index_spec.js index 5f4cb8969bc..add772d27ef 100644 --- a/spec/frontend/packages_and_registries/container_registry/explorer/pages/index_spec.js +++ b/spec/frontend/packages_and_registries/container_registry/explorer/pages/index_spec.js @@ -4,7 +4,7 @@ import component from '~/packages_and_registries/container_registry/explorer/pag describe('List Page', () => { let wrapper; - const findRouterView = () => wrapper.find({ ref: 'router-view' }); + const findRouterView = () => wrapper.findComponent({ ref: 'router-view' }); const mountComponent = () => { wrapper = shallowMount(component, { diff --git a/spec/frontend/packages_and_registries/harbor_registry/components/details/artifacts_list_spec.js b/spec/frontend/packages_and_registries/harbor_registry/components/details/artifacts_list_spec.js index f6c4d94bb05..b9d6dc2679e 100644 --- a/spec/frontend/packages_and_registries/harbor_registry/components/details/artifacts_list_spec.js +++ b/spec/frontend/packages_and_registries/harbor_registry/components/details/artifacts_list_spec.js @@ -9,9 +9,9 @@ import { defaultConfig, harborArtifactsList } from '../../mock_data'; describe('Harbor artifacts list', () => { let wrapper; - const findTagsLoader = () => wrapper.find(TagsLoader); - const findGlEmptyState = () => wrapper.find(GlEmptyState); - const findRegistryList = () => wrapper.find(RegistryList); + const findTagsLoader = () => wrapper.findComponent(TagsLoader); + const findGlEmptyState = () => wrapper.findComponent(GlEmptyState); + const findRegistryList = () => wrapper.findComponent(RegistryList); const findArtifactsListRow = () => wrapper.findAllComponents(ArtifactsListRow); const mountComponent = ({ propsData, config = defaultConfig }) => { diff --git a/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_header_spec.js b/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_header_spec.js index 636f3eeb04a..6602aed0a0c 100644 --- a/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_header_spec.js +++ b/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_header_spec.js @@ -12,9 +12,9 @@ import { describe('harbor_list_header', () => { let wrapper; - const findTitleArea = () => wrapper.find(TitleArea); + const findTitleArea = () => wrapper.findComponent(TitleArea); const findCommandsSlot = () => wrapper.find('[data-testid="commands-slot"]'); - const findImagesMetaDataItem = () => wrapper.find(MetadataItem); + const findImagesMetaDataItem = () => wrapper.findComponent(MetadataItem); const mountComponent = async (propsData, slots) => { wrapper = shallowMount(HarborListHeader, { diff --git a/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_row_spec.js b/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_row_spec.js index bd1abc7775d..b62d4e8836b 100644 --- a/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_row_spec.js +++ b/spec/frontend/packages_and_registries/harbor_registry/components/list/harbor_list_row_spec.js @@ -10,7 +10,7 @@ describe('Harbor List Row', () => { let wrapper; const item = harborImagesList[0]; - const findDetailsLink = () => wrapper.find(RouterLink); + const findDetailsLink = () => wrapper.findComponent(RouterLink); const findClipboardButton = () => wrapper.findComponent(ClipboardButton); const findArtifactsCount = () => wrapper.find('[data-testid="artifacts-count"]'); const findSkeletonLoader = () => wrapper.findComponent(GlSkeletonLoader); @@ -64,7 +64,7 @@ describe('Harbor List Row', () => { it('contains a package icon', () => { mountComponent(); - const icon = findArtifactsCount().find(GlIcon); + const icon = findArtifactsCount().findComponent(GlIcon); expect(icon.exists()).toBe(true); expect(icon.props('name')).toBe('package'); }); diff --git a/spec/frontend/packages_and_registries/harbor_registry/pages/details_spec.js b/spec/frontend/packages_and_registries/harbor_registry/pages/details_spec.js index 15e1130e058..8fd50bea280 100644 --- a/spec/frontend/packages_and_registries/harbor_registry/pages/details_spec.js +++ b/spec/frontend/packages_and_registries/harbor_registry/pages/details_spec.js @@ -24,10 +24,10 @@ jest.mock('~/rest_api', () => ({ describe('Harbor Details Page', () => { let wrapper; - const findTagsLoader = () => wrapper.find(TagsLoader); - const findArtifactsList = () => wrapper.find(ArtifactsList); - const findDetailsHeader = () => wrapper.find(DetailsHeader); - const findPersistedSearch = () => wrapper.find(PersistedSearch); + const findTagsLoader = () => wrapper.findComponent(TagsLoader); + const findArtifactsList = () => wrapper.findComponent(ArtifactsList); + const findDetailsHeader = () => wrapper.findComponent(DetailsHeader); + const findPersistedSearch = () => wrapper.findComponent(PersistedSearch); const waitForHarborDetailRequest = async () => { await waitForPromises(); diff --git a/spec/frontend/packages_and_registries/harbor_registry/pages/index_spec.js b/spec/frontend/packages_and_registries/harbor_registry/pages/index_spec.js index 55fc8066f65..942cf9bad2c 100644 --- a/spec/frontend/packages_and_registries/harbor_registry/pages/index_spec.js +++ b/spec/frontend/packages_and_registries/harbor_registry/pages/index_spec.js @@ -4,7 +4,7 @@ import component from '~/packages_and_registries/harbor_registry/pages/index.vue describe('List Page', () => { let wrapper; - const findRouterView = () => wrapper.find({ ref: 'router-view' }); + const findRouterView = () => wrapper.findComponent({ ref: 'router-view' }); const mountComponent = () => { wrapper = shallowMount(component, { diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/app_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/app_spec.js index 69c78e64e22..e74375b7705 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/app_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/app_spec.js @@ -76,8 +76,8 @@ describe('PackagesApp', () => { const packageTitle = () => wrapper.findComponent(TerraformTitle); const emptyState = () => wrapper.findComponent(GlEmptyState); const deleteButton = () => wrapper.find('.js-delete-button'); - const findDeleteModal = () => wrapper.find({ ref: 'deleteModal' }); - const findDeleteFileModal = () => wrapper.find({ ref: 'deleteFileModal' }); + const findDeleteModal = () => wrapper.findComponent({ ref: 'deleteModal' }); + const findDeleteFileModal = () => wrapper.findComponent({ ref: 'deleteFileModal' }); const versionsTab = () => wrapper.find('.js-versions-tab > a'); const packagesLoader = () => wrapper.findComponent(PackagesListLoader); const packagesVersionRows = () => wrapper.findAllComponents(PackageListRow); diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_files_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_files_spec.js index 95de2f0bb0b..b76d7c2b57b 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_files_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_files_spec.js @@ -17,8 +17,8 @@ describe('Package Files', () => { const findFirstRowDownloadLink = () => findFirstRow().find('[data-testid="download-link"]'); const findFirstRowCommitLink = () => findFirstRow().find('[data-testid="commit-link"]'); const findSecondRowCommitLink = () => findSecondRow().find('[data-testid="commit-link"]'); - const findFirstRowFileIcon = () => findFirstRow().find(FileIcon); - const findFirstRowCreatedAt = () => findFirstRow().find(TimeAgoTooltip); + const findFirstRowFileIcon = () => findFirstRow().findComponent(FileIcon); + const findFirstRowCreatedAt = () => findFirstRow().findComponent(TimeAgoTooltip); const findFirstActionMenu = () => findFirstRow().findComponent(GlDropdown); const findActionMenuDelete = () => findFirstActionMenu().find('[data-testid="delete-file"]'); const findFirstToggleDetailsButton = () => findFirstRow().findComponent(GlButton); diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_history_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_history_spec.js index f10f05f4a0d..c6b5138639e 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_history_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/details/components/package_history_spec.js @@ -36,8 +36,8 @@ describe('Package History', () => { }); const findHistoryElement = (testId) => wrapper.find(`[data-testid="${testId}"]`); - const findElementLink = (container) => container.find(GlLink); - const findElementTimeAgo = (container) => container.find(TimeAgoTooltip); + const findElementLink = (container) => container.findComponent(GlLink); + const findElementTimeAgo = (container) => container.findComponent(TimeAgoTooltip); const findTitle = () => wrapper.find('[data-testid="title"]'); const findTimeline = () => wrapper.find('[data-testid="timeline"]'); diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/infrastructure_title_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/infrastructure_title_spec.js index 72d08d5683b..93d013bb458 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/infrastructure_title_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/infrastructure_title_spec.js @@ -7,8 +7,8 @@ describe('Infrastructure Title', () => { let wrapper; let store; - const findTitleArea = () => wrapper.find(TitleArea); - const findMetadataItem = () => wrapper.find(MetadataItem); + const findTitleArea = () => wrapper.findComponent(TitleArea); + const findMetadataItem = () => wrapper.findComponent(MetadataItem); const exampleProps = { helpUrl: 'http://example.gitlab.com/help' }; diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js index 31616e0b2f5..db1d3f3f633 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js @@ -31,9 +31,9 @@ describe('packages_list_app', () => { const GlLoadingIcon = { name: 'gl-loading-icon', template: '<div>loading</div>' }; const emptyListHelpUrl = 'helpUrl'; - const findEmptyState = () => wrapper.find(GlEmptyState); - const findListComponent = () => wrapper.find(PackageList); - const findInfrastructureSearch = () => wrapper.find(InfrastructureSearch); + const findEmptyState = () => wrapper.findComponent(GlEmptyState); + const findListComponent = () => wrapper.findComponent(PackageList); + const findInfrastructureSearch = () => wrapper.findComponent(InfrastructureSearch); const createStore = ({ filter = [], packageCount = 0 } = {}) => { store = new Vuex.Store({ @@ -151,7 +151,7 @@ describe('packages_list_app', () => { describe('empty state', () => { it('generate the correct empty list link', () => { - const link = findListComponent().find(GlLink); + const link = findListComponent().findComponent(GlLink); expect(link.attributes('href')).toBe(emptyListHelpUrl); expect(link.text()).toBe('publish and share your packages'); diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_spec.js index fed82653016..fb5ee4e6884 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_spec.js @@ -20,11 +20,11 @@ describe('packages_list', () => { const EmptySlotStub = { name: 'empty-slot-stub', template: '<div>bar</div>' }; - const findPackagesListLoader = () => wrapper.find(PackagesListLoader); - const findPackageListPagination = () => wrapper.find(GlPagination); - const findPackageListDeleteModal = () => wrapper.find(GlModal); - const findEmptySlot = () => wrapper.find(EmptySlotStub); - const findPackagesListRow = () => wrapper.find(PackagesListRow); + const findPackagesListLoader = () => wrapper.findComponent(PackagesListLoader); + const findPackageListPagination = () => wrapper.findComponent(GlPagination); + const findPackageListDeleteModal = () => wrapper.findComponent(GlModal); + const findEmptySlot = () => wrapper.findComponent(EmptySlotStub); + const findPackagesListRow = () => wrapper.findComponent(PackagesListRow); const createStore = (isGroupPage, packages, isLoading) => { const state = { diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/shared/infrastructure_icon_and_name_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/shared/infrastructure_icon_and_name_spec.js index abb0d23b6e4..db90bb4c25f 100644 --- a/spec/frontend/packages_and_registries/infrastructure_registry/components/shared/infrastructure_icon_and_name_spec.js +++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/shared/infrastructure_icon_and_name_spec.js @@ -5,7 +5,7 @@ import InfrastructureIconAndName from '~/packages_and_registries/infrastructure_ describe('InfrastructureIconAndName', () => { let wrapper; - const findIcon = () => wrapper.find(GlIcon); + const findIcon = () => wrapper.findComponent(GlIcon); const mountComponent = () => { wrapper = shallowMount(InfrastructureIconAndName, {}); diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js index eb1e76377ff..b5a512b8806 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js @@ -30,10 +30,10 @@ describe('packages_list_row', () => { const packageWithTags = { ...packageWithoutTags, tags: { nodes: packageTags() } }; const packageCannotDestroy = { ...packageData(), canDestroy: false }; - const findPackageTags = () => wrapper.find(PackageTags); - const findPackagePath = () => wrapper.find(PackagePath); + const findPackageTags = () => wrapper.findComponent(PackageTags); + const findPackagePath = () => wrapper.findComponent(PackagePath); const findDeleteDropdown = () => wrapper.findByTestId('action-delete'); - const findPackageIconAndName = () => wrapper.find(PackageIconAndName); + const findPackageIconAndName = () => wrapper.findComponent(PackageIconAndName); const findPackageLink = () => wrapper.findByTestId('details-link'); const findWarningIcon = () => wrapper.findByTestId('warning-icon'); const findLeftSecondaryInfos = () => wrapper.findByTestId('left-secondary-infos'); diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/packages_title_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/packages_title_spec.js index 23e5c7330d5..b47515e15c3 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/packages_title_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/packages_title_spec.js @@ -7,8 +7,8 @@ describe('PackageTitle', () => { let wrapper; let store; - const findTitleArea = () => wrapper.find(TitleArea); - const findMetadataItem = () => wrapper.find(MetadataItem); + const findTitleArea = () => wrapper.findComponent(TitleArea); + const findMetadataItem = () => wrapper.findComponent(MetadataItem); const mountComponent = (propsData = { helpUrl: 'foo' }) => { wrapper = shallowMount(PackageTitle, { diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/tokens/package_type_token_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/tokens/package_type_token_spec.js index d0c111bae2d..e2af06416b4 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/tokens/package_type_token_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/tokens/package_type_token_spec.js @@ -6,7 +6,7 @@ import { PACKAGE_TYPES } from '~/packages_and_registries/package_registry/consta describe('packages_filter', () => { let wrapper; - const findFilteredSearchToken = () => wrapper.find(GlFilteredSearchToken); + const findFilteredSearchToken = () => wrapper.findComponent(GlFilteredSearchToken); const findFilteredSearchSuggestions = () => wrapper.findAll(GlFilteredSearchSuggestion); const mountComponent = ({ attrs, listeners } = {}) => { diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/cleanup_image_tags_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/cleanup_image_tags_spec.js index 51fcb1d7300..8b60f31512b 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/cleanup_image_tags_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/cleanup_image_tags_spec.js @@ -117,9 +117,9 @@ describe('Cleanup image tags project settings', () => { it('shows the admin part of the alert message', () => { mountComponent({ ...defaultProvidedValues, isAdmin: true }); - const sprintf = findAlert().find(GlSprintf); + const sprintf = findAlert().findComponent(GlSprintf); expect(sprintf.text()).toBe('administration settings'); - expect(sprintf.find(GlLink).attributes('href')).toBe( + expect(sprintf.findComponent(GlLink).attributes('href')).toBe( defaultProvidedValues.adminSettingsPath, ); }); diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_form_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_form_spec.js index ca44e77e694..5bd6608a9b8 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_form_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_form_spec.js @@ -36,7 +36,7 @@ describe('Container Expiration Policy Settings Form', () => { label: 'docker_container_retention_and_expiration_policies', }; - const findForm = () => wrapper.find({ ref: 'form-element' }); + const findForm = () => wrapper.findComponent({ ref: 'form-element' }); const findCancelButton = () => wrapper.find('[data-testid="cancel-button"'); const findSaveButton = () => wrapper.find('[data-testid="save-button"'); diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_spec.js index 827cd05390a..35baeaeac61 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/container_expiration_policy_spec.js @@ -35,7 +35,7 @@ describe('Container expiration policy project settings', () => { const findDescription = () => wrapper.findByTestId('description'); const findButton = () => wrapper.findByTestId('rules-button'); const findAlert = () => wrapper.findComponent(GlAlert); - const findSettingsBlock = () => wrapper.find(SettingsBlock); + const findSettingsBlock = () => wrapper.findComponent(SettingsBlock); const mountComponent = (provide = defaultProvidedValues, config) => { wrapper = shallowMountExtended(component, { @@ -97,9 +97,9 @@ describe('Container expiration policy project settings', () => { it('shows the admin part of the alert message', () => { mountComponent({ ...defaultProvidedValues, isAdmin: true }); - const sprintf = findAlert().find(GlSprintf); + const sprintf = findAlert().findComponent(GlSprintf); expect(sprintf.text()).toBe('administration settings'); - expect(sprintf.find(GlLink).attributes('href')).toBe( + expect(sprintf.findComponent(GlLink).attributes('href')).toBe( defaultProvidedValues.adminSettingsPath, ); }); diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_dropdown_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_dropdown_spec.js index 8b99ac6b06c..ae41fdf65e0 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_dropdown_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_dropdown_spec.js @@ -14,8 +14,8 @@ describe('ExpirationDropdown', () => { ], }; - const findFormSelect = () => wrapper.find(GlFormSelect); - const findFormGroup = () => wrapper.find(GlFormGroup); + const findFormSelect = () => wrapper.findComponent(GlFormSelect); + const findFormGroup = () => wrapper.findComponent(GlFormGroup); const findDescription = () => wrapper.find('[data-testid="description"]'); const findOptions = () => wrapper.findAll('[data-testid="option"]'); diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_input_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_input_spec.js index 6b681924fcf..1cea0704154 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_input_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_input_spec.js @@ -16,11 +16,11 @@ describe('ExpirationInput', () => { const tagsRegexHelpPagePath = 'fooPath'; - const findInput = () => wrapper.find(GlFormInput); - const findFormGroup = () => wrapper.find(GlFormGroup); + const findInput = () => wrapper.findComponent(GlFormInput); + const findFormGroup = () => wrapper.findComponent(GlFormGroup); const findLabel = () => wrapper.find('[data-testid="label"]'); const findDescription = () => wrapper.find('[data-testid="description"]'); - const findDescriptionLink = () => wrapper.find(GlLink); + const findDescriptionLink = () => wrapper.findComponent(GlLink); const mountComponent = (props) => { wrapper = shallowMount(component, { diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_run_text_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_run_text_spec.js index 94f7783afe7..653f2a8b40e 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_run_text_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_run_text_spec.js @@ -11,8 +11,8 @@ describe('ExpirationToggle', () => { let wrapper; const value = 'foo'; - const findInput = () => wrapper.find(GlFormInput); - const findFormGroup = () => wrapper.find(GlFormGroup); + const findInput = () => wrapper.findComponent(GlFormInput); + const findFormGroup = () => wrapper.findComponent(GlFormGroup); const mountComponent = (propsData) => { wrapper = shallowMount(component, { diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_toggle_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_toggle_spec.js index 45039614e49..55a66cebd83 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_toggle_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/expiration_toggle_spec.js @@ -10,7 +10,7 @@ import { describe('ExpirationToggle', () => { let wrapper; - const findToggle = () => wrapper.find(GlToggle); + const findToggle = () => wrapper.findComponent(GlToggle); const findDescription = () => wrapper.find('[data-testid="description"]'); const mountComponent = (propsData) => { diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/packages_cleanup_policy_form_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/packages_cleanup_policy_form_spec.js index 86f45d78bae..daf0ee85fdf 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/packages_cleanup_policy_form_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/packages_cleanup_policy_form_spec.js @@ -39,7 +39,7 @@ describe('Packages Cleanup Policy Settings Form', () => { label: 'packages_cleanup_policies', }; - const findForm = () => wrapper.find({ ref: 'form-element' }); + const findForm = () => wrapper.findComponent({ ref: 'form-element' }); const findSaveButton = () => wrapper.findByTestId('save-button'); const findKeepNDuplicatedPackageFilesDropdown = () => wrapper.findByTestId('keep-n-duplicated-package-files-dropdown'); diff --git a/spec/frontend/packages_and_registries/settings/project/settings/components/registry_settings_app_spec.js b/spec/frontend/packages_and_registries/settings/project/settings/components/registry_settings_app_spec.js index f576bc79eae..5dd27679708 100644 --- a/spec/frontend/packages_and_registries/settings/project/settings/components/registry_settings_app_spec.js +++ b/spec/frontend/packages_and_registries/settings/project/settings/components/registry_settings_app_spec.js @@ -6,8 +6,8 @@ import PackagesCleanupPolicy from '~/packages_and_registries/settings/project/co describe('Registry Settings app', () => { let wrapper; - const findContainerExpirationPolicy = () => wrapper.find(ContainerExpirationPolicy); - const findPackagesCleanupPolicy = () => wrapper.find(PackagesCleanupPolicy); + const findContainerExpirationPolicy = () => wrapper.findComponent(ContainerExpirationPolicy); + const findPackagesCleanupPolicy = () => wrapper.findComponent(PackagesCleanupPolicy); afterEach(() => { wrapper.destroy(); diff --git a/spec/frontend/packages_and_registries/shared/components/cli_commands_spec.js b/spec/frontend/packages_and_registries/shared/components/cli_commands_spec.js index 22c2d0d3b1a..dfa91fd8740 100644 --- a/spec/frontend/packages_and_registries/shared/components/cli_commands_spec.js +++ b/spec/frontend/packages_and_registries/shared/components/cli_commands_spec.js @@ -22,7 +22,7 @@ Vue.use(Vuex); describe('cli_commands', () => { let wrapper; - const findDropdownButton = () => wrapper.find(GlDropdown); + const findDropdownButton = () => wrapper.findComponent(GlDropdown); const findCodeInstruction = () => wrapper.findAll(CodeInstruction); const mountComponent = () => { diff --git a/spec/frontend/packages_and_registries/shared/components/package_icon_and_name_spec.js b/spec/frontend/packages_and_registries/shared/components/package_icon_and_name_spec.js index d6d1970cb12..a0ff6ca01b5 100644 --- a/spec/frontend/packages_and_registries/shared/components/package_icon_and_name_spec.js +++ b/spec/frontend/packages_and_registries/shared/components/package_icon_and_name_spec.js @@ -5,7 +5,7 @@ import PackageIconAndName from '~/packages_and_registries/shared/components/pack describe('PackageIconAndName', () => { let wrapper; - const findIcon = () => wrapper.find(GlIcon); + const findIcon = () => wrapper.findComponent(GlIcon); const mountComponent = () => { wrapper = shallowMount(PackageIconAndName, { diff --git a/spec/frontend/pages/import/bitbucket_server/components/bitbucket_server_status_table_spec.js b/spec/frontend/pages/import/bitbucket_server/components/bitbucket_server_status_table_spec.js index 7a8a249cb2a..b393a855a9f 100644 --- a/spec/frontend/pages/import/bitbucket_server/components/bitbucket_server_status_table_spec.js +++ b/spec/frontend/pages/import/bitbucket_server/components/bitbucket_server_status_table_spec.js @@ -36,7 +36,7 @@ describe('BitbucketServerStatusTable', () => { it('renders bitbucket status table component', () => { createComponent(); - expect(wrapper.find(BitbucketStatusTable).exists()).toBe(true); + expect(wrapper.findComponent(BitbucketStatusTable).exists()).toBe(true); }); it('renders Reconfigure button', async () => { diff --git a/spec/frontend/pages/import/bulk_imports/history/components/bulk_imports_history_app_spec.js b/spec/frontend/pages/import/bulk_imports/history/components/bulk_imports_history_app_spec.js index a850b1655f7..1790a9c9bf5 100644 --- a/spec/frontend/pages/import/bulk_imports/history/components/bulk_imports_history_app_spec.js +++ b/spec/frontend/pages/import/bulk_imports/history/components/bulk_imports_history_app_spec.js @@ -84,7 +84,7 @@ describe('BulkImportsHistoryApp', () => { 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 () => { @@ -92,8 +92,8 @@ describe('BulkImportsHistoryApp', () => { 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 () => { @@ -101,7 +101,7 @@ describe('BulkImportsHistoryApp', () => { createComponent(); await axios.waitForAll(); - const table = wrapper.find(GlTable); + const table = wrapper.findComponent(GlTable); expect(table.exists()).toBe(true); // can't use .props() or .attributes() here expect(table.vm.$attrs.items).toHaveLength(DUMMY_RESPONSE.length); diff --git a/spec/frontend/pages/import/history/components/import_error_details_spec.js b/spec/frontend/pages/import/history/components/import_error_details_spec.js index 4ff3f0361cf..82a3e11186e 100644 --- a/spec/frontend/pages/import/history/components/import_error_details_spec.js +++ b/spec/frontend/pages/import/history/components/import_error_details_spec.js @@ -41,7 +41,7 @@ describe('ImportErrorDetails', () => { 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 import_error if it is available', async () => { @@ -50,7 +50,7 @@ describe('ImportErrorDetails', () => { createComponent(); await axios.waitForAll(); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); expect(wrapper.find('pre').text()).toBe(FAKE_IMPORT_ERROR); }); @@ -59,7 +59,7 @@ describe('ImportErrorDetails', () => { createComponent(); await axios.waitForAll(); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); expect(wrapper.find('pre').text()).toBe('No additional information provided.'); }); }); diff --git a/spec/frontend/pages/profiles/show/emoji_menu_spec.js b/spec/frontend/pages/profiles/show/emoji_menu_spec.js deleted file mode 100644 index fa6e7e51a60..00000000000 --- a/spec/frontend/pages/profiles/show/emoji_menu_spec.js +++ /dev/null @@ -1,115 +0,0 @@ -import $ from 'jquery'; -import { TEST_HOST } from 'helpers/test_constants'; -import axios from '~/lib/utils/axios_utils'; -import EmojiMenu from '~/pages/profiles/show/emoji_menu'; - -describe('EmojiMenu', () => { - const dummyEmojiTag = '<dummy></tag>'; - const dummyToggleButtonSelector = '.toggle-button-selector'; - const dummyMenuClass = 'dummy-menu-class'; - - let emojiMenu; - let dummySelectEmojiCallback; - let dummyEmojiList; - - beforeEach(() => { - dummySelectEmojiCallback = jest.fn().mockName('dummySelectEmojiCallback'); - dummyEmojiList = { - glEmojiTag() { - return dummyEmojiTag; - }, - normalizeEmojiName(emoji) { - return emoji; - }, - isEmojiNameValid() { - return true; - }, - getEmojiCategoryMap() { - return { dummyCategory: [] }; - }, - }; - - emojiMenu = new EmojiMenu( - dummyEmojiList, - dummyToggleButtonSelector, - dummyMenuClass, - dummySelectEmojiCallback, - ); - }); - - afterEach(() => { - emojiMenu.destroy(); - }); - - describe('addAward', () => { - const dummyAwardUrl = `${TEST_HOST}/award/url`; - const dummyEmoji = 'tropical_fish'; - const dummyVotesBlock = () => $('<div />'); - - it('calls selectEmojiCallback', async () => { - expect(dummySelectEmojiCallback).not.toHaveBeenCalled(); - - await emojiMenu.addAward(dummyVotesBlock(), dummyAwardUrl, dummyEmoji, false); - expect(dummySelectEmojiCallback).toHaveBeenCalledWith(dummyEmoji, dummyEmojiTag); - }); - - it('does not make an axios request', async () => { - jest.spyOn(axios, 'request').mockReturnValue(); - - await emojiMenu.addAward(dummyVotesBlock(), dummyAwardUrl, dummyEmoji, false); - expect(axios.request).not.toHaveBeenCalled(); - }); - }); - - describe('bindEvents', () => { - beforeEach(() => { - jest.spyOn(emojiMenu, 'registerEventListener').mockReturnValue(); - }); - - it('binds event listeners to custom toggle button', () => { - emojiMenu.bindEvents(); - - expect(emojiMenu.registerEventListener).toHaveBeenCalledWith( - 'one', - expect.anything(), - 'mouseenter focus', - dummyToggleButtonSelector, - 'mouseenter focus', - expect.anything(), - ); - - expect(emojiMenu.registerEventListener).toHaveBeenCalledWith( - 'on', - expect.anything(), - 'click', - dummyToggleButtonSelector, - expect.anything(), - ); - }); - - it('binds event listeners to custom menu class', () => { - emojiMenu.bindEvents(); - - expect(emojiMenu.registerEventListener).toHaveBeenCalledWith( - 'on', - expect.anything(), - 'click', - `.js-awards-block .js-emoji-btn, .${dummyMenuClass} .js-emoji-btn`, - expect.anything(), - ); - }); - }); - - describe('createEmojiMenu', () => { - it('renders the menu with custom menu class', () => { - const menuElement = () => - document.body.querySelector(`.emoji-menu.${dummyMenuClass} .emoji-menu-content`); - - expect(menuElement()).toBe(null); - - emojiMenu.createEmojiMenu(); - - expect(menuElement()).not.toBe(null); - }); - }); -}); 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 2f452f909ff..8fb59f38ee1 100644 --- a/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js +++ b/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js @@ -58,7 +58,7 @@ describe('~/projects/pipelines/charts/components/pipeline_charts.vue', () => { it('displays the commit duration chart', () => { const chart = wrapper.findComponent(GlColumnChart); - expect(chart.exists()).toBeTruthy(); + expect(chart.exists()).toBe(true); expect(chart.props('yAxisTitle')).toBe('Minutes'); expect(chart.props('xAxisTitle')).toBe('Commit'); expect(chart.props('bars')).toBe(wrapper.vm.timesChartTransformedData); diff --git a/spec/frontend/runner/components/runner_details_spec.js b/spec/frontend/runner/components/runner_details_spec.js index 552ee29b6f9..f2281223a25 100644 --- a/spec/frontend/runner/components/runner_details_spec.js +++ b/spec/frontend/runner/components/runner_details_spec.js @@ -25,7 +25,12 @@ describe('RunnerDetails', () => { const findDetailGroups = () => wrapper.findComponent(RunnerGroups); - const createComponent = ({ props = {}, stubs, mountFn = shallowMountExtended } = {}) => { + const createComponent = ({ + props = {}, + stubs, + mountFn = shallowMountExtended, + enforceRunnerTokenExpiresAt = false, + } = {}) => { wrapper = mountFn(RunnerDetails, { propsData: { ...props, @@ -34,6 +39,9 @@ describe('RunnerDetails', () => { RunnerDetail, ...stubs, }, + provide: { + glFeatures: { enforceRunnerTokenExpiresAt }, + }, }); }; @@ -63,6 +71,8 @@ describe('RunnerDetails', () => { ${'Maximum job timeout'} | ${{ maximumTimeout: 0 }} | ${'0 seconds'} ${'Maximum job timeout'} | ${{ maximumTimeout: 59 }} | ${'59 seconds'} ${'Maximum job timeout'} | ${{ maximumTimeout: 10 * 60 + 5 }} | ${'10 minutes 5 seconds'} + ${'Token expiry'} | ${{ tokenExpiresAt: mockOneHourAgo }} | ${'1 hour ago'} + ${'Token expiry'} | ${{ tokenExpiresAt: null }} | ${'Never expires'} `('"$field" field', ({ field, runner, expectedValue }) => { beforeEach(() => { createComponent({ @@ -72,6 +82,7 @@ describe('RunnerDetails', () => { ...runner, }, }, + enforceRunnerTokenExpiresAt: true, stubs: { GlIntersperse, GlSprintf, @@ -124,5 +135,22 @@ describe('RunnerDetails', () => { expect(findDetailGroups().props('runner')).toEqual(mockGroupRunner); }); }); + + describe('Token expiration field', () => { + it.each` + case | flag | shown + ${'is shown when feature flag is enabled'} | ${true} | ${true} + ${'is not shown when feature flag is disabled'} | ${false} | ${false} + `('$case', ({ flag, shown }) => { + createComponent({ + props: { + runner: mockGroupRunner, + }, + enforceRunnerTokenExpiresAt: flag, + }); + + expect(findDd('Token expiry', wrapper).exists()).toBe(shown); + }); + }); }); }); diff --git a/spec/frontend/runner/utils_spec.js b/spec/frontend/runner/utils_spec.js index 1db9815dfd8..33de1345f85 100644 --- a/spec/frontend/runner/utils_spec.js +++ b/spec/frontend/runner/utils_spec.js @@ -1,4 +1,4 @@ -import { formatJobCount, tableField, getPaginationVariables } from '~/runner/utils'; +import { formatJobCount, tableField, getPaginationVariables, parseInterval } from '~/runner/utils'; describe('~/runner/utils', () => { describe('formatJobCount', () => { @@ -66,4 +66,15 @@ describe('~/runner/utils', () => { expect(getPaginationVariables(pagination, pageSize)).toEqual(variables); }); }); + + describe('parseInterval', () => { + it.each` + case | argument | returnValue + ${'parses integer'} | ${'86400'} | ${86400} + ${'returns null for undefined'} | ${undefined} | ${null} + ${'returns null for null'} | ${null} | ${null} + `('$case', ({ argument, returnValue }) => { + expect(parseInterval(argument)).toStrictEqual(returnValue); + }); + }); }); diff --git a/spec/frontend/set_status_modal/set_status_modal_wrapper_spec.js b/spec/frontend/set_status_modal/set_status_modal_wrapper_spec.js index 4191c44bb99..c5fb590646d 100644 --- a/spec/frontend/set_status_modal/set_status_modal_wrapper_spec.js +++ b/spec/frontend/set_status_modal/set_status_modal_wrapper_spec.js @@ -1,14 +1,13 @@ import { GlModal, GlFormCheckbox } from '@gitlab/ui'; -import { mount } from '@vue/test-utils'; import { nextTick } from 'vue'; +import { mountExtended } from 'helpers/vue_test_utils_helper'; import { initEmojiMock, clearEmojiMock } from 'helpers/emoji'; import * as UserApi from '~/api/user_api'; import EmojiPicker from '~/emoji/components/picker.vue'; import createFlash from '~/flash'; import stubChildren from 'helpers/stub_children'; -import SetStatusModalWrapper, { - AVAILABILITY_STATUS, -} from '~/set_status_modal/set_status_modal_wrapper.vue'; +import SetStatusModalWrapper from '~/set_status_modal/set_status_modal_wrapper.vue'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; import SetStatusForm from '~/set_status_modal/set_status_form.vue'; jest.mock('~/flash'); @@ -34,7 +33,7 @@ describe('SetStatusModalWrapper', () => { }; const createComponent = (props = {}) => { - return mount(SetStatusModalWrapper, { + return mountExtended(SetStatusModalWrapper, { propsData: { ...defaultProps, ...props, @@ -53,7 +52,8 @@ describe('SetStatusModalWrapper', () => { }; const findModal = () => wrapper.find(GlModal); - const findFormField = (field) => wrapper.find(`[name="user[status][${field}]"]`); + const findMessageField = () => + wrapper.findByPlaceholderText(SetStatusForm.i18n.statusMessagePlaceholder); const findClearStatusButton = () => wrapper.find('.js-clear-user-status-button'); const findAvailabilityCheckbox = () => wrapper.find(GlFormCheckbox); const findClearStatusAtMessage = () => wrapper.find('[data-testid="clear-status-at-message"]'); @@ -83,14 +83,8 @@ describe('SetStatusModalWrapper', () => { return initModal(); }); - it('sets the hidden status emoji field', () => { - const field = findFormField('emoji'); - expect(field.exists()).toBe(true); - expect(field.element.value).toBe(defaultEmoji); - }); - it('sets the message field', () => { - const field = findFormField('message'); + const field = findMessageField(); expect(field.exists()).toBe(true); expect(field.element.value).toBe(defaultMessage); }); @@ -135,7 +129,7 @@ describe('SetStatusModalWrapper', () => { }); it('does not set the message field', () => { - expect(findFormField('message').element.value).toBe(''); + expect(findMessageField().element.value).toBe(''); }); it('hides the clear status button', () => { @@ -143,18 +137,6 @@ describe('SetStatusModalWrapper', () => { }); }); - describe('with no currentEmoji set', () => { - beforeEach(async () => { - await initEmojiMock(); - wrapper = createComponent({ currentEmoji: '' }); - return initModal(); - }); - - it('does not set the hidden status emoji field', () => { - expect(findFormField('emoji').element.value).toBe(''); - }); - }); - describe('with currentClearStatusAfter set', () => { beforeEach(async () => { await initEmojiMock(); @@ -184,8 +166,7 @@ describe('SetStatusModalWrapper', () => { findModal().vm.$emit('secondary'); await nextTick(); - expect(findFormField('message').element.value).toBe(''); - expect(findFormField('emoji').element.value).toBe(''); + expect(findMessageField().element.value).toBe(''); }); it('clicking "setStatus" submits the user status', async () => { diff --git a/spec/frontend/set_status_modal/user_profile_set_status_wrapper_spec.js b/spec/frontend/set_status_modal/user_profile_set_status_wrapper_spec.js new file mode 100644 index 00000000000..eaee0e77311 --- /dev/null +++ b/spec/frontend/set_status_modal/user_profile_set_status_wrapper_spec.js @@ -0,0 +1,156 @@ +import { nextTick } from 'vue'; +import { cloneDeep } from 'lodash'; +import { mountExtended } from 'helpers/vue_test_utils_helper'; +import { resetHTMLFixture } from 'helpers/fixtures'; +import { useFakeDate } from 'helpers/fake_date'; +import UserProfileSetStatusWrapper from '~/set_status_modal/user_profile_set_status_wrapper.vue'; +import SetStatusForm from '~/set_status_modal/set_status_form.vue'; +import { TIME_RANGES_WITH_NEVER, NEVER_TIME_RANGE } from '~/set_status_modal/constants'; + +describe('UserProfileSetStatusWrapper', () => { + let wrapper; + + const defaultProvide = { + fields: { + emoji: { name: 'user[status][emoji]', id: 'user_status_emoji', value: '8ball' }, + message: { name: 'user[status][message]', id: 'user_status_message', value: 'foo bar' }, + availability: { + name: 'user[status][availability]', + id: 'user_status_availability', + value: 'busy', + }, + clearStatusAfter: { + name: 'user[status][clear_status_after]', + id: 'user_status_clear_status_after', + value: '2022-09-03 03:06:26 UTC', + }, + }, + }; + + const createComponent = ({ provide = {} } = {}) => { + wrapper = mountExtended(UserProfileSetStatusWrapper, { + provide: { + ...defaultProvide, + ...provide, + }, + }); + }; + + const findInput = (name) => wrapper.find(`[name="${name}"]`); + const findSetStatusForm = () => wrapper.findComponent(SetStatusForm); + + afterEach(() => { + wrapper.destroy(); + }); + + it('renders `SetStatusForm` component and passes expected props', () => { + createComponent(); + + expect(cloneDeep(findSetStatusForm().props())).toMatchObject({ + defaultEmoji: 'speech_balloon', + emoji: defaultProvide.fields.emoji.value, + message: defaultProvide.fields.message.value, + availability: true, + clearStatusAfter: NEVER_TIME_RANGE, + currentClearStatusAfter: defaultProvide.fields.clearStatusAfter.value, + }); + }); + + it.each` + input + ${'emoji'} + ${'message'} + ${'availability'} + `('renders hidden $input input with value set', ({ input }) => { + createComponent(); + + expect(findInput(defaultProvide.fields[input].name).attributes('value')).toBe( + defaultProvide.fields[input].value, + ); + }); + + describe('when clear status after dropdown is set to `Never`', () => { + it('renders hidden clear status after input with value unset', () => { + createComponent(); + + expect( + findInput(defaultProvide.fields.clearStatusAfter.name).attributes('value'), + ).toBeUndefined(); + }); + }); + + describe('when clear status after dropdown has a value selected', () => { + it('renders hidden clear status after input with value set', async () => { + createComponent(); + + findSetStatusForm().vm.$emit('clear-status-after-click', TIME_RANGES_WITH_NEVER[1]); + + await nextTick(); + + expect(findInput(defaultProvide.fields.clearStatusAfter.name).attributes('value')).toBe( + TIME_RANGES_WITH_NEVER[1].shortcut, + ); + }); + }); + + describe('when emoji is changed', () => { + it('updates hidden emoji input value', async () => { + createComponent(); + + const newEmoji = 'basketball'; + + findSetStatusForm().vm.$emit('emoji-click', newEmoji); + + await nextTick(); + + expect(findInput(defaultProvide.fields.emoji.name).attributes('value')).toBe(newEmoji); + }); + }); + + describe('when message is changed', () => { + it('updates hidden message input value', async () => { + createComponent(); + + const newMessage = 'foo bar baz'; + + findSetStatusForm().vm.$emit('message-input', newMessage); + + await nextTick(); + + expect(findInput(defaultProvide.fields.message.name).attributes('value')).toBe(newMessage); + }); + }); + + describe('when form is successfully submitted', () => { + // 2022-09-02 00:00:00 UTC + useFakeDate(2022, 8, 2); + + const form = document.createElement('form'); + form.classList.add('js-edit-user'); + + beforeEach(async () => { + document.body.appendChild(form); + createComponent(); + + const oneDay = TIME_RANGES_WITH_NEVER[4]; + + findSetStatusForm().vm.$emit('clear-status-after-click', oneDay); + + await nextTick(); + + form.dispatchEvent(new Event('ajax:success')); + }); + + afterEach(() => { + resetHTMLFixture(); + }); + + it('updates clear status after dropdown to `Never`', () => { + expect(findSetStatusForm().props('clearStatusAfter')).toBe(NEVER_TIME_RANGE); + }); + + it('updates `currentClearStatusAfter` prop', () => { + expect(findSetStatusForm().props('currentClearStatusAfter')).toBe('2022-09-03 00:00:00 UTC'); + }); + }); +}); diff --git a/spec/frontend/set_status_modal/utils_spec.js b/spec/frontend/set_status_modal/utils_spec.js index 273f30f8311..1e918b75a98 100644 --- a/spec/frontend/set_status_modal/utils_spec.js +++ b/spec/frontend/set_status_modal/utils_spec.js @@ -1,4 +1,5 @@ -import { AVAILABILITY_STATUS, isUserBusy } from '~/set_status_modal/utils'; +import { isUserBusy } from '~/set_status_modal/utils'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; describe('Set status modal utils', () => { describe('isUserBusy', () => { diff --git a/spec/frontend/sidebar/components/assignees/user_name_with_status_spec.js b/spec/frontend/sidebar/components/assignees/user_name_with_status_spec.js index 4dbf3d426bb..37c16bc9235 100644 --- a/spec/frontend/sidebar/components/assignees/user_name_with_status_spec.js +++ b/spec/frontend/sidebar/components/assignees/user_name_with_status_spec.js @@ -1,5 +1,5 @@ import { mount } from '@vue/test-utils'; -import { AVAILABILITY_STATUS } from '~/set_status_modal/utils'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; import UserNameWithStatus from '~/sidebar/components/assignees/user_name_with_status.vue'; const name = 'Administrator'; diff --git a/spec/frontend/vue_shared/components/user_popover/user_popover_spec.js b/spec/frontend/vue_shared/components/user_popover/user_popover_spec.js index b7ce3e47cef..ce9b7c5f061 100644 --- a/spec/frontend/vue_shared/components/user_popover/user_popover_spec.js +++ b/spec/frontend/vue_shared/components/user_popover/user_popover_spec.js @@ -1,7 +1,7 @@ import { GlSkeletonLoader, GlIcon } from '@gitlab/ui'; import { loadHTMLFixture, resetHTMLFixture } from 'helpers/fixtures'; import { mountExtended } from 'helpers/vue_test_utils_helper'; -import { AVAILABILITY_STATUS } from '~/set_status_modal/utils'; +import { AVAILABILITY_STATUS } from '~/set_status_modal/constants'; import UserPopover from '~/vue_shared/components/user_popover/user_popover.vue'; import axios from '~/lib/utils/axios_utils'; import createFlash from '~/flash'; diff --git a/spec/frontend/work_items/components/work_item_description_spec.js b/spec/frontend/work_items/components/work_item_description_spec.js index 6ec786507c0..d3165d8dc26 100644 --- a/spec/frontend/work_items/components/work_item_description_spec.js +++ b/spec/frontend/work_items/components/work_item_description_spec.js @@ -10,9 +10,9 @@ import MarkdownField from '~/vue_shared/components/markdown/field.vue'; import WorkItemDescription from '~/work_items/components/work_item_description.vue'; import { TRACKING_CATEGORY_SHOW } from '~/work_items/constants'; import workItemQuery from '~/work_items/graphql/work_item.query.graphql'; -import updateWorkItemWidgetsMutation from '~/work_items/graphql/update_work_item_widgets.mutation.graphql'; +import updateWorkItemMutation from '~/work_items/graphql/update_work_item.mutation.graphql'; import { - updateWorkItemWidgetsResponse, + updateWorkItemMutationResponse, workItemResponseFactory, workItemQueryResponse, } from '../mock_data'; @@ -31,7 +31,7 @@ describe('WorkItemDescription', () => { Vue.use(VueApollo); - const mutationSuccessHandler = jest.fn().mockResolvedValue(updateWorkItemWidgetsResponse); + const mutationSuccessHandler = jest.fn().mockResolvedValue(updateWorkItemMutationResponse); const findEditButton = () => wrapper.find('[data-testid="edit-description"]'); const findMarkdownField = () => wrapper.findComponent(MarkdownField); @@ -53,7 +53,7 @@ describe('WorkItemDescription', () => { wrapper = shallowMount(WorkItemDescription, { apolloProvider: createMockApollo([ [workItemQuery, workItemResponseHandler], - [updateWorkItemWidgetsMutation, mutationHandler], + [updateWorkItemMutation, mutationHandler], ]), propsData: { workItemId: id, @@ -173,7 +173,7 @@ describe('WorkItemDescription', () => { isEditing: true, mutationHandler: jest.fn().mockResolvedValue({ data: { - workItemUpdateWidgets: { + workItemUpdate: { workItem: {}, errors: [error], }, diff --git a/spec/frontend/work_items/mock_data.js b/spec/frontend/work_items/mock_data.js index 7651ee95b88..d9532910a94 100644 --- a/spec/frontend/work_items/mock_data.js +++ b/spec/frontend/work_items/mock_data.js @@ -227,17 +227,6 @@ export const workItemResponseFactory = ({ }, }); -export const updateWorkItemWidgetsResponse = { - data: { - workItemUpdateWidgets: { - workItem: { - id: 1234, - }, - errors: [], - }, - }, -}; - export const projectWorkItemTypesQueryResponse = { data: { workspace: { |