Skip to content

G
gitlab-ce
Commit c7209497 authored by Natalia Tepluhina's avatar Natalia Tepluhina
Browse files
Options

Merge branch 'slashmanov/refactor-next-tick-3' into 'master' 

Refactor nextTick to use a direct import from a Vue package (3/9)

See merge request gitlab-org/gitlab!79050
parents 0116f87c 6979e878
Show whitespace changes
Inline Side-by-side
Showing with 534 additions and 567 deletions
ee/spec/frontend/security_dashboard/components/group/group_security_dashboard_spec.js
View file @ c7209497
import { GlLoadingIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import GroupSecurityDashboard from 'ee/security_dashboard/components/group/group_security_dashboard.vue';
import ReportNotConfiguredGroup from 'ee/security_dashboard/components/shared/empty_states/report_not_configured_group.vue';
import VulnerabilitySeverities from 'ee/security_dashboard/components/shared/project_security_status_chart.vue';
......@@ -93,7 +94,7 @@ describe('Group Security Dashboard component', () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ projects: [{ name: 'project1' }] });
await wrapper.vm.$nextTick();
await nextTick();
const securityChartsLayout = findSecurityChartsLayoutComponent();
const reportNotConfigured = findReportNotConfigured();
......
ee/spec/frontend/security_dashboard/components/group/group_vulnerabilities_spec.js
View file @ c7209497
import { GlAlert, GlIntersectionObserver, GlLoadingIcon } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import GroupVulnerabilities from 'ee/security_dashboard/components/group/group_vulnerabilities.vue';
import VulnerabilityList from 'ee/security_dashboard/components/shared/vulnerability_list.vue';
import vulnerabilitiesQuery from 'ee/security_dashboard/graphql/queries/group_vulnerabilities.query.graphql';
......@@ -84,13 +85,12 @@ describe('Group Security Dashboard Vulnerabilities Component', () => {
);
});
it('should have an alert that is dismissable', () => {
it('should have an alert that is dismissable', async () => {
const alert = findAlert();
alert.vm.$emit('dismiss');
return wrapper.vm.$nextTick(() => {
await nextTick();
expect(alert.exists()).toBe(false);
});
});
it('does not display the vulnerabilities', () => {
expect(findVulnerabilities().exists()).toBe(false);
......
ee/spec/frontend/security_dashboard/components/instance/instance_security_dashboard_spec.js
View file @ c7209497
import { GlLoadingIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import InstanceSecurityDashboard from 'ee/security_dashboard/components/instance/instance_security_dashboard.vue';
import ReportNotConfiguredInstance from 'ee/security_dashboard/components/shared/empty_states/report_not_configured_instance.vue';
import VulnerabilitySeverities from 'ee/security_dashboard/components/shared/project_security_status_chart.vue';
......@@ -96,7 +97,7 @@ describe('Instance Security Dashboard component', () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ projects: [{ name: 'project1' }] });
await wrapper.vm.$nextTick();
await nextTick();
const securityChartsLayout = findSecurityChartsLayoutComponent();
const reportNotConfigured = findReportNotConfigured();
......
ee/spec/frontend/security_dashboard/components/instance/instance_vulnerabilities_spec.js
View file @ c7209497
import { GlAlert, GlIntersectionObserver, GlLoadingIcon } from '@gitlab/ui';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import InstanceVulnerabilities from 'ee/security_dashboard/components/instance/instance_vulnerabilities.vue';
import VulnerabilityList from 'ee/security_dashboard/components/shared/vulnerability_list.vue';
import vulnerabilitiesQuery from 'ee/security_dashboard/graphql/queries/instance_vulnerabilities.query.graphql';
......@@ -69,13 +70,12 @@ describe('Instance Security Dashboard Vulnerabilities Component', () => {
);
});
it('should have an alert that is dismissable', () => {
it('should have an alert that is dismissable', async () => {
const alert = findAlert();
alert.vm.$emit('dismiss');
return wrapper.vm.$nextTick(() => {
await nextTick();
expect(alert.exists()).toBe(false);
});
});
it('does not display the vulnerabilities', () => {
expect(findVulnerabilities().exists()).toBe(false);
......
ee/spec/frontend/security_dashboard/components/pipeline/filters_spec.js
View file @ c7209497
import { GlToggle } from '@gitlab/ui';
import { shallowMount, mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import Filters from 'ee/security_dashboard/components/pipeline/filters.vue';
import { simpleScannerFilter } from 'ee/security_dashboard/helpers';
......@@ -69,7 +69,7 @@ describe('Filter component', () => {
});
createWrapper({ mountFn: mount });
await wrapper.vm.$nextTick();
await nextTick();
// The other filters will trigger the mock as well, so we'll clear it before clicking on a
// scanner filter item.
mock.mockClear();
......@@ -78,7 +78,7 @@ describe('Filter component', () => {
const optionId = simpleScannerFilter.options[2].id;
const option = wrapper.findByTestId(`${filterId}:${optionId}`);
option.vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(mock).toHaveBeenCalledTimes(1);
expect(mock).toHaveBeenCalledWith(expect.any(Object), { [filterId]: [optionId] });
......
ee/spec/frontend/security_dashboard/components/pipeline/security_reports_summary_spec.js
View file @ c7209497
import { GlSprintf } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import SecurityReportsSummary from 'ee/security_dashboard/components/pipeline/security_reports_summary.vue';
import Modal from 'ee/vue_shared/security_reports/components/dast_modal.vue';
import { mockPipelineJobs } from 'ee_jest/security_dashboard/mock_data/jobs';
......@@ -148,7 +149,7 @@ describe('Security reports summary component', () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ isVisible: false });
await wrapper.vm.$nextTick();
await nextTick();
expect(localStorage.setItem).toHaveBeenCalledWith(LOCAL_STORAGE_KEY, '1');
});
......@@ -168,7 +169,7 @@ describe('Security reports summary component', () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ isVisible: true });
await wrapper.vm.$nextTick();
await nextTick();
expect(localStorage.removeItem).toHaveBeenCalledWith(LOCAL_STORAGE_KEY);
});
......
ee/spec/frontend/security_dashboard/components/pipeline/selection_summary_vuex_spec.js
View file @ c7209497
import { GlButton, GlFormSelect } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import Vuex from 'vuex';
......@@ -93,7 +93,7 @@ describe('Selection Summary', () => {
option.setSelected();
formSelect().trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.dismissalReason).toEqual(option.attributes('value'));
expect(dismissButton().props().disabled).toBe(false);
......
ee/spec/frontend/security_dashboard/components/project/project_security_dashboard_spec.js
View file @ c7209497
import { GlLoadingIcon } from '@gitlab/ui';
import { GlLineChart } from '@gitlab/ui/dist/charts';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import ProjectSecurityDashboard from 'ee/security_dashboard/components/project/project_security_dashboard.vue';
import ReportNotConfigured from 'ee/security_dashboard/components/shared/empty_states/report_not_configured_project.vue';
......@@ -78,13 +78,13 @@ describe('Project Security Dashboard component', () => {
});
describe('when chartWidth is 0', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper = createComponent({
query: mockProjectSecurityChartsWithData(),
propsData: { hasVulnerabilities: true },
chartWidth: 0,
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('should not display the line chart', () => {
......@@ -99,12 +99,12 @@ describe('Project Security Dashboard component', () => {
describe('when there is history data', () => {
useFakeDate(2021, 3, 11);
beforeEach(() => {
beforeEach(async () => {
wrapper = createComponent({
query: mockProjectSecurityChartsWithData(),
propsData: { hasVulnerabilities: true },
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('should display the chart with data', () => {
......@@ -141,12 +141,12 @@ describe('Project Security Dashboard component', () => {
});
describe('when there is no history data', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper = createComponent({
query: mockProjectSecurityChartsWithoutData(),
propsData: { hasVulnerabilities: false },
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('should display the empty state', () => {
......@@ -191,7 +191,7 @@ describe('Project Security Dashboard component', () => {
secureVulnerabilityTrainingEnabled: false,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findSecurityTrainingPromo().exists()).toBe(false);
});
......
ee/spec/frontend/security_dashboard/components/project/project_vulnerabilities_spec.js
View file @ c7209497
......@@ -2,6 +2,7 @@ import { GlAlert, GlIntersectionObserver, GlLoadingIcon } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { Portal } from 'portal-vue';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import ProjectVulnerabilities from 'ee/security_dashboard/components/project/project_vulnerabilities.vue';
import SecurityScannerAlert from 'ee/security_dashboard/components/project/security_scanner_alert.vue';
import VulnerabilityList from 'ee/security_dashboard/components/shared/vulnerability_list.vue';
......@@ -325,7 +326,7 @@ describe('Vulnerabilities app component', () => {
scannerAlert.vm.$emit('dismiss');
await wrapper.vm.$nextTick();
await nextTick();
expect(scannerAlert.exists()).toBe(false);
});
......@@ -333,7 +334,7 @@ describe('Vulnerabilities app component', () => {
it('should remember the dismissal state', async () => {
findSecurityScannerAlert().vm.$emit('dismiss');
await wrapper.vm.$nextTick();
await nextTick();
expect(window.localStorage.setItem.mock.calls).toContainEqual([
ProjectVulnerabilities.SCANNER_ALERT_DISMISSED_LOCAL_STORAGE_KEY,
......
ee/spec/frontend/security_dashboard/components/shared/csv_export_button_spec.js
View file @ c7209497
import { GlLoadingIcon, GlIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import CsvExportButton, {
STORAGE_KEY,
} from 'ee/security_dashboard/components/shared/csv_export_button.vue';
......@@ -118,7 +119,7 @@ describe('Csv Button Export', () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ isPreparingCsvExport: true });
await wrapper.vm.$nextTick();
await nextTick();
expect(findCsvExportButton().props()).toMatchObject({
icon: '',
......@@ -134,7 +135,7 @@ describe('Csv Button Export', () => {
it('closes the popover when the button is clicked', async () => {
expect(findPopoverButton().text()).toBe('Got it!');
findPopoverButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findPopover().exists()).toBe(false);
});
......@@ -142,7 +143,7 @@ describe('Csv Button Export', () => {
it('sets localStorage', async () => {
jest.spyOn(AccessorUtils, 'canUseLocalStorage').mockImplementation(() => true);
findPopoverButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(localStorage.setItem).toHaveBeenCalledTimes(1);
});
......@@ -150,7 +151,7 @@ describe('Csv Button Export', () => {
it(`does not set localStorage if it's not available`, async () => {
jest.spyOn(AccessorUtils, 'canUseLocalStorage').mockImplementation(() => false);
findPopoverButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(localStorage.setItem).toHaveBeenCalledTimes(0);
});
......
ee/spec/frontend/security_dashboard/components/shared/filters/filter_body_spec.js
View file @ c7209497
import { GlDropdown, GlSearchBoxByType, GlLoadingIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import FilterBody from 'ee/security_dashboard/components/shared/filters/filter_body.vue';
describe('Filter Body component', () => {
......@@ -75,7 +76,7 @@ describe('Filter Body component', () => {
createComponent({ showSearchBox: true }, { attachTo: document.body });
const spy = jest.spyOn(searchBox().vm, 'focusInput');
dropdown().vm.$emit('show');
await wrapper.vm.$nextTick();
await nextTick();
expect(spy).toHaveBeenCalledTimes(1);
});
......@@ -84,7 +85,7 @@ describe('Filter Body component', () => {
const text = 'abc';
createComponent({ showSearchBox: true });
searchBox().vm.$emit('input', text);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('input')[0][0]).toBe(text);
});
......
ee/spec/frontend/security_dashboard/components/shared/filters/scanner_filter_spec.js
View file @ c7209497
import { GlDropdownItem, GlDropdownDivider } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import { sampleSize, cloneDeep } from 'lodash';
import VueRouter from 'vue-router';
import FilterItem from 'ee/security_dashboard/components/shared/filters/filter_item.vue';
......@@ -129,7 +129,7 @@ describe('Scanner Filter component', () => {
ids.includes(`${x.vendor}.${x.report_type}`),
);
createWrapper();
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('filter-changed')[0][0]).toEqual({
scannerId: expect.arrayContaining([
......
ee/spec/frontend/security_dashboard/components/shared/filters/simple_filter_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueRouter from 'vue-router';
import SimpleFilter from 'ee/security_dashboard/components/shared/filters/simple_filter.vue';
......@@ -37,12 +37,12 @@ describe('Simple Filter component', () => {
const clickAllOptionItem = async () => {
allOptionItem().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
};
const clickItemAt = async (index) => {
dropdownItemAt(index).vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
};
const expectSelectedItems = (indexes) => {
......@@ -157,7 +157,7 @@ describe('Simple Filter component', () => {
// to fake it by doing it manually.
router.replace({ query: { [filter.id]: ids } });
window.dispatchEvent(new Event('popstate'));
await wrapper.vm.$nextTick();
await nextTick();
};
describe('clicking on items', () => {
......@@ -295,7 +295,7 @@ describe('Simple Filter component', () => {
const query = { [filter.id]: ids, other };
router.push({ query });
window.dispatchEvent(new Event('popstate'));
await wrapper.vm.$nextTick();
await nextTick();
expectSelectedItems([1, 2, 3]);
expect(wrapper.vm.$route.query.other).toEqual(other);
......
ee/spec/frontend/security_dashboard/components/shared/selection_summary_spec.js
View file @ c7209497
import { GlAlert } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import SelectionSummary from 'ee/security_dashboard/components/shared/selection_summary.vue';
import StatusDropdown from 'ee/security_dashboard/components/shared/status_dropdown.vue';
......@@ -56,7 +56,7 @@ describe('Selection Summary component', () => {
describe('with selected state', () => {
beforeEach(async () => {
wrapper.findComponent(StatusDropdown).vm.$emit('change', { action: 'confirm' });
await wrapper.vm.$nextTick();
await nextTick();
});
it('displays the submit button when there is s state selected', () => {
......@@ -71,7 +71,7 @@ describe('Selection Summary component', () => {
describe('with no selected state', () => {
beforeEach(async () => {
wrapper.findComponent(StatusDropdown).vm.$emit('change', { action: null });
await wrapper.vm.$nextTick();
await nextTick();
});
it('does not display the submit button when there is s state selected', () => {
......@@ -185,7 +185,7 @@ describe('Selection Summary component', () => {
it(`the submit button is unclickable during form submission - ${action}`, async () => {
expect(findSubmitButton().exists()).toBe(false);
submitForm();
await wrapper.vm.$nextTick();
await nextTick();
expect(isSubmitButtonDisabled()).toBe(true);
await waitForPromises();
expect(isSubmitButtonDisabled()).toBe(false);
......
ee/spec/frontend/security_dashboard/components/shared/vulnerabilities_over_time_chart_spec.js
View file @ c7209497
......@@ -53,14 +53,13 @@ describe('Vulnerabilities Over Time Chart Component', () => {
${'2000-01-01T00:00:00Z'} | ${30} | ${'December 2nd'}
`(
'shows "$expectedStartDate" when the date range is set to "$dayRange" days',
({ mockDate, dayRange, expectedStartDate }) => {
async ({ mockDate, dayRange, expectedStartDate }) => {
jest.spyOn(global.Date, 'now').mockImplementation(() => new Date(mockDate));
wrapper = createComponent({ data: () => ({ vulnerabilitiesHistoryDayRange: dayRange }) });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(findTimeInfo().text()).toContain(expectedStartDate);
});
},
);
});
......
ee/spec/frontend/security_dashboard/components/shared/vulnerability_count_list_spec.js
View file @ c7209497
import { shallowMount, createLocalVue } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import VulnerabilityCountList from 'ee/security_dashboard/components/shared/vulnerability_count_list.vue';
import VulnerabilityCountListLayout from 'ee/security_dashboard/components/shared/vulnerability_count_list_layout.vue';
import countQuery from 'ee/security_dashboard/graphql/queries/vulnerability_severities_count.query.graphql';
......@@ -101,7 +102,7 @@ describe('Vulnerabilities count list component', () => {
`(
'when the dashboard type is $dashboardType',
({ dashboardType, provide, expectedContainedQueryVariables }) => {
beforeEach(() => {
beforeEach(async () => {
const mockResponse = jest
.fn()
.mockResolvedValue(mockVulnerabilitySeveritiesGraphQLResponse({ dashboardType }));
......@@ -113,7 +114,7 @@ describe('Vulnerabilities count list component', () => {
stubs: { VulnerabilityCountListLayout },
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('should pass the correct variables to the GraphQL query', () => {
......
ee/spec/frontend/security_dashboard/components/shared/vulnerability_list_spec.js
View file @ c7209497
import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlTable, GlTruncate } from '@gitlab/ui';
import { capitalize } from 'lodash';
import { nextTick } from 'vue';
import DashboardHasNoVulnerabilities from 'ee/security_dashboard/components/shared/empty_states/dashboard_has_no_vulnerabilities.vue';
import FiltersProducedNoResults from 'ee/security_dashboard/components/shared/empty_states/filters_produced_no_results.vue';
import IssuesBadge from 'ee/security_dashboard/components/shared/issues_badge.vue';
......@@ -148,7 +149,7 @@ describe('Vulnerability list component', () => {
it('should show the selection summary when a checkbox is selected', async () => {
findDataCell('vulnerability-checkbox').setChecked(true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('visible')).toBe(true);
});
......@@ -156,13 +157,13 @@ describe('Vulnerability list component', () => {
it('should sync selected vulnerabilities when the vulnerability list is updated', async () => {
findDataCell('vulnerability-checkbox').setChecked(true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('selectedVulnerabilities')).toHaveLength(1);
wrapper.setProps({ vulnerabilities: [] });
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('visible')).toBe(false);
});
......@@ -172,9 +173,9 @@ describe('Vulnerability list component', () => {
checkbox().setChecked(true);
expect(checkbox().element.checked).toBe(true);
await wrapper.vm.$nextTick();
await nextTick();
findSelectionSummary().vm.$emit('vulnerability-updated', newVulnerabilities[0].id);
await wrapper.vm.$nextTick();
await nextTick();
expect(checkbox().element.checked).toBe(false);
});
......@@ -626,11 +627,11 @@ describe('Vulnerability list component', () => {
};
clickRows();
await wrapper.vm.$nextTick();
await nextTick();
expectRowCheckboxesToBe((i) => rowsToClick.includes(i));
clickRows();
await wrapper.vm.$nextTick();
await nextTick();
expectRowCheckboxesToBe(() => false);
});
});
......
ee/spec/frontend/security_dashboard/components/shared/vulnerability_report/vulnerability_list_spec.js
View file @ c7209497
import { GlSkeletonLoading, GlTable, GlTruncate } from '@gitlab/ui';
import { capitalize } from 'lodash';
import { Portal } from 'portal-vue';
import { nextTick } from 'vue';
import DashboardHasNoVulnerabilities from 'ee/security_dashboard/components/shared/empty_states/dashboard_has_no_vulnerabilities.vue';
import FiltersProducedNoResults from 'ee/security_dashboard/components/shared/empty_states/filters_produced_no_results.vue';
import IssuesBadge from 'ee/security_dashboard/components/shared/issues_badge.vue';
......@@ -159,7 +160,7 @@ describe('Vulnerability list component', () => {
it('should show the selection summary when a checkbox is selected', async () => {
findDataCell('vulnerability-checkbox').setChecked(true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('visible')).toBe(true);
});
......@@ -167,13 +168,13 @@ describe('Vulnerability list component', () => {
it('should sync selected vulnerabilities when the vulnerability list is updated', async () => {
findDataCell('vulnerability-checkbox').setChecked(true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('selectedVulnerabilities')).toHaveLength(1);
wrapper.setProps({ vulnerabilities: [] });
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props('visible')).toBe(false);
});
......@@ -183,9 +184,9 @@ describe('Vulnerability list component', () => {
checkbox().setChecked(true);
expect(checkbox().element.checked).toBe(true);
await wrapper.vm.$nextTick();
await nextTick();
findSelectionSummary().vm.$emit('vulnerability-updated', newVulnerabilities[0].id);
await wrapper.vm.$nextTick();
await nextTick();
expect(checkbox().element.checked).toBe(false);
});
......@@ -230,7 +231,7 @@ describe('Vulnerability list component', () => {
it('should not select a clicked vulnerability', async () => {
findRow(1).trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findSelectionSummary().props()).toMatchObject({
visible: false,
......@@ -602,11 +603,11 @@ describe('Vulnerability list component', () => {
};
clickRows();
await wrapper.vm.$nextTick();
await nextTick();
expectRowCheckboxesToBe((i) => rowsToClick.includes(i));
clickRows();
await wrapper.vm.$nextTick();
await nextTick();
expectRowCheckboxesToBe(() => false);
});
});
......
ee/spec/frontend/sidebar/components/cve_id_request_spec.js
View file @ c7209497
import { getByTestId as getByTestIdHelper, within } from '@testing-library/dom';
import { createWrapper, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import CveIdRequest from 'ee/sidebar/components/cve_id_request/cve_id_request_sidebar.vue';
import { store } from '~/notes/stores';
......@@ -59,7 +60,7 @@ describe('CveIdRequest', () => {
it('should show the "Help" pane when help button is clicked', async () => {
findHelpButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.showHelpState).toBe(true);
// let animations run
......@@ -71,10 +72,10 @@ describe('CveIdRequest', () => {
it('should not show the "Help" pane when help button is clicked and then closed', async () => {
findHelpButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
findCloseHelpButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.showHelpState).toBe(false);
expect(queryHelpPane()).toBe(null);
......
ee/spec/frontend/sidebar/components/iteration_dropdown_spec.js
View file @ c7209497
......@@ -7,7 +7,7 @@ import {
GlSearchBoxByType,
} from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import IterationDropdown from 'ee/sidebar/components/iteration_dropdown.vue';
import groupIterationsQuery from 'ee/sidebar/queries/iterations.query.graphql';
......@@ -80,7 +80,7 @@ describe('IterationDropdown', () => {
});
const waitForDebounce = async () => {
await wrapper.vm.$nextTick();
await nextTick();
jest.runOnlyPendingTimers();
};
const findDropdownItems = () => wrapper.findAllComponents(GlDropdownItem);
......@@ -97,7 +97,7 @@ describe('IterationDropdown', () => {
item.vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
};
const findDropdown = () => wrapper.findComponent(GlDropdown);
const showDropdownAndWait = async () => {
......
ee/spec/frontend/sidebar/components/status/status_spec.js
View file @ c7209497
import { GlDropdown, GlDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import Status from 'ee/sidebar/components/status/status.vue';
import { healthStatus, healthStatusTextMap, I18N_DROPDOWN } from 'ee/sidebar/constants';
import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
......@@ -149,11 +150,11 @@ describe('Status', () => {
wrapper.vm.isDropdownShowing = true;
await wrapper.vm.$nextTick();
await nextTick();
expect(getRemoveStatusItem(wrapper).exists()).toBe(true);
});
it('emits an onDropdownClick event with argument null when clicked', () => {
it('emits an onDropdownClick event with argument null when clicked', async () => {
const props = {
isEditable: true,
status: healthStatus.AT_RISK,
......@@ -163,13 +164,12 @@ describe('Status', () => {
wrapper.vm.isDropdownShowing = true;
wrapper.vm.$nextTick(() => {
await nextTick();
getRemoveStatusItem(wrapper).vm.$emit('click', { preventDefault: () => null });
expect(wrapper.emitted().onDropdownClick[0]).toEqual([null]);
});
});
});
describe('status text', () => {
describe('when no value is provided for status', () => {
......@@ -240,7 +240,7 @@ describe('Status', () => {
it('shows the dropdown when the Edit button is clicked', async () => {
getEditButton(wrapper).trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(getDropdownClasses(wrapper)).toContain('show');
});
});
......@@ -268,7 +268,7 @@ describe('Status', () => {
it('hides form when the `edit` button is clicked', async () => {
getEditButton(wrapper).trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(getDropdownClasses(wrapper)).toContain('gl-display-none');
});
......@@ -277,7 +277,7 @@ describe('Status', () => {
dropdownItem.vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(getDropdownClasses(wrapper)).toContain('gl-display-none');
});
});
......@@ -325,7 +325,7 @@ describe('Status', () => {
.at(index + 1)
.vm.$emit('click', { preventDefault: () => null });
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted().onDropdownClick[0]).toEqual([status]);
},
);
......
ee/spec/frontend/sidebar/weight_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import Weight from 'ee/sidebar/components/weight/weight.vue';
import { mockTracking, unmockTracking, triggerEvent } from 'helpers/tracking_helper';
import { ENTER_KEY_CODE } from '~/lib/utils/keycodes';
......@@ -85,7 +86,7 @@ describe('Weight', () => {
findCollapsedBlock().trigger('click');
await wrapper.vm.$nextTick;
await nextTick;
expect(wrapper.classes()).toContain('collapse-after-update');
});
......@@ -99,7 +100,7 @@ describe('Weight', () => {
findEditLink().trigger('click');
await wrapper.vm.$nextTick;
await nextTick;
expect(containsEditableField()).toBe(true);
});
......@@ -117,7 +118,7 @@ describe('Weight', () => {
findEditLink().trigger('click');
await wrapper.vm.$nextTick;
await nextTick;
const event = new CustomEvent('keydown');
event.keyCode = ENTER_KEY_CODE;
......@@ -127,7 +128,7 @@ describe('Weight', () => {
editableField.value = expectedWeightValue;
editableField.dispatchEvent(event);
await wrapper.vm.$nextTick;
await nextTick;
expect(containsInputError()).toBe(false);
expect(eventHub.$emit).toHaveBeenCalledWith('updateWeight', {
......@@ -149,7 +150,7 @@ describe('Weight', () => {
findRemoveLink().trigger('click');
await wrapper.vm.$nextTick;
await nextTick;
expect(containsInputError()).toBe(false);
expect(eventHub.$emit).toHaveBeenCalledWith('updateWeight', { id: mockId, value: '' });
......@@ -162,7 +163,7 @@ describe('Weight', () => {
findEditLink().trigger('click');
await wrapper.vm.$nextTick;
await nextTick;
const event = new CustomEvent('keydown');
event.keyCode = ENTER_KEY_CODE;
......@@ -172,7 +173,7 @@ describe('Weight', () => {
editableField.value = -9001;
editableField.dispatchEvent(event);
await wrapper.vm.$nextTick;
await nextTick;
expect(containsInputError()).toBe(true);
});
......@@ -197,7 +198,7 @@ describe('Weight', () => {
it('calls trackEvent when "Edit" is clicked', async () => {
triggerEvent(findEditLink().element);
await wrapper.vm.$nextTick;
await nextTick;
expect(trackingSpy).toHaveBeenCalled();
});
......
ee/spec/frontend/subscriptions/buy_addons_shared/components/order_summary_spec.js
View file @ c7209497
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import { merge } from 'lodash';
import VueApollo from 'vue-apollo';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
......@@ -162,7 +162,7 @@ describe('Order Summary', () => {
it('should emit `alertError` event', async () => {
jest.spyOn(wrapper.vm, '$emit');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.$emit).toHaveBeenCalledWith('alertError', I18N_API_ERROR);
});
......
ee/spec/frontend/test_case_create/components/test_case_create_root_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import TestCaseCreateRoot from 'ee/test_case_create/components/test_case_create_root.vue';
import createTestCase from 'ee/test_case_create/queries/create_test_case.mutation.graphql';
......@@ -185,7 +186,7 @@ describe('TestCaseCreateRoot', () => {
createTestCaseRequestActive: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('[data-testid="submit-test-case"]').props('loading')).toBe(true);
});
......@@ -197,7 +198,7 @@ describe('TestCaseCreateRoot', () => {
createTestCaseRequestActive: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('[data-testid="cancel-test-case"]').props('disabled')).toBe(true);
});
......
ee/spec/frontend/test_case_list/components/test_case_list_empty_spec.js
View file @ c7209497
import { GlEmptyState, GlSprintf, GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import TestCaseListEmptyState from 'ee/test_case_list/components/test_case_list_empty_state.vue';
const createComponent = (props = {}) =>
......@@ -44,7 +45,7 @@ describe('TestCaseListEmptyState', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.emptyStateTitle).toBe('There are no open test cases');
});
......@@ -59,7 +60,7 @@ describe('TestCaseListEmptyState', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.emptyStateTitle).toBe('There are no archived test cases');
});
......@@ -87,7 +88,7 @@ describe('TestCaseListEmptyState', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.showDescription).toBe(returnValue);
},
......
ee/spec/frontend/test_case_show/components/test_case_show_root_spec.js
View file @ c7209497
import { GlLink, GlLoadingIcon, GlSprintf, GlAlert } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import TestCaseShowRoot from 'ee/test_case_show/components/test_case_show_root.vue';
import TestCaseSidebar from 'ee/test_case_show/components/test_case_sidebar.vue';
import { mockCurrentUserTodo } from 'jest/vue_shared/issuable/list/mock_data';
......@@ -94,7 +95,7 @@ describe('TestCaseShowRoot', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
});
it.each`
......@@ -243,7 +244,7 @@ describe('TestCaseShowRoot', () => {
editTestCaseFormVisible: true,
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.handleCancelClick();
......@@ -274,7 +275,7 @@ describe('TestCaseShowRoot', () => {
testCaseLoading: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true);
});
......@@ -332,7 +333,7 @@ describe('TestCaseShowRoot', () => {
testCaseLoadFailed: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(IssuableShow).exists()).toBe(false);
});
......@@ -375,7 +376,7 @@ describe('TestCaseShowRoot', () => {
editTestCaseFormVisible: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('[data-testid="save-test-case"]').exists()).toBe(true);
expect(wrapper.find('[data-testid="cancel-test-case-edit"]').exists()).toBe(true);
......@@ -390,7 +391,7 @@ describe('TestCaseShowRoot', () => {
expect(testCaseSidebar.props('sidebarExpanded')).toBe(true);
testCaseSidebar.vm.$emit('sidebar-toggle');
await wrapper.vm.$nextTick();
await nextTick();
expect(testCaseSidebar.props('sidebarExpanded')).toBe(false);
});
......
ee/spec/frontend/test_case_show/components/test_case_sidebar_spec.js
View file @ c7209497
......@@ -2,6 +2,7 @@ import { GlButton, GlIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Mousetrap from 'mousetrap';
import { nextTick } from 'vue';
import TestCaseSidebar from 'ee/test_case_show/components/test_case_sidebar.vue';
import { mockCurrentUserTodo, mockLabels } from 'jest/vue_shared/issuable/list/mock_data';
......@@ -65,7 +66,7 @@ describe('TestCaseSidebar', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
});
it.each`
......@@ -92,7 +93,7 @@ describe('TestCaseSidebar', () => {
testCaseMoveInProgress,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.selectProjectDropdownButtonTitle).toBe(returnValue);
},
......@@ -126,7 +127,7 @@ describe('TestCaseSidebar', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.handleTodoButtonClick();
......@@ -162,7 +163,7 @@ describe('TestCaseSidebar', () => {
sidebarExpanded: false,
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.expandSidebarAndOpenDropdown('.js-labels-block .js-sidebar-dropdown-toggle');
......@@ -178,11 +179,11 @@ describe('TestCaseSidebar', () => {
sidebarExpanded: false,
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.expandSidebarAndOpenDropdown('.js-labels-block .js-sidebar-dropdown-toggle');
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.sidebarEl.dispatchEvent(new Event('transitionend'));
......@@ -205,7 +206,7 @@ describe('TestCaseSidebar', () => {
sidebarExpandedOnClick: true,
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.handleSidebarDropdownClose();
......@@ -276,7 +277,7 @@ describe('TestCaseSidebar', () => {
sidebarExpanded: false,
});
await wrapper.vm.$nextTick();
await nextTick();
todoEl = wrapper.find('button');
......
ee/spec/frontend/threat_monitoring/components/alerts/alert_drawer_spec.js
View file @ c7209497
......@@ -2,6 +2,7 @@ import { GlAlert, GlDrawer, GlSkeletonLoader } from '@gitlab/ui';
import * as Sentry from '@sentry/browser';
import { createLocalVue } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import AlertDrawer from 'ee/threat_monitoring/components/alerts/alert_drawer.vue';
import { DRAWER_ERRORS } from 'ee/threat_monitoring/components/alerts/constants';
import createMockApollo from 'helpers/mock_apollo_helper';
......@@ -104,7 +105,7 @@ describe('Alert Drawer', () => {
${'skeleton loader'} | ${'does not display'} | ${findSkeletonLoader} | ${false} | ${mountExtended}
`('$status the $component', async ({ findComponent, state, mount }) => {
createWrapper({ $apollo: shallowApolloMock({}), mount });
await wrapper.vm.$nextTick();
await nextTick();
expect(findComponent().exists()).toBe(state);
});
});
......
ee/spec/frontend/threat_monitoring/components/alerts/alert_filters_spec.js
View file @ c7209497
import { GlDropdownItem, GlSearchBoxByType } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import AlertFilters from 'ee/threat_monitoring/components/alerts/alert_filters.vue';
import { ALL, DEFAULT_FILTERS, STATUSES } from 'ee/threat_monitoring/components/alerts/constants';
import { trimText } from 'helpers/text_helper';
......@@ -38,7 +39,7 @@ describe('AlertFilters component', () => {
const searchTerm = 'abc';
const search = findSearch();
search.vm.$emit('input', searchTerm);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('filter-change')).toStrictEqual([
[{ ...DEFAULT_FILTERS, searchTerm }],
]);
......
ee/spec/frontend/threat_monitoring/components/alerts/alert_status_spec.js
View file @ c7209497
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import AlertStatus from 'ee/threat_monitoring/components/alerts/alert_status.vue';
import waitForPromises from 'helpers/wait_for_promises';
import updateAlertStatusMutation from '~/graphql_shared/mutations/alert_status_update.mutation.graphql';
......@@ -96,7 +97,7 @@ describe('AlertStatus', () => {
it('emits an error when triggered a second time', async () => {
await selectFirstStatusOption();
await wrapper.vm.$nextTick();
await nextTick();
await selectFirstStatusOption();
expect(wrapper.emitted('alert-error').length).toBeGreaterThan(1);
});
......@@ -105,7 +106,7 @@ describe('AlertStatus', () => {
const status = 'Unreviewed';
expect(findStatusDropdown().props('text')).toBe(status);
await selectFirstStatusOption();
await wrapper.vm.$nextTick();
await nextTick();
expect(findStatusDropdown().props('text')).toBe(status);
});
});
......
ee/spec/frontend/threat_monitoring/components/alerts/alerts_list_spec.js
View file @ c7209497
import { GlIntersectionObserver, GlSkeletonLoading } from '@gitlab/ui';
import { createLocalVue } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import AlertFilters from 'ee/threat_monitoring/components/alerts/alert_filters.vue';
import AlertStatus from 'ee/threat_monitoring/components/alerts/alert_status.vue';
import AlertsList from 'ee/threat_monitoring/components/alerts/alerts_list.vue';
......@@ -129,7 +130,7 @@ describe('AlertsList component', () => {
const newFilters = { statuses: [] };
expect(wrapper.vm.filters).toEqual(DEFAULT_FILTERS);
findAlertFilters().vm.$emit('filter-change', newFilters);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.filters).toEqual(newFilters);
});
......@@ -170,13 +171,13 @@ describe('AlertsList component', () => {
expect(findStatusColumnHeader().attributes('aria-sort')).toBe('none');
findStatusColumnHeader().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.sort).toBe('STATUS_DESC');
expect(findStatusColumnHeader().attributes('aria-sort')).toBe('descending');
findStatusColumnHeader().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.sort).toBe('STATUS_ASC');
expect(findStatusColumnHeader().attributes('aria-sort')).toBe('ascending');
......@@ -270,7 +271,7 @@ describe('AlertsList component', () => {
wrapper.setData({
errored: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findErrorAlert().exists()).toBe(true);
expect(findUnconfiguredAlert().exists()).toBe(false);
});
......@@ -281,7 +282,7 @@ describe('AlertsList component', () => {
wrapper.setData({
isErrorAlertDismissed: true,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findUnconfiguredAlert().exists()).toBe(false);
});
});
......@@ -296,7 +297,7 @@ describe('AlertsList component', () => {
}),
});
findGlIntersectionObserver().vm.$emit('appear');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.$apollo.queries.alerts.fetchMore).toHaveBeenCalledTimes(1);
});
});
......@@ -315,7 +316,7 @@ describe('AlertsList component', () => {
it('does refetch the alerts when an alert status has changed', async () => {
expect(refetchSpy).toHaveBeenCalledTimes(0);
findStatusColumn().vm.$emit('alert-update');
await wrapper.vm.$nextTick();
await nextTick();
expect(refetchSpy).toHaveBeenCalledTimes(1);
});
......@@ -323,7 +324,7 @@ describe('AlertsList component', () => {
const error = 'Error.';
expect(findErrorAlert().exists()).toBe(false);
findStatusColumn().vm.$emit('alert-error', error);
await wrapper.vm.$nextTick();
await nextTick();
expect(findErrorAlert().exists()).toBe(true);
expect(findErrorAlert().text()).toBe(error);
});
......
ee/spec/frontend/threat_monitoring/components/instance_project_selector_spec.js
View file @ c7209497
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import InstanceProjectSelector from 'ee/threat_monitoring/components/instance_project_selector.vue';
import createMockApollo from 'helpers/mock_apollo_helper';
......@@ -141,7 +141,7 @@ describe('InstanceProjectSelector Component', () => {
it('notifies project selector of search error', async () => {
querySpy = jest.fn().mockResolvedValue(mockGetUsersProjects.error);
createWrapper({ queryResolver: querySpy });
await wrapper.vm.$nextTick();
await nextTick();
findProjectSelector().vm.$emit('searched', 'abc');
await waitForPromises();
expect(findProjectSelector().props()).toStrictEqual({
......@@ -153,7 +153,7 @@ describe('InstanceProjectSelector Component', () => {
it('notifies project selector of no results', async () => {
querySpy = jest.fn().mockResolvedValue(mockGetUsersProjects.empty);
createWrapper({ queryResolver: querySpy });
await wrapper.vm.$nextTick();
await nextTick();
findProjectSelector().vm.$emit('searched', 'abc');
await waitForPromises();
expect(findProjectSelector().props()).toStrictEqual({
......
ee/spec/frontend/threat_monitoring/components/policies/no_policies_empty_state_spec.js
View file @ c7209497
import { nextTick } from 'vue';
import NoPoliciesEmptyState from 'ee/threat_monitoring/components/policies/no_policies_empty_state.vue';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
......@@ -32,7 +33,7 @@ describe('NoPoliciesEmptyState component', () => {
${'does display the empty list state'} | ${findEmptyListState} | ${false} | ${() => factory(true)}
`('$title', async ({ factoryFn, findComponent, state }) => {
factoryFn();
await wrapper.vm.$nextTick();
await nextTick();
expect(findComponent().exists()).toBe(state);
});
});
ee/spec/frontend/threat_monitoring/components/policies/policies_app_spec.js
View file @ c7209497
import { nextTick } from 'vue';
import PoliciesApp from 'ee/threat_monitoring/components/policies/policies_app.vue';
import PoliciesHeader from 'ee/threat_monitoring/components/policies/policies_header.vue';
import PoliciesList from 'ee/threat_monitoring/components/policies/policies_list.vue';
......@@ -35,7 +36,7 @@ describe('Policies App', () => {
async ({ findFn }) => {
expect(findPoliciesList().props('shouldUpdatePolicyList')).toBe(false);
findFn().vm.$emit('update-policy-list', true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findPoliciesList().props('shouldUpdatePolicyList')).toBe(true);
},
);
......
ee/spec/frontend/threat_monitoring/components/policies/policies_header_spec.js
View file @ c7209497
import { GlAlert, GlButton, GlSprintf } from '@gitlab/ui';
import { nextTick } from 'vue';
import { NEW_POLICY_BUTTON_TEXT } from 'ee/threat_monitoring/components/constants';
import PoliciesHeader from 'ee/threat_monitoring/components/policies/policies_header.vue';
import ScanNewPolicyModal from 'ee/threat_monitoring/components/policies/scan_new_policy_modal.vue';
......@@ -24,7 +25,7 @@ describe('Policies Header Component', () => {
text: projectLinkSuccessText,
variant: 'success',
});
await wrapper.vm.$nextTick();
await nextTick();
};
const createWrapper = ({ provide } = {}) => {
......@@ -98,7 +99,7 @@ describe('Policies Header Component', () => {
it('hides the previous alert when scan new modal policy is processing a new link', async () => {
findScanNewPolicyModal().vm.$emit('updating-project');
await wrapper.vm.$nextTick();
await nextTick();
expect(findAlert().exists()).toBe(false);
});
});
......
ee/spec/frontend/threat_monitoring/components/policies/policies_list_spec.js
View file @ c7209497
import { GlTable, GlDrawer } from '@gitlab/ui';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import { merge } from 'lodash';
import VueApollo from 'vue-apollo';
import { POLICY_TYPE_OPTIONS } from 'ee/threat_monitoring/components/constants';
......@@ -225,7 +225,7 @@ describe('PoliciesList component', () => {
${'scan result'} | ${POLICY_TYPE_OPTIONS.POLICY_TYPE_SCAN_RESULT} | ${[POLICY_TYPE_OPTIONS.POLICY_TYPE_NETWORK, POLICY_TYPE_OPTIONS.POLICY_TYPE_SCAN_EXECUTION]}
`('policies filtered by $description type', async ({ filterBy, hiddenTypes }) => {
findPolicyTypeFilter().vm.$emit('input', filterBy.value);
await wrapper.vm.$nextTick();
await nextTick();
expect(findPoliciesTable().text()).toContain(filterBy.text);
hiddenTypes.forEach((hiddenType) => {
......@@ -237,16 +237,16 @@ describe('PoliciesList component', () => {
expect(scanExecutionPoliciesSpy).toHaveBeenCalledTimes(1);
expect(wrapper.emitted('update-policy-list')).toBeUndefined();
wrapper.setProps({ shouldUpdatePolicyList: true });
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('update-policy-list')).toStrictEqual([[false]]);
expect(scanExecutionPoliciesSpy).toHaveBeenCalledTimes(2);
});
it('does not emit `update-policy-list` or refetch scan execution policies on `shouldUpdatePolicyList` change to `false`', async () => {
wrapper.setProps({ shouldUpdatePolicyList: true });
await wrapper.vm.$nextTick();
await nextTick();
wrapper.setProps({ shouldUpdatePolicyList: false });
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('update-policy-list')).toStrictEqual([[false]]);
expect(scanExecutionPoliciesSpy).toHaveBeenCalledTimes(2);
});
......
ee/spec/frontend/threat_monitoring/components/policies/scan_new_policy_modal_spec.js
View file @ c7209497
import { GlDropdown, GlModal, GlAlert } from '@gitlab/ui';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import InstanceProjectSelector from 'ee/threat_monitoring/components/instance_project_selector.vue';
import ScanNewPolicyModal from 'ee/threat_monitoring/components/policies/scan_new_policy_modal.vue';
......@@ -115,7 +115,7 @@ describe('ScanNewPolicyModal Component', () => {
expect(findInstanceProjectSelector().props('selectedProjects')[0].name).toBe('Test 1');
// should restore the previous state when action is not submitted
await wrapper.vm.$nextTick();
await nextTick();
expect(findInstanceProjectSelector().props('selectedProjects')[0].name).toBeUndefined();
});
......@@ -139,7 +139,7 @@ describe('ScanNewPolicyModal Component', () => {
// When we click on the delete button, the component should display a warning
findUnlinkButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findByText(wrapper.vm.$options.i18n.unlinkWarning).exists()).toBe(true);
expect(findModal().attributes('ok-disabled')).toBeUndefined();
......
ee/spec/frontend/threat_monitoring/components/policy_editor/network_policy/network_policy_editor_spec.js
View file @ c7209497
import { GlEmptyState, GlFormCheckbox, GlFormGroup } from '@gitlab/ui';
import { nextTick } from 'vue';
import { EDITOR_MODE_YAML } from 'ee/threat_monitoring/components/policy_editor/constants';
import DimDisableContainer from 'ee/threat_monitoring/components/policy_editor/dim_disable_container.vue';
import {
......@@ -357,7 +358,7 @@ describe('NetworkPolicyEditor component', () => {
it('it does not redirect', async () => {
findPolicyEditorLayout().vm.$emit('save-policy');
await wrapper.vm.$nextTick();
await nextTick();
expect(redirectTo).not.toHaveBeenCalledWith('/threat-monitoring');
});
});
......
ee/spec/frontend/threat_monitoring/components/policy_editor/network_policy/policy_rule_builder_spec.js
View file @ c7209497
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import {
RuleDirectionOutbound,
EndpointMatchModeAny,
......@@ -54,13 +55,13 @@ describe('PolicyRuleBuilder component', () => {
it('updates rule direction upon selecting', async () => {
selectFirstOption("[id='direction']");
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.direction).toEqual(RuleDirectionOutbound);
});
it('emits endpoint-match-mode-change upon selecting', async () => {
selectFirstOption("[data-testid='endpoint-match-mode']");
await wrapper.vm.$nextTick();
await nextTick();
const event = wrapper.emitted()['endpoint-match-mode-change'];
expect(event.length).toEqual(2);
expect(event[0]).toEqual([EndpointMatchModeLabel]);
......@@ -86,7 +87,7 @@ describe('PolicyRuleBuilder component', () => {
it('emits endpoint-labels-change on change', async () => {
const input = findEndpointLabels();
input.setValue('foo:bar');
await wrapper.vm.$nextTick();
await nextTick();
const event = wrapper.emitted()['endpoint-labels-change'];
expect(event.length).toEqual(1);
expect(event[0]).toEqual(['foo:bar']);
......@@ -95,7 +96,7 @@ describe('PolicyRuleBuilder component', () => {
it('emits rule-type-change upon selecting', async () => {
selectFirstOption("[id='ruleMode']");
await wrapper.vm.$nextTick();
await nextTick();
const event = wrapper.emitted()['rule-type-change'];
expect(event.length).toEqual(2);
expect(event[0]).toEqual([RuleTypeEntity]);
......@@ -131,7 +132,7 @@ describe('PolicyRuleBuilder component', () => {
el.findAll('button')
.filter((e) => e.text() === 'host')
.trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.entities).toEqual(['host']);
});
});
......@@ -153,7 +154,7 @@ describe('PolicyRuleBuilder component', () => {
const el = findRuleCIDR();
el.setValue('0.0.0.0/24');
el.trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.cidr).toEqual('0.0.0.0/24');
});
});
......@@ -175,14 +176,14 @@ describe('PolicyRuleBuilder component', () => {
const el = findRuleFQDN();
el.setValue('some-service.com');
el.trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.fqdn).toEqual('some-service.com');
});
});
it('updates port match mode upon selecting', async () => {
selectFirstOption("[id='portMatch']");
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.portMatchMode).toEqual(PortMatchModePortProtocol);
});
......@@ -203,7 +204,7 @@ describe('PolicyRuleBuilder component', () => {
it('updates ports', async () => {
const input = findPorts();
input.setValue('80/tcp');
await wrapper.vm.$nextTick();
await nextTick();
expect(rule.ports).toEqual('80/tcp');
});
});
......
ee/spec/frontend/threat_monitoring/components/policy_editor/policy_alert_picker_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import PolicyAlertPicker from 'ee/threat_monitoring/components/policy_editor/policy_alert_picker.vue';
import getAgentCount from 'ee/threat_monitoring/graphql/queries/get_agent_count.query.graphql';
......@@ -42,7 +42,7 @@ describe('PolicyAlertPicker component', () => {
},
}),
);
await wrapper.vm.$nextTick();
await nextTick();
};
afterEach(() => {
......
ee/spec/frontend/threat_monitoring/components/policy_editor/policy_editor_spec.js
View file @ c7209497
import { GlAlert, GlFormSelect } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { POLICY_TYPE_COMPONENT_OPTIONS } from 'ee/threat_monitoring/components/constants';
import EnvironmentPicker from 'ee/threat_monitoring/components/environment_picker.vue';
import NetworkPolicyEditor from 'ee/threat_monitoring/components/policy_editor/network_policy/network_policy_editor.vue';
......@@ -66,7 +67,7 @@ describe('PolicyEditor component', () => {
it('shows an alert when "error" is emitted from the component', async () => {
const errorMessage = 'test';
findNeworkPolicyEditor().vm.$emit('error', errorMessage);
await wrapper.vm.$nextTick();
await nextTick();
const alert = findAlert();
expect(alert.exists()).toBe(true);
expect(alert.text()).toBe(errorMessage);
......@@ -82,7 +83,7 @@ describe('PolicyEditor component', () => {
async ({ findComponent, option, policyType }) => {
const formSelect = findFormSelect();
formSelect.vm.$emit('change', policyType);
await wrapper.vm.$nextTick();
await nextTick();
const component = findComponent();
expect(formSelect.attributes('value')).toBe(option.value);
expect(component.exists()).toBe(true);
......@@ -91,11 +92,11 @@ describe('PolicyEditor component', () => {
);
describe('with scan_result_policy feature flag disabled', () => {
beforeEach(() => {
beforeEach(async () => {
factory({ provide: { glFeatures: { scanResultPolicy: false } } });
const formSelect = findFormSelect();
formSelect.vm.$emit('change', POLICY_TYPE_COMPONENT_OPTIONS.scanResult.value);
wrapper.vm.$nextTick();
await nextTick();
});
it('does not render scan result policy', () => {
......@@ -124,7 +125,7 @@ describe('PolicyEditor component', () => {
propsData: { existingPolicy },
provide: { policyType, glFeatures: { scanResultPolicy: true } },
});
await wrapper.vm.$nextTick();
await nextTick();
const formSelect = findFormSelect();
expect(formSelect.exists()).toBe(true);
expect(formSelect.attributes('value')).toBe(option.value);
......
ee/spec/frontend/threat_monitoring/components/policy_editor/scan_execution_policy/scan_execution_policy_editor_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { GlEmptyState } from '@gitlab/ui';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import PolicyEditorLayout from 'ee/threat_monitoring/components/policy_editor/policy_editor_layout.vue';
import {
......@@ -97,7 +98,7 @@ describe('ScanExecutionPolicyEditor', () => {
describe('default', () => {
it('updates the policy yaml when "update-yaml" is emitted', async () => {
factory();
await wrapper.vm.$nextTick();
await nextTick();
const newManifest = 'new yaml!';
expect(findPolicyEditorLayout().attributes('yamleditorvalue')).toBe(
DEFAULT_SCAN_EXECUTION_POLICY,
......@@ -115,7 +116,7 @@ describe('ScanExecutionPolicyEditor', () => {
'navigates to the new merge request when "modifyPolicy" is emitted $status',
async ({ action, event, factoryFn, yamlEditorValue, currentlyAssignedPolicyProject }) => {
factoryFn();
await wrapper.vm.$nextTick();
await nextTick();
findPolicyEditorLayout().vm.$emit(event);
await waitForPromises();
expect(modifyPolicy).toHaveBeenCalledTimes(1);
......@@ -129,7 +130,7 @@ describe('ScanExecutionPolicyEditor', () => {
projectPath: defaultProjectPath,
yamlEditorValue,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(visitUrl).toHaveBeenCalled();
expect(visitUrl).toHaveBeenCalledWith(
`/${currentlyAssignedPolicyProject.fullPath}/-/merge_requests/2`,
......@@ -141,7 +142,7 @@ describe('ScanExecutionPolicyEditor', () => {
describe('when a user is not an owner of the project', () => {
it('displays the empty state with the appropriate properties', async () => {
factory({ provide: { disableScanExecutionUpdate: true } });
await wrapper.vm.$nextTick();
await nextTick();
expect(findEmptyState().props()).toMatchObject({
primaryButtonLink: scanExecutionDocumentationPath,
svgPath: policyEditorEmptyStateSvgPath,
......
ee/spec/frontend/threat_monitoring/components/policy_yaml_editor_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import PolicyYamlEditor from 'ee/threat_monitoring/components/policy_yaml_editor.vue';
import SourceEditor from '~/vue_shared/components/source_editor.vue';
......@@ -42,7 +43,7 @@ describe('PolicyYamlEditor component', () => {
it("emits input event on editor's input", async () => {
const editor = findEditor();
editor.vm.$emit('input');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted().input).toBeTruthy();
});
});
ee/spec/frontend/threat_monitoring/components/statistics_history_spec.js
View file @ c7209497
import { GlAreaChart } from '@gitlab/ui/dist/charts';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import { TOTAL_REQUESTS, ANOMALOUS_REQUESTS } from 'ee/threat_monitoring/components/constants';
import StatisticsHistory from 'ee/threat_monitoring/components/statistics_history.vue';
import { mockNominalHistory, mockAnomalousHistory } from '../mocks/mock_data';
......@@ -108,7 +108,7 @@ describe('StatisticsHistory component', () => {
});
describe('chart tooltip', () => {
beforeEach(() => {
beforeEach(async () => {
const mockParams = {
seriesData: [
{
......@@ -140,7 +140,7 @@ describe('StatisticsHistory component', () => {
},
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('renders the title and series data correctly', () => {
......
ee/spec/frontend/trials/components/country_or_region_selector_spec.js
View file @ c7209497
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import createMockApollo from 'helpers/mock_apollo_helper';
......@@ -73,7 +73,7 @@ describe('CountryOrRegionSelector', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ countries, states, country });
await wrapper.vm.$nextTick();
await nextTick();
expect(findFormInput('state').exists()).toBe(display);
});
......
ee/spec/frontend/usage_quotas/storage/components/collapsible_project_storage_detail_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import CollapsibleProjectStorageDetail from 'ee/usage_quotas/storage/components/collapsible_project_storage_detail.vue';
import ProjectStorageDetail from 'ee/usage_quotas/storage/components/project_storage_detail.vue';
import { numberToHumanSize } from '~/lib/utils/number_utils';
......@@ -39,20 +40,18 @@ describe('CollapsibleProjectStorageDetail', () => {
describe('toggle row', () => {
describe('on click', () => {
it('toggles isOpen', () => {
it('toggles isOpen', async () => {
expect(findProjectStorageDetail().exists()).toBe(false);
findTableRow().trigger('click');
wrapper.vm.$nextTick(() => {
await nextTick();
expect(findProjectStorageDetail().exists()).toBe(true);
findTableRow().trigger('click');
wrapper.vm.$nextTick(() => {
await nextTick();
expect(findProjectStorageDetail().exists()).toBe(false);
});
});
});
});
});
});
ee/spec/frontend/usage_quotas/storage/components/namespace_storage_app_spec.js
View file @ c7209497
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import NamespaceStorageApp from 'ee/usage_quotas/storage/components/namespace_storage_app.vue';
import CollapsibleProjectStorageDetail from 'ee/usage_quotas/storage/components/collapsible_project_storage_detail.vue';
import ProjectList from 'ee/usage_quotas/storage/components/project_list.vue';
......@@ -79,7 +80,7 @@ describe('NamespaceStorageApp', () => {
namespace: namespaceData,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findAllComponents(CollapsibleProjectStorageDetail)).toHaveLength(3);
});
......@@ -92,7 +93,7 @@ describe('NamespaceStorageApp', () => {
namespace: namespaceData,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.text()).toContain(formatUsageSize(namespaceData.limit));
});
......@@ -104,7 +105,7 @@ describe('NamespaceStorageApp', () => {
namespace: { ...namespaceData, limit: 0 },
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.text()).not.toContain(formatUsageSize(0));
});
......@@ -118,7 +119,7 @@ describe('NamespaceStorageApp', () => {
namespace: withRootStorageStatistics,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findTotalUsage().text()).toContain(withRootStorageStatistics.totalUsage);
});
......@@ -132,7 +133,7 @@ describe('NamespaceStorageApp', () => {
namespace: withRootStorageStatistics,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findUsageGraph().exists()).toBe(true);
expect(findUsageStatistics().exists()).toBe(false);
......@@ -145,7 +146,7 @@ describe('NamespaceStorageApp', () => {
namespace: withRootStorageStatistics,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findUsageStatistics().exists()).toBe(true);
expect(findUsageGraph().exists()).toBe(false);
......@@ -161,7 +162,7 @@ describe('NamespaceStorageApp', () => {
namespace: namespaceData,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findTotalUsage().text()).toContain('N/A');
});
......
ee/spec/frontend/usage_quotas/storage/components/temporary_storage_increase_modal_spec.js
View file @ c7209497
import { GlModal } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import TemporaryStorageIncreaseModal from 'ee/usage_quotas/storage/components/temporary_storage_increase_modal.vue';
const TEST_LIMIT = '8 bytes';
......@@ -18,9 +19,9 @@ describe('Temporary storage increase modal', () => {
});
};
const findModal = () => wrapper.findComponent(GlModal);
const showModal = () => {
const showModal = async () => {
findModal().vm.show();
return wrapper.vm.$nextTick();
await nextTick();
};
const findModalText = () => document.body.innerText;
......
ee/spec/frontend/vue_mr_widget/components/approvals/approvals_footer_spec.js
View file @ c7209497
import { GlButton, GlLoadingIcon, GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import ApprovalsFooter from 'ee/vue_merge_request_widget/components/approvals/approvals_footer.vue';
import ApprovalsList from 'ee/vue_merge_request_widget/components/approvals/approvals_list.vue';
import stubChildren from 'helpers/stub_children';
......@@ -140,16 +141,15 @@ describe('EE MRWidget approvals footer', () => {
expect(icon.props('name')).toEqual('chevron-right');
});
it('expands when clicked', () => {
it('expands when clicked', async () => {
const button = findToggle();
button.vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().input).toEqual([[true]]);
});
});
});
it('renders avatar list', () => {
const avatars = findAvatars();
......@@ -184,18 +184,13 @@ describe('EE MRWidget approvals footer', () => {
expect(button.text()).toBe('View eligible approvers');
});
it('expands when clicked', (done) => {
it('expands when clicked', async () => {
expect(wrapper.props('value')).toBe(false);
button.vm.$emit('click');
wrapper.vm
.$nextTick()
.then(() => {
await nextTick();
expect(wrapper.emitted().input).toEqual([[true]]);
})
.then(done)
.catch(done.fail);
});
});
});
......
ee/spec/frontend/vue_mr_widget/components/approvals/approvals_spec.js
View file @ c7209497
import { GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import Approvals from 'ee/vue_merge_request_widget/components/approvals/approvals.vue';
import ApprovalsAuth from 'ee/vue_merge_request_widget/components/approvals/approvals_auth.vue';
import ApprovalsFooter from 'ee/vue_merge_request_widget/components/approvals/approvals_footer.vue';
......@@ -107,13 +108,12 @@ describe('EE MRWidget approvals', () => {
createComponent();
});
it('shows loading message', () => {
it('shows loading message', async () => {
wrapper.findComponent(ApprovalsFoss).setData({ fetchingApprovals: true });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.text()).toContain(FETCH_LOADING);
});
});
it('fetches approvals', () => {
expect(service.fetchApprovals).toHaveBeenCalled();
......@@ -121,11 +121,11 @@ describe('EE MRWidget approvals', () => {
});
describe('when fetch approvals success', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'fetchApprovals').mockResolvedValue();
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('hides loading message', () => {
......@@ -135,11 +135,11 @@ describe('EE MRWidget approvals', () => {
});
describe('when fetch approvals error', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'fetchApprovals').mockRejectedValue();
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('still shows loading message', () => {
......@@ -157,14 +157,14 @@ describe('EE MRWidget approvals', () => {
});
describe('when mr is closed', () => {
beforeEach(() => {
beforeEach(async () => {
mr.isOpen = false;
mr.approvals.user_has_approved = false;
mr.approvals.user_can_approve = true;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('action is not rendered', () => {
......@@ -173,13 +173,13 @@ describe('EE MRWidget approvals', () => {
});
describe('when user cannot approve', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.user_has_approved = false;
mr.approvals.user_can_approve = false;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('action is not rendered', () => {
......@@ -194,10 +194,10 @@ describe('EE MRWidget approvals', () => {
});
describe('and MR is unapproved', () => {
beforeEach(() => {
beforeEach(async () => {
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('approve action is rendered', () => {
......@@ -215,11 +215,11 @@ describe('EE MRWidget approvals', () => {
});
describe('with no approvers', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.approved_by = [];
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('approve action (with inverted style) is rendered', () => {
......@@ -232,11 +232,11 @@ describe('EE MRWidget approvals', () => {
});
describe('with approvers', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.approved_by = [{ user: { id: 7 } }];
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('approve additionally action is rendered', () => {
......@@ -250,13 +250,13 @@ describe('EE MRWidget approvals', () => {
});
describe('when approve action is clicked', () => {
beforeEach(() => {
beforeEach(async () => {
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('shows loading icon', () => {
it('shows loading icon', async () => {
jest.spyOn(service, 'approveMergeRequest').mockReturnValue(new Promise(() => {}));
const action = findAction();
......@@ -264,16 +264,15 @@ describe('EE MRWidget approvals', () => {
action.vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(action.props('loading')).toBe(true);
});
});
describe('and after loading', () => {
beforeEach(() => {
beforeEach(async () => {
findAction().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('calls service approve', () => {
......@@ -294,11 +293,11 @@ describe('EE MRWidget approvals', () => {
});
describe('and error', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'approveMergeRequest').mockRejectedValue();
findAction().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('flashes error message', () => {
......@@ -308,51 +307,49 @@ describe('EE MRWidget approvals', () => {
});
describe('when project requires password to approve', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.require_password_to_approve = true;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
describe('when approve is clicked', () => {
beforeEach(() => {
beforeEach(async () => {
findAction().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
});
describe('when emits approve', () => {
const findApprovalsAuth = () => wrapper.findComponent(ApprovalsAuth);
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'approveMergeRequestWithAuth').mockRejectedValue();
jest.spyOn(service, 'approveMergeRequest').mockReturnValue(new Promise(() => {}));
findApprovalsAuth().vm.$emit('approve', TEST_PASSWORD);
return wrapper.vm.$nextTick();
await nextTick();
});
it('calls service when emits approve', () => {
expect(service.approveMergeRequestWithAuth).toHaveBeenCalledWith(TEST_PASSWORD);
});
it('sets isApproving', () => {
it('sets isApproving', async () => {
wrapper.findComponent(ApprovalsFoss).setData({ isApproving: true });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(findApprovalsAuth().props('isApproving')).toBe(true);
});
});
it('sets hasError when auth fails', () => {
it('sets hasError when auth fails', async () => {
wrapper.findComponent(ApprovalsFoss).setData({ hasApprovalAuthError: true });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(findApprovalsAuth().props('hasError')).toBe(true);
});
});
it('shows flash if general error', () => {
expect(createFlash).toHaveBeenCalledWith({ message: APPROVE_ERROR });
......@@ -363,13 +360,13 @@ describe('EE MRWidget approvals', () => {
});
describe('when user has approved', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.user_has_approved = true;
mr.approvals.user_can_approve = false;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('revoke action is rendered', () => {
......@@ -382,10 +379,10 @@ describe('EE MRWidget approvals', () => {
describe('when revoke action is clicked', () => {
describe('and successful', () => {
beforeEach(() => {
beforeEach(async () => {
findAction().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('calls service unapprove', () => {
......@@ -406,11 +403,11 @@ describe('EE MRWidget approvals', () => {
});
describe('and error', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'unapproveMergeRequest').mockRejectedValue();
findAction().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('flashes error message', () => {
......@@ -431,12 +428,12 @@ describe('EE MRWidget approvals', () => {
});
describe('and can approve', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.user_can_approve = true;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('is shown', () => {
......@@ -449,12 +446,12 @@ describe('EE MRWidget approvals', () => {
});
describe('and cannot approve', () => {
beforeEach(() => {
beforeEach(async () => {
mr.approvals.user_can_approve = false;
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('is shown', () => {
......@@ -469,11 +466,11 @@ describe('EE MRWidget approvals', () => {
});
describe('approvals summary', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'fetchApprovals').mockResolvedValue(testApprovals());
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
it('is rendered with props', () => {
......@@ -493,11 +490,11 @@ describe('EE MRWidget approvals', () => {
describe('footer', () => {
let footer;
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'fetchApprovals').mockResolvedValue(testApprovals());
createComponent();
return wrapper.vm.$nextTick();
await nextTick();
});
beforeEach(() => {
......@@ -516,11 +513,11 @@ describe('EE MRWidget approvals', () => {
describe('when opened', () => {
describe('and loading', () => {
beforeEach(() => {
beforeEach(async () => {
jest.spyOn(service, 'fetchApprovalSettings').mockReturnValue(new Promise(() => {}));
footer.vm.$emit('input', true);
return wrapper.vm.$nextTick();
await nextTick();
});
it('calls service fetch approval rules', () => {
......@@ -534,10 +531,10 @@ describe('EE MRWidget approvals', () => {
});
describe('and finished loading', () => {
beforeEach(() => {
beforeEach(async () => {
footer.vm.$emit('input', true);
return wrapper.vm.$nextTick();
await nextTick();
});
it('sets approval rules', () => {
......@@ -549,11 +546,11 @@ describe('EE MRWidget approvals', () => {
});
describe('and closed', () => {
beforeEach(() => {
beforeEach(async () => {
service.fetchApprovalSettings.mockClear();
footer.vm.$emit('input', false);
return wrapper.vm.$nextTick();
await nextTick();
});
it('does not call service fetch approval rules', () => {
......
ee/spec/frontend/vue_mr_widget/components/merge_immediately_confirmation_dialog_spec.js
View file @ c7209497
import { GlSprintf, GlLink } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import MergeImmediatelyConfirmationDialog from 'ee/vue_merge_request_widget/components/merge_immediately_confirmation_dialog.vue';
import { trimText } from 'helpers/text_helper';
......@@ -7,7 +8,7 @@ describe('MergeImmediatelyConfirmationDialog', () => {
const docsUrl = 'path/to/merge/immediately/docs';
let wrapper;
beforeEach(() => {
beforeEach(async () => {
wrapper = shallowMount(MergeImmediatelyConfirmationDialog, {
propsData: { docsUrl },
stubs: {
......@@ -15,7 +16,7 @@ describe('MergeImmediatelyConfirmationDialog', () => {
},
});
return wrapper.vm.$nextTick();
await nextTick();
});
it('should render informational text explaining why merging immediately can be dangerous', () => {
......
ee/spec/frontend/vue_mr_widget/components/states/mr_widget_enable_feature_prompt_spec.js
View file @ c7209497
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import MrWidgetEnableFeaturePrompt from 'ee/vue_merge_request_widget/components/states/mr_widget_enable_feature_prompt.vue';
import { stubExperiments } from 'helpers/experimentation_helper';
import CiIcon from '~/vue_shared/components/ci_icon.vue';
......@@ -56,7 +57,7 @@ describe('MrWidgetEnableFeaturePrompt', () => {
const button = findDismissButton();
button.vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(localStorage.getItem(LOCAL_STORAGE_KEY)).toBe('true');
expect(wrapper.text()).toBe('');
......
ee/spec/frontend/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
View file @ c7209497
import { GlLink, GlSprintf } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import MergeImmediatelyConfirmationDialog from 'ee/vue_merge_request_widget/components/merge_immediately_confirmation_dialog.vue';
import MergeTrainFailedPipelineConfirmationDialog from 'ee/vue_merge_request_widget/components/merge_train_failed_pipeline_confirmation_dialog.vue';
import MergeTrainHelperIcon from 'ee/vue_merge_request_widget/components/merge_train_helper_icon.vue';
......@@ -297,41 +298,35 @@ describe('ReadyToMerge', () => {
describe('merge immediately warning dialog', () => {
let dialog;
const clickMergeImmediately = () => {
const clickMergeImmediately = async () => {
dialog = wrapper.findComponent(MergeImmediatelyConfirmationDialog);
expect(dialog.exists()).toBe(true);
dialog.vm.show = jest.fn();
vm.handleMergeButtonClick = jest.fn();
findMergeButtonDropdown().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
findMergeImmediatelyButton().trigger('click');
return wrapper.vm.$nextTick();
});
await nextTick();
};
it('should show a warning dialog asking for confirmation if the user is trying to skip the merge train', () => {
it('should show a warning dialog asking for confirmation if the user is trying to skip the merge train', async () => {
factory({ preferredAutoMergeStrategy: MT_MERGE_STRATEGY }, false);
return clickMergeImmediately().then(() => {
await clickMergeImmediately();
expect(dialog.vm.show).toHaveBeenCalled();
expect(vm.handleMergeButtonClick).not.toHaveBeenCalled();
});
});
it('should perform the merge when the user confirms their intent to merge immediately', () => {
it('should perform the merge when the user confirms their intent to merge immediately', async () => {
factory({ preferredAutoMergeStrategy: MT_MERGE_STRATEGY }, false);
return clickMergeImmediately()
.then(() => {
await clickMergeImmediately();
dialog.vm.$emit('mergeImmediately');
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
// false (no auto merge), true (merge immediately), true (confirmation clicked)
expect(vm.handleMergeButtonClick).toHaveBeenCalledWith(false, true, true);
});
});
it('should not ask for confirmation in non-merge train scenarios', () => {
it('should not ask for confirmation in non-merge train scenarios', async () => {
factory(
{
isPipelineActive: true,
......@@ -339,12 +334,11 @@ describe('ReadyToMerge', () => {
},
false,
);
return clickMergeImmediately().then(() => {
await clickMergeImmediately();
expect(dialog.vm.show).not.toHaveBeenCalled();
expect(vm.handleMergeButtonClick).toHaveBeenCalled();
});
});
});
describe('cannot merge', () => {
describe('when isMergeAllowed=false', () => {
......
ee/spec/frontend/vue_mr_widget/ee_mr_widget_options_spec.js
View file @ c7209497
......@@ -393,25 +393,24 @@ describe('ee merge request widget options', () => {
describe('text connector', () => {
it('should only render information about fixed issues', (done) => {
setImmediate(() => {
setImmediate(async () => {
wrapper.vm.mr.browserPerformanceMetrics.degraded = [];
wrapper.vm.mr.browserPerformanceMetrics.same = [];
nextTick(() => {
await nextTick();
expect(
trimText(wrapper.find('.js-browser-performance-widget .js-code-text').text()),
).toEqual('Browser performance test metrics: 1 improved');
done();
});
});
});
it('should only render information about added issues', (done) => {
setImmediate(() => {
setImmediate(async () => {
wrapper.vm.mr.browserPerformanceMetrics.improved = [];
wrapper.vm.mr.browserPerformanceMetrics.same = [];
nextTick(() => {
await nextTick();
expect(
trimText(wrapper.find('.js-browser-performance-widget .js-code-text').text()),
).toEqual('Browser performance test metrics: 2 degraded');
......@@ -420,7 +419,6 @@ describe('ee merge request widget options', () => {
});
});
});
});
describe.each`
degradation_threshold | shouldExist
......@@ -537,28 +535,24 @@ describe('ee merge request widget options', () => {
});
describe('text connector', () => {
it('should only render information about fixed issues', (done) => {
it('should only render information about fixed issues', async () => {
wrapper.vm.mr.loadPerformanceMetrics.degraded = [];
wrapper.vm.mr.loadPerformanceMetrics.same = [];
nextTick(() => {
expect(
trimText(wrapper.find('.js-load-performance-widget .js-code-text').text()),
).toBe('Load performance test metrics: 2 improved');
done();
});
await nextTick();
expect(trimText(wrapper.find('.js-load-performance-widget .js-code-text').text())).toBe(
'Load performance test metrics: 2 improved',
);
});
it('should only render information about added issues', (done) => {
it('should only render information about added issues', async () => {
wrapper.vm.mr.loadPerformanceMetrics.improved = [];
wrapper.vm.mr.loadPerformanceMetrics.same = [];
nextTick(() => {
expect(
trimText(wrapper.find('.js-load-performance-widget .js-code-text').text()),
).toBe('Load performance test metrics: 1 degraded');
done();
});
await nextTick();
expect(trimText(wrapper.find('.js-load-performance-widget .js-code-text').text())).toBe(
'Load performance test metrics: 1 degraded',
);
});
});
});
......@@ -1091,34 +1085,28 @@ describe('ee merge request widget options', () => {
});
});
it('renders when user cannot remove branch and branch should be removed', (done) => {
it('renders when user cannot remove branch and branch should be removed', async () => {
wrapper.vm.mr.canRemoveSourceBranch = false;
wrapper.vm.mr.shouldRemoveSourceBranch = true;
wrapper.vm.mr.state = 'readyToMerge';
nextTick(() => {
await nextTick();
const tooltip = wrapper.find('[data-testid="question-o-icon"]');
expect(wrapper.text()).toContain('Deletes the source branch');
expect(tooltip.attributes('title')).toBe(
'A user with write access to the source branch selected this option',
);
done();
});
});
it('does not render in merged state', (done) => {
it('does not render in merged state', async () => {
wrapper.vm.mr.canRemoveSourceBranch = false;
wrapper.vm.mr.shouldRemoveSourceBranch = true;
wrapper.vm.mr.state = 'merged';
nextTick(() => {
await nextTick();
expect(wrapper.text()).toContain('The source branch has been deleted');
expect(wrapper.text()).not.toContain('Removes source branch');
done();
});
});
});
......@@ -1137,7 +1125,7 @@ describe('ee merge request widget options', () => {
status: SUCCESS,
};
beforeEach((done) => {
beforeEach(async () => {
createComponent({
propsData: {
mrData: {
......@@ -1156,7 +1144,7 @@ describe('ee merge request widget options', () => {
},
);
nextTick(done);
await nextTick();
});
it('renders multiple deployments', () => {
......
ee/spec/frontend/vue_shared/components/accordion/accordion_item_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { uniqueId } from 'lodash';
import { AccordionItem } from 'ee/vue_shared/components/accordion';
import accordionEventBus from 'ee/vue_shared/components/accordion/accordion_event_bus';
......@@ -89,18 +90,17 @@ describe('AccordionItem component', () => {
it.each([true, false])(
'passes the "isExpanded" and "isDisabled" state to the title slot',
(state) => {
async (state) => {
const titleSlot = jest.fn();
factory({ propsData: { disabled: state }, titleSlot });
wrapper.vm.isExpanded = state;
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(titleSlot).toHaveBeenCalledWith({
isExpanded: state,
isDisabled: state,
});
});
},
);
});
......@@ -112,15 +112,14 @@ describe('AccordionItem component', () => {
expect(contentContainer().isVisible()).toBe(false);
});
it('expands when the trigger-element gets clicked', () => {
it('expands when the trigger-element gets clicked', async () => {
expect(contentContainer().isVisible()).toBe(false);
expansionTrigger().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(contentContainer().isVisible()).toBe(true);
});
});
it('emits a namespaced "closeOtherAccordionItems" event, containing the trigger item as a payload', () => {
expansionTrigger().trigger('click');
......@@ -178,17 +177,16 @@ describe('AccordionItem component', () => {
expect(contentContainer().attributes('id')).toBe(mockUniqueId);
});
it('has a trigger element that has an "aria-expanded" attribute set, to show if it is expanded or collapsed', () => {
it('has a trigger element that has an "aria-expanded" attribute set, to show if it is expanded or collapsed', async () => {
expect(expansionTrigger().attributes('aria-expanded')).toBeFalsy();
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ isExpanded: true });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(expansionTrigger().attributes('aria-expanded')).toBe('true');
});
});
it('has a trigger element that has a "aria-controls" attribute, which points to the content element', () => {
expect(expansionTrigger().attributes('aria-controls')).toBeTruthy();
......
ee/spec/frontend/vue_shared/components/filtered_search_bar/tokens/epic_token_spec.js
View file @ c7209497
import { GlFilteredSearchTokenSegment } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
......@@ -79,7 +79,7 @@ describe('EpicToken', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
});
});
......@@ -138,7 +138,7 @@ describe('EpicToken', () => {
data: { epics: mockEpics },
});
await wrapper.vm.$nextTick();
await nextTick();
});
it('renders BaseToken component', () => {
......@@ -161,7 +161,7 @@ describe('EpicToken', () => {
value: { data: value },
});
await wrapper.vm.$nextTick();
await nextTick();
expect(getTokenValueEl().text()).toBe(tokenValueString);
});
......
ee/spec/frontend/vue_shared/components/filtered_search_bar/tokens/iteration_token_spec.js
View file @ c7209497
......@@ -4,6 +4,7 @@ import {
GlFilteredSearchSuggestion,
} from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import createFlash from '~/flash';
import IterationToken from 'ee/vue_shared/components/filtered_search_bar/tokens/iteration_token.vue';
......@@ -70,7 +71,7 @@ describe('IterationToken', () => {
it('renders iteration value', async () => {
wrapper = createComponent({ value: { data: id } });
await wrapper.vm.$nextTick();
await nextTick();
const tokenSegments = wrapper.findAllComponents(GlFilteredSearchTokenSegment);
......
ee/spec/frontend/vue_shared/components/sidebar/epics_select/base_spec.js
View file @ c7209497
import { GlLoadingIcon, GlDropdown, GlDropdownItem, GlSearchBoxByType } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { DropdownVariant } from 'ee/vue_shared/components/sidebar/epics_select//constants';
import EpicsSelectBase from 'ee/vue_shared/components/sidebar/epics_select/base.vue';
import DropdownValue from 'ee/vue_shared/components/sidebar/epics_select/dropdown_value.vue';
......@@ -74,7 +75,7 @@ describe('EpicsSelect', () => {
issueId: 123,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.$store.state.issueId).toBe(123);
});
});
......@@ -85,7 +86,7 @@ describe('EpicsSelect', () => {
initialEpic: mockEpic2,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.$store.state.selectedEpic).toBe(mockEpic2);
});
});
......@@ -96,7 +97,7 @@ describe('EpicsSelect', () => {
initialEpic: mockEpic2,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.$store.state.selectedEpic).toBe(mockEpic2);
});
});
......@@ -109,14 +110,14 @@ describe('EpicsSelect', () => {
it('should call action `fetchEpics` with `searchQuery` when value is set and `groupEpics` is empty', async () => {
wrapper.vm.$store.dispatch('setSearchQuery', 'foo');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.fetchEpics).toHaveBeenCalledWith('foo');
});
it('should call action `fetchEpics` without any params when value is empty', async () => {
wrapper.vm.$store.dispatch('setSearchQuery', '');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.fetchEpics).toHaveBeenCalledWith();
});
});
......@@ -175,7 +176,7 @@ describe('EpicsSelect', () => {
epicIssueId: 0,
});
await wrapperStandalone.vm.$nextTick();
await nextTick();
wrapperStandalone.vm.handleItemSelect(mockEpic2);
expect(wrapperStandalone.emitted('epicSelect')).toBeTruthy();
......@@ -219,7 +220,7 @@ describe('EpicsSelect', () => {
it('should render DropdownValue component when `showDropdown` is false', async () => {
wrapper.vm.showDropdown = false;
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(DropdownValue).exists()).toBe(true);
});
......@@ -230,7 +231,7 @@ describe('EpicsSelect', () => {
it('should render dropdown container element when props `canEdit` & `showDropdown` are true', async () => {
showDropdown();
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('.epic-dropdown-container').exists()).toBe(true);
expect(wrapper.findComponent(GlDropdown).exists()).toBe(true);
});
......@@ -242,20 +243,20 @@ describe('EpicsSelect', () => {
it('should render dropdown menu container element when props `canEdit` & `showDropdown` are true', async () => {
showDropdown();
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('.dropdown-menu-epics').exists()).toBe(true);
});
it('should render a dropdown header component when props `canEdit` & `showDropdown` are true', async () => {
showDropdown();
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(GlDropdown).props('headerText')).toBe('Assign Epic');
});
it('should render a dropdown header component when variant is "standalone"', async () => {
showDropdown(wrapperStandalone);
await wrapperStandalone.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(GlDropdown).props('headerText')).toBe('Assign Epic');
});
......@@ -263,7 +264,7 @@ describe('EpicsSelect', () => {
showDropdown();
store.dispatch('receiveEpicsSuccess', [mockEpic1]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findAllComponents(GlDropdownItem)).toHaveLength(2);
});
......@@ -271,7 +272,7 @@ describe('EpicsSelect', () => {
showDropdown();
store.dispatch('requestEpics');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findComponent(GlDropdown).findComponent(GlLoadingIcon).exists()).toBe(true);
});
......
ee/spec/frontend/vue_shared/components/sidebar/epics_select/dropdown_value_spec.js
View file @ c7209497
import { GlLink } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import DropdownValue from 'ee/vue_shared/components/sidebar/epics_select/dropdown_value.vue';
import { mockEpic1 } from '../mock_data';
......@@ -30,17 +31,16 @@ describe('EpicsSelect', () => {
expect(wrapper.vm.hasEpic).toBe(true);
});
it('should return `false` when provided `epic` prop is an invalid Epic object', () => {
it('should return `false` when provided `epic` prop is an invalid Epic object', async () => {
wrapper.setProps({
epic: {},
});
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.vm.hasEpic).toBe(false);
});
});
});
});
describe('template', () => {
it('should render component container', () => {
......@@ -57,12 +57,12 @@ describe('EpicsSelect', () => {
expect(titleEl.text()).toBe(mockEpic1.title);
});
it('should render no value element with slot contents when `hasEpic` is false', () => {
it('should render no value element with slot contents when `hasEpic` is false', async () => {
wrapper.setProps({
epic: {},
});
return wrapper.vm.$nextTick().then(() => {
await nextTick();
const noValueEl = wrapper.find('span.no-value');
expect(noValueEl.exists()).toBe(true);
......@@ -70,5 +70,4 @@ describe('EpicsSelect', () => {
});
});
});
});
});
ee/spec/frontend/vue_shared/license_compliance/components/delete_confirmation_modal_spec.js
View file @ c7209497
import { GlModal, GlSprintf } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import Component from 'ee/vue_shared/license_compliance/components/delete_confirmation_modal.vue';
import { approvedLicense } from '../mock_data';
......@@ -98,13 +98,13 @@ describe('DeleteConfirmationModal', () => {
describe('interaction', () => {
it('triggering resetLicenseInModal on cancel', async () => {
findModal().vm.$emit('cancel', mockEvent);
await wrapper.vm.$nextTick();
await nextTick();
expect(actions.resetLicenseInModal).toHaveBeenCalled();
});
it('triggering deleteLicense on cancel', async () => {
findModal().vm.$emit('primary', mockEvent);
await wrapper.vm.$nextTick();
await nextTick();
expect(actions.deleteLicense).toHaveBeenCalled();
});
});
......
ee/spec/frontend/vue_shared/license_compliance/license_management_spec.js
View file @ c7209497
import { GlButton, GlLoadingIcon, GlIcon, GlPopover } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import LicenseComplianceApprovals from 'ee/approvals/components/license_compliance/index.vue';
import AddLicenseForm from 'ee/vue_shared/license_compliance/components/add_license_form.vue';
......@@ -127,7 +127,7 @@ describe('License Management', () => {
describe('permission based functionality', () => {
describe('when admin', () => {
it('should invoke `setLicenseApproval` action on `addLicense` event on form only', () => {
it('should invoke `setLicenseApproval` action on `addLicense` event on form only', async () => {
const setLicenseApprovalMock = jest.fn();
createComponent({
state: { isLoadingManagedLicenses: false },
......@@ -136,11 +136,10 @@ describe('License Management', () => {
});
wrapper.findComponent(GlButton).vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
wrapper.findComponent(AddLicenseForm).vm.$emit('addLicense');
expect(setLicenseApprovalMock).toHaveBeenCalled();
});
});
describe('when not loading', () => {
beforeEach(() => {
......@@ -151,14 +150,13 @@ describe('License Management', () => {
expect(wrapper.findComponent(LicenseComplianceApprovals).exists()).toBe(true);
});
it('should render the form if the form is open and disable the form button', () => {
it('should render the form if the form is open and disable the form button', async () => {
wrapper.findComponent(GlButton).vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.findComponent(AddLicenseForm).exists()).toBe(true);
expect(wrapper.findComponent(GlButton).attributes('disabled')).toBe('true');
});
});
it('should not render the form if the form is closed and have active button', () => {
expect(wrapper.findComponent(AddLicenseForm).exists()).toBe(false);
......
ee/spec/frontend/vue_shared/security_reports/components/dismiss_button_spec.js
View file @ c7209497
import { GlButton } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import component from 'ee/vue_shared/security_reports/components/dismiss_button.vue';
describe('DismissalButton', () => {
......@@ -21,24 +22,22 @@ describe('DismissalButton', () => {
expect(wrapper.text()).toBe('Dismiss vulnerability');
});
it('should emit dismiss vulnerability when clicked', () => {
it('should emit dismiss vulnerability when clicked', async () => {
wrapper.findComponent(GlButton).trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().dismissVulnerability).toBeTruthy();
});
});
it('should render the dismiss with comment button', () => {
expect(wrapper.find('.js-dismiss-with-comment').exists()).toBe(true);
});
it('should emit openDismissalCommentBox when clicked', () => {
it('should emit openDismissalCommentBox when clicked', async () => {
wrapper.find('.js-dismiss-with-comment').trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().openDismissalCommentBox).toBeTruthy();
});
});
});
describe('with a dismissed vulnerability', () => {
beforeEach(() => {
......@@ -52,12 +51,11 @@ describe('DismissalButton', () => {
expect(wrapper.text()).toBe('Undo dismiss');
});
it('should emit revertDismissVulnerability when clicked', () => {
it('should emit revertDismissVulnerability when clicked', async () => {
wrapper.findComponent(GlButton).trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().revertDismissVulnerability).toBeTruthy();
});
});
it('should not render the dismiss with comment button', () => {
expect(wrapper.find('.js-dismiss-with-comment').exists()).toBe(false);
......
ee/spec/frontend/vue_shared/security_reports/components/dismissal_comment_box_spec.js
View file @ c7209497
import { GlFormTextarea } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import component from 'ee/vue_shared/security_reports/components/dismissal_comment_box.vue';
describe('DismissalCommentBox', () => {
......@@ -18,31 +19,28 @@ describe('DismissalCommentBox', () => {
expect(wrapper.emitted().clearError).toBeTruthy();
});
it('should submit the comment when cmd+enter is pressed', () => {
it('should submit the comment when cmd+enter is pressed', async () => {
wrapper.findComponent(GlFormTextarea).trigger('keydown.enter', {
metaKey: true,
});
return wrapper.vm.$nextTick(() => {
await nextTick();
expect(wrapper.emitted().submit).toBeTruthy();
});
});
it('should render the error message', () => {
it('should render the error message', async () => {
const errorMessage = 'You did something wrong';
wrapper.setProps({ errorMessage });
return wrapper.vm.$nextTick(() => {
await nextTick();
expect(wrapper.find('.js-error').text()).toBe(errorMessage);
});
});
it('should render the placeholder', () => {
it('should render the placeholder', async () => {
const placeholder = 'Please type into the box';
wrapper.setProps({ placeholder });
return wrapper.vm.$nextTick(() => {
await nextTick();
expect(wrapper.findComponent(GlFormTextarea).attributes('placeholder')).toBe(placeholder);
});
});
});
ee/spec/frontend/vue_shared/security_reports/components/dismissal_comment_modal_footer_spec.js
View file @ c7209497
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import component from 'ee/vue_shared/security_reports/components/dismissal_comment_modal_footer.vue';
import Tracking from '~/tracking';
......@@ -29,26 +30,24 @@ describe('DismissalCommentModalFooter', () => {
expect(findAddAndDismissButton().text()).toBe('Add comment & dismiss');
});
it('should emit the "addCommentAndDismiss" event when clicked', () => {
it('should emit the "addCommentAndDismiss" event when clicked', async () => {
findAddAndDismissButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().addCommentAndDismiss).toBeTruthy();
expect(Tracking.event).toHaveBeenCalledWith(
'_track_category_',
'click_add_comment_and_dismiss',
);
});
});
it('should emit the cancel event when the cancel button is clicked', () => {
it('should emit the cancel event when the cancel button is clicked', async () => {
wrapper.find('.js-cancel').trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().cancel).toBeTruthy();
});
});
});
describe('with an already dismissed vulnerability', () => {
describe('and adding a comment', () => {
......@@ -63,15 +62,14 @@ describe('DismissalCommentModalFooter', () => {
expect(findAddAndDismissButton().text()).toBe('Add comment');
});
it('should emit the "addCommentAndDismiss" event when clicked', () => {
it('should emit the "addCommentAndDismiss" event when clicked', async () => {
findAddAndDismissButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().addDismissalComment).toBeTruthy();
expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_add_comment');
});
});
});
describe('and editing a comment', () => {
beforeEach(() => {
......@@ -86,14 +84,13 @@ describe('DismissalCommentModalFooter', () => {
expect(findAddAndDismissButton().text()).toBe('Save comment');
});
it('should emit the "addCommentAndDismiss" event when clicked', () => {
it('should emit the "addCommentAndDismiss" event when clicked', async () => {
findAddAndDismissButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().addDismissalComment).toBeTruthy();
expect(Tracking.event).toHaveBeenCalledWith('_track_category_', 'click_edit_comment');
});
});
});
});
});
ee/spec/frontend/vue_shared/security_reports/components/event_item_spec.js
View file @ c7209497
import { GlButton } from '@gitlab/ui';
import { nextTick } from 'vue';
import { shallowMountExtended, mountExtended } from 'helpers/vue_test_utils_helper';
import Component from 'ee/vue_shared/security_reports/components/event_item.vue';
import NoteHeader from '~/notes/components/note_header.vue';
......@@ -96,19 +97,14 @@ describe('Event Item', () => {
expect(wrapper.element).toMatchSnapshot();
});
it('emits the button events when clicked', () => {
it('emits the button events when clicked', async () => {
const buttons = wrapper.findAllComponents(GlButton);
buttons.at(0).trigger('click');
return wrapper.vm
.$nextTick()
.then(() => {
await nextTick();
buttons.at(1).trigger('click');
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
expect(propsData.actionButtons[0].onClick).toHaveBeenCalledTimes(1);
expect(propsData.actionButtons[1].onClick).toHaveBeenCalledTimes(1);
});
});
});
});
ee/spec/frontend/vue_shared/security_reports/components/modal_footer_spec.js
View file @ c7209497
import { GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import DismissButton from 'ee/vue_shared/security_reports/components/dismiss_button.vue';
import component from 'ee/vue_shared/security_reports/components/modal_footer.vue';
import SplitButton from 'ee/vue_shared/security_reports/components/split_button.vue';
......@@ -40,14 +41,13 @@ describe('Security Reports modal footer', () => {
expect(findActionButton().text()).toBe('Create issue');
});
it('emits createIssue when create issue button is clicked', () => {
it('emits createIssue when create issue button is clicked', async () => {
findActionButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().createNewIssue).toBeTruthy();
});
});
});
describe('can only create jira issue', () => {
const url = 'https://gitlab.atlassian.net/create-issue';
......@@ -95,14 +95,13 @@ describe('Security Reports modal footer', () => {
expect(findActionButton().text()).toBe('Resolve with merge request');
});
it('emits createMergeRequest when create merge request button is clicked', () => {
it('emits createMergeRequest when create merge request button is clicked', async () => {
findActionButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().createMergeRequest).toBeTruthy();
});
});
});
describe('can download download patch', () => {
beforeEach(() => {
......@@ -118,14 +117,13 @@ describe('Security Reports modal footer', () => {
expect(findActionButton().text()).toBe('Download patch to resolve');
});
it('emits downloadPatch when download patch button is clicked', () => {
it('emits downloadPatch when download patch button is clicked', async () => {
findActionButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.emitted().downloadPatch).toBeTruthy();
});
});
});
describe('can create merge request and issue', () => {
beforeEach(() => {
......
ee/spec/frontend/vue_shared/security_reports/components/solution_card_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import SolutionCard from 'ee/vue_shared/security_reports/components/solution_card.vue';
import { s__ } from '~/locale';
......@@ -57,9 +58,9 @@ describe('Solution Card', () => {
});
describe('with download patch', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper.setProps({ hasDownload: true });
return wrapper.vm.$nextTick();
await nextTick();
});
it('renders the create a merge request to implement this solution message', () => {
......
ee/spec/frontend/vue_shared/security_reports/components/solution_card_vuex_spec.js
View file @ c7209497
import { GlCard } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import component from 'ee/vue_shared/security_reports/components/solution_card_vuex.vue';
import { s__ } from '~/locale';
......@@ -78,17 +78,16 @@ describe('Solution Card', () => {
});
describe('with download patch', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper.setProps({ hasDownload: true });
return wrapper.vm.$nextTick();
await nextTick();
});
it('does not render the download and apply solution message when there is a file download and a merge request already exists', () => {
it('does not render the download and apply solution message when there is a file download and a merge request already exists', async () => {
wrapper.setProps({ hasMr: true });
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(wrapper.find('.card-footer').exists()).toBe(false);
});
});
it('renders the create a merge request to implement this solution message', () => {
expect(wrapper.find('[data-testid="merge-request-solution"]').text()).toMatch(
......
ee/spec/frontend/vue_shared/survey_banner/survey_banner_spec.js
View file @ c7209497
import { GlBanner, GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import SharedSurveyBanner from 'ee/vue_shared/survey_banner/survey_banner.vue';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
......@@ -77,7 +78,7 @@ describe('Shared Survey Banner component', () => {
async ({ localStorageValue, isShown }) => {
localStorage.setItem(TEST_LOCAL_STORAGE_KEY, localStorageValue);
createWrapper();
await wrapper.vm.$nextTick();
await nextTick();
expect(findGlBanner().exists()).toBe(isShown);
},
......@@ -92,7 +93,7 @@ describe('Shared Survey Banner component', () => {
expect(findGlBanner().exists()).toBe(true);
findAskLaterButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
const date = new Date(localStorage.getItem(TEST_LOCAL_STORAGE_KEY));
expect(findGlBanner().exists()).toBe(false);
......@@ -104,7 +105,7 @@ describe('Shared Survey Banner component', () => {
expect(findGlBanner().exists()).toBe(true);
findGlBanner().vm.$emit('close');
await wrapper.vm.$nextTick();
await nextTick();
expect(findGlBanner().exists()).toBe(false);
expect(localStorage.getItem(TEST_LOCAL_STORAGE_KEY)).toBe(TEST_BANNER_ID);
......
ee/spec/frontend/vulnerabilities/header_spec.js
View file @ c7209497
import { GlButton, GlBadge } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import MockAdapter from 'axios-mock-adapter';
import VueApollo from 'vue-apollo';
import Api from 'ee/api';
......@@ -285,14 +285,13 @@ describe('Vulnerability Header', () => {
expect(findGlButton().text()).toBe('Download patch to resolve');
});
it('emits downloadPatch when download patch button is clicked', () => {
it('emits downloadPatch when download patch button is clicked', async () => {
findGlButton().vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(download).toHaveBeenCalledWith({ fileData: diff, fileName: `remediation.patch` });
});
});
});
});
describe('state badge', () => {
const badgeVariants = {
......@@ -369,7 +368,7 @@ describe('Vulnerability Header', () => {
it('the resolution alert component should not be shown if when the vulnerability is already resolved', async () => {
wrapper.vm.vulnerability.state = 'resolved';
await wrapper.vm.$nextTick();
await nextTick();
const alert = findResolutionAlert();
expect(alert.exists()).toBe(false);
......
ee/spec/frontend/vulnerabilities/history_comment_editor_spec.js
View file @ c7209497
import { GlFormTextarea } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import HistoryCommentEditor from 'ee/vulnerabilities/components/history_comment_editor.vue';
describe('History Comment Editor', () => {
......@@ -76,7 +77,7 @@ describe('History Comment Editor', () => {
it('disables the save button when there is no text or only whitespace in the textarea', async () => {
createWrapper({ initialComment: 'some comment' });
textarea().vm.$emit('input', ' ');
await wrapper.vm.$nextTick();
await nextTick();
expect(saveButton().props('disabled')).toBe(true);
});
......
ee/spec/frontend/vulnerabilities/history_comment_spec.js
View file @ c7209497
import { mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import createNoteMutation from 'ee/security_dashboard/graphql/mutations/note_create.mutation.graphql';
import destroyNoteMutation from 'ee/security_dashboard/graphql/mutations/note_destroy.mutation.graphql';
......@@ -104,14 +104,14 @@ describe('History Comment', () => {
// Either the add comment button or the edit button will exist, but not both at the same time, so we'll just find
// whichever one exists and click it to show the editor.
const showEditView = () => {
const showEditView = async () => {
if (addCommentButton().exists()) {
addCommentButton().trigger('click');
} else {
editButton().vm.$emit('click');
}
return wrapper.vm.$nextTick();
await nextTick();
};
const editAndSaveNewContent = async (content) => {
......@@ -138,13 +138,11 @@ describe('History Comment', () => {
});
});
it('shows the add comment button when the cancel button is clicked in the comment editor', () => {
return showEditView()
.then(() => {
it('shows the add comment button when the cancel button is clicked in the comment editor', async () => {
await showEditView();
commentEditor().vm.$emit('onCancel');
return wrapper.vm.$nextTick();
})
.then(expectAddCommentView);
await nextTick();
expectAddCommentView();
});
});
......@@ -165,39 +163,30 @@ describe('History Comment', () => {
});
});
it('shows the comment when the cancel button is clicked in the comment editor', () => {
return showEditView()
.then(() => {
it('shows the comment when the cancel button is clicked in the comment editor', async () => {
await showEditView();
commentEditor().vm.$emit('onCancel');
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
expectExistingCommentView();
expect(eventItem().element.innerHTML).toContain(note.bodyHtml);
});
});
it('shows the delete confirmation buttons when the delete button is clicked', () => {
it('shows the delete confirmation buttons when the delete button is clicked', async () => {
deleteButton().trigger('click');
return wrapper.vm.$nextTick().then(expectDeleteConfirmView);
await nextTick();
expectDeleteConfirmView();
});
it('shows the comment when the cancel button is clicked on the delete confirmation', () => {
it('shows the comment when the cancel button is clicked on the delete confirmation', async () => {
deleteButton().trigger('click');
return wrapper.vm
.$nextTick()
.then(() => {
await nextTick();
cancelDeleteButton().trigger('click');
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
expectExistingCommentView();
expect(eventItem().element.innerHTML).toContain(note.bodyHtml);
});
});
});
const EXPECTED_CREATE_VARS = {
discussionId: TEST_DISCUSSION_GID,
......@@ -233,7 +222,7 @@ describe('History Comment', () => {
createWrapper({ propsData });
await editAndSaveNewContent('new comment');
await wrapper.vm.$nextTick();
await nextTick();
expect(commentEditor().props('isSaving')).toBe(true);
});
......@@ -297,10 +286,10 @@ describe('History Comment', () => {
deleteButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
confirmDeleteButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(confirmDeleteButton().props('loading')).toBe(true);
expect(cancelDeleteButton().props('disabled')).toBe(true);
......@@ -313,7 +302,7 @@ describe('History Comment', () => {
createWrapper({ propsData: { comment: note } });
deleteButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
confirmDeleteButton().trigger('click');
expect(destroyNoteMutationSpy).toHaveBeenCalledWith({
......@@ -327,7 +316,7 @@ describe('History Comment', () => {
deleteButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
confirmDeleteButton().trigger('click');
await waitForPromises();
......@@ -343,7 +332,7 @@ describe('History Comment', () => {
deleteButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
confirmDeleteButton().trigger('click');
await waitForPromises();
......
ee/spec/frontend/vulnerabilities/related_issues_spec.js
View file @ c7209497
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import RelatedIssues from 'ee/vulnerabilities/components/related_issues.vue';
import createFlash from '~/flash';
import axios from '~/lib/utils/axios_utils';
......@@ -178,7 +179,7 @@ describe('Vulnerability related issues component', () => {
createWrapper({ data: { isFormVisible: from } });
blockEmit('toggleAddRelatedIssuesForm');
await wrapper.vm.$nextTick();
await nextTick();
expect(blockProp('isFormVisible')).toBe(to);
});
......@@ -191,7 +192,7 @@ describe('Vulnerability related issues component', () => {
},
});
blockEmit('addIssuableFormCancel');
await wrapper.vm.$nextTick();
await nextTick();
expect(blockProp('isFormVisible')).toBe(false);
expect(blockProp('inputValue')).toBe('');
......@@ -206,7 +207,7 @@ describe('Vulnerability related issues component', () => {
const touchedReference = 'touchedReference';
createWrapper({ data: { state: { pendingReferences } } });
blockEmit('addIssuableFormInput', { untouchedRawReferences, touchedReference });
await wrapper.vm.$nextTick();
await nextTick();
expect(blockProp('pendingReferences')).toEqual(
pendingReferences.concat(untouchedRawReferences),
......@@ -217,7 +218,7 @@ describe('Vulnerability related issues component', () => {
it('processes pending references', async () => {
createWrapper();
blockEmit('addIssuableFormBlur', '135 246');
await wrapper.vm.$nextTick();
await nextTick();
expect(blockProp('pendingReferences')).toEqual(['135', '246']);
expect(blockProp('inputValue')).toBe('');
......@@ -226,7 +227,7 @@ describe('Vulnerability related issues component', () => {
it('removes pending reference', async () => {
createWrapper({ data: { state: { pendingReferences: ['135', '246', '357'] } } });
blockEmit('pendingIssuableRemoveRequest', 1);
await wrapper.vm.$nextTick();
await nextTick();
expect(blockProp('pendingReferences')).toEqual(['135', '357']);
});
......
ee/spec/frontend/vulnerabilities/vulnerability_state_dropdown_spec.js
View file @ c7209497
import { GlDropdown } from '@gitlab/ui';
import { nextTick } from 'vue';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import VulnerabilityStateDropdown from 'ee/vulnerabilities/components/vulnerability_state_dropdown.vue';
import { VULNERABILITY_STATE_OBJECTS } from 'ee/vulnerabilities/constants';
......@@ -51,18 +52,17 @@ describe('Vulnerability state dropdown component', () => {
it.each(vulnerabilityStateObjects)(
`when the %s dropdown item is clicked, it's the only one that's selected`,
({ state }) => {
async ({ state }) => {
// Start off with an unknown state so we can click through each item and see it change.
createWrapper('some unknown state');
const dropdownItem = dropdownItemFor(state);
dropdownItem.trigger('click');
return wrapper.vm.$nextTick().then(() => {
await nextTick();
dropdownItems().wrappers.forEach((item) => {
expect(isSelected(item)).toBe(item.attributes('data-testid') === state);
});
});
},
);
});
......@@ -70,78 +70,67 @@ describe('Vulnerability state dropdown component', () => {
describe('tests that use the default wrapper', () => {
beforeEach(() => createWrapper());
it('the save button should be enabled/disabled based on if the selected item has changed or not', () => {
it('the save button should be enabled/disabled based on if the selected item has changed or not', async () => {
const originalItem = selectedItem();
expect(isDisabled(saveButton())).toBe(true); // Check that the save button starts off as disabled.
firstUnselectedItem().trigger('click'); // Click on an unselected item.
return wrapper.vm
.$nextTick()
.then(() => {
await nextTick();
expect(isDisabled(saveButton())).toBe(false); // Check that the save button has been enabled.
originalItem.trigger('click'); // Re-select the original item.
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
expect(isDisabled(saveButton())).toBe(true); // Check that the save button has once again been disabled.
});
});
it('clicking on the save button will close the dropdown and fire a change event', () => {
it('clicking on the save button will close the dropdown and fire a change event', async () => {
createWrapper();
expect(isDisabled(saveButton())).toBe(true); // Check that the save button starts off disabled.
firstUnselectedItem().trigger('click'); // Click on an unselected item.
return wrapper.vm.$nextTick().then(() => {
await nextTick();
saveButton().vm.$emit('click'); // Click on the save button.
const changeEvent = wrapper.emitted('change');
expect(wrapper.vm.$refs.dropdown.hide).toHaveBeenCalledTimes(1); // Check that the dropdown hide function was called.
expect(changeEvent).toHaveLength(1); // Check that a change event was emitted.
expect(changeEvent[0][0]).toBeTruthy(); // Check that the change event has been emitted with something as its first parameter.
});
});
it('clicking on the cancel button will close the dropdown without emitting any events', () => {
it('clicking on the cancel button will close the dropdown without emitting any events', async () => {
expect(isDisabled(saveButton())).toBe(true); // Check that the save button starts out disabled.
firstUnselectedItem().trigger('click'); // Click on an unselected item.
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(isDisabled(saveButton())).toBe(false); // Check that the save button is enabled.
cancelButton().vm.$emit('click'); // Click on the cancel button.
expect(Object.keys(wrapper.emitted())).toHaveLength(0); // Check that no events have been emitted.
expect(wrapper.vm.$refs.dropdown.hide).toHaveBeenCalledTimes(1); // Check that hide was called on the inner dropdown.
});
});
it('when the dropdown is closed, the selected item resets back to the initial item', () => {
it('when the dropdown is closed, the selected item resets back to the initial item', async () => {
const initialSelectedItem = selectedItem();
firstUnselectedItem().trigger('click'); // Click on an unselected item.
return wrapper.vm
.$nextTick()
.then(() => {
await nextTick();
expect(selectedItem().element).not.toBe(initialSelectedItem.element); // Check that the selected item actually changed.
innerDropdown().vm.$emit('hide'); // Emit the dropdown hide event.
return wrapper.vm.$nextTick();
})
.then(() => {
await nextTick();
expect(selectedItem().element).toBe(initialSelectedItem.element); // Check that the selected item has been reset back to the initial item.
});
});
it('when the parent component changes the state, the dropdown will update its selected and initial item', () => {
it('when the parent component changes the state, the dropdown will update its selected and initial item', async () => {
const stateObject = vulnerabilityStateObjects[1];
wrapper.setProps({ initialState: stateObject.state }); // Change the state.
return wrapper.vm.$nextTick().then(() => {
await nextTick();
expect(innerDropdown().props('text')).toBe(stateObject.buttonText); // Check that the dropdown button's value matches the initial state.
expect(selectedItem().text()).toMatch(stateObject.dropdownText); // Check that the selected item is the initial state.
expect(isDisabled(saveButton())).toBe(true); // Check that the save button is disabled.
});
});
});
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7