Skip to content

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

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

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

See merge request gitlab-org/gitlab!79054
parents 449acc99 ff36ae26
Hide whitespace changes
Inline Side-by-side
Showing with 369 additions and 373 deletions
spec/frontend/performance_bar/components/add_request_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import AddRequest from '~/performance_bar/components/add_request.vue';
describe('add request form', () => {
......@@ -17,9 +18,9 @@ describe('add request form', () => {
});
describe('when clicking the button', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper.find('button').trigger('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('shows the form', () => {
......@@ -27,9 +28,9 @@ describe('add request form', () => {
});
describe('when pressing escape', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper.find('input').trigger('keyup.esc');
return wrapper.vm.$nextTick();
await nextTick();
});
it('hides the input', () => {
......@@ -38,12 +39,11 @@ describe('add request form', () => {
});
describe('when submitting the form', () => {
beforeEach(() => {
beforeEach(async () => {
wrapper.find('input').setValue('http://gitlab.example.com/users/root/calendar.json');
return wrapper.vm.$nextTick().then(() => {
wrapper.find('input').trigger('keyup.enter');
return wrapper.vm.$nextTick();
});
await nextTick();
wrapper.find('input').trigger('keyup.enter');
await nextTick();
});
it('emits an event to add the request', () => {
......@@ -57,11 +57,10 @@ describe('add request form', () => {
expect(wrapper.find('input').exists()).toBe(false);
});
it('clears the value for next time', () => {
it('clears the value for next time', async () => {
wrapper.find('button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find('input').text()).toEqual('');
});
await nextTick();
expect(wrapper.find('input').text()).toEqual('');
});
});
});
......
spec/frontend/pipeline_new/components/pipeline_new_form_spec.js
View file @ f43fcde5
import { GlForm, GlSprintf, GlLoadingIcon } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import CreditCardValidationRequiredAlert from 'ee_component/billings/components/cc_validation_required_alert.vue';
import { TEST_HOST } from 'helpers/test_constants';
import waitForPromises from 'helpers/wait_for_promises';
......@@ -122,7 +123,7 @@ describe('Pipeline New Form', () => {
it('removes ci variable row on remove icon button click', async () => {
findRemoveIcons().at(1).trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findVariableRows()).toHaveLength(2);
});
......@@ -132,7 +133,7 @@ describe('Pipeline New Form', () => {
input.element.value = 'test_var_2';
input.trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
expect(findVariableRows()).toHaveLength(4);
expect(findKeyInputs().at(3).element.value).toBe('');
......@@ -205,7 +206,7 @@ describe('Pipeline New Form', () => {
mainInput.element.value = 'build_var';
mainInput.trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
selectBranch('branch-1');
......@@ -215,7 +216,7 @@ describe('Pipeline New Form', () => {
branchOneInput.element.value = 'deploy_var';
branchOneInput.trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
selectBranch('main');
......@@ -309,7 +310,7 @@ describe('Pipeline New Form', () => {
findKeyInputs().at(0).element.value = 'yml_var_modified';
findKeyInputs().at(0).trigger('change');
await wrapper.vm.$nextTick();
await nextTick();
expect(findVariableRows().at(0).text()).not.toContain(mockYmlDesc);
});
......@@ -418,7 +419,7 @@ describe('Pipeline New Form', () => {
findCCAlert().vm.$emit('dismiss');
await wrapper.vm.$nextTick();
await nextTick();
expect(findCCAlert().exists()).toBe(false);
expect(wrapper.vm.$data.error).toBe(null);
......
spec/frontend/pipelines/components/dag/dag_annotations_spec.js
View file @ f43fcde5
import { GlButton } from '@gitlab/ui';
import { shallowMount, mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import DagAnnotations from '~/pipelines/components/dag/dag_annotations.vue';
import { singleNote, multiNote } from './mock_data';
......@@ -82,26 +83,24 @@ describe('The DAG annotations', () => {
});
describe('clicking hide', () => {
it('hides listed items and changes text to show', () => {
it('hides listed items and changes text to show', async () => {
expect(getAllTextBlocks().length).toBe(Object.keys(multiNote).length);
expect(getToggleButton().text()).toBe('Hide list');
getToggleButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(getAllTextBlocks().length).toBe(0);
expect(getToggleButton().text()).toBe('Show list');
});
await nextTick();
expect(getAllTextBlocks().length).toBe(0);
expect(getToggleButton().text()).toBe('Show list');
});
});
describe('clicking show', () => {
it('shows listed items and changes text to hide', () => {
it('shows listed items and changes text to hide', async () => {
getToggleButton().trigger('click');
getToggleButton().trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(getAllTextBlocks().length).toBe(Object.keys(multiNote).length);
expect(getToggleButton().text()).toBe('Hide list');
});
await nextTick();
expect(getAllTextBlocks().length).toBe(Object.keys(multiNote).length);
expect(getToggleButton().text()).toBe('Hide list');
});
});
});
......
spec/frontend/pipelines/components/dag/dag_spec.js
View file @ f43fcde5
import { GlAlert, GlEmptyState } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { ADD_NOTE, REMOVE_NOTE, REPLACE_NOTES } from '~/pipelines/components/dag/constants';
import Dag from '~/pipelines/components/dag/dag.vue';
import DagAnnotations from '~/pipelines/components/dag/dag_annotations.vue';
......@@ -153,11 +154,11 @@ describe('Pipeline DAG graph wrapper', () => {
expect(getNotes().exists()).toBe(false);
getGraph().vm.$emit('update-annotation', { type: ADD_NOTE, data: currentNote });
await wrapper.vm.$nextTick();
await nextTick();
expect(getNotes().exists()).toBe(true);
getGraph().vm.$emit('update-annotation', { type: REMOVE_NOTE, data: currentNote });
await wrapper.vm.$nextTick();
await nextTick();
expect(getNotes().exists()).toBe(false);
});
......@@ -165,11 +166,11 @@ describe('Pipeline DAG graph wrapper', () => {
expect(getNotes().exists()).toBe(false);
getGraph().vm.$emit('update-annotation', { type: REPLACE_NOTES, data: multiNote });
await wrapper.vm.$nextTick();
await nextTick();
expect(getNotes().exists()).toBe(true);
getGraph().vm.$emit('update-annotation', { type: REPLACE_NOTES, data: {} });
await wrapper.vm.$nextTick();
await nextTick();
expect(getNotes().exists()).toBe(false);
});
});
......
spec/frontend/pipelines/components/pipelines_filtered_search_spec.js
View file @ f43fcde5
import { GlFilteredSearch } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import Api from '~/api';
import axios from '~/lib/utils/axios_utils';
import PipelinesFilteredSearch from '~/pipelines/components/pipelines_list/pipelines_filtered_search.vue';
......@@ -103,46 +104,42 @@ describe('Pipelines filtered search', () => {
expect(wrapper.emitted('filterPipelines')[0]).toEqual([mockSearch]);
});
it('disables tag name token when branch name token is active', () => {
it('disables tag name token when branch name token is active', async () => {
findFilteredSearch().vm.$emit('input', [
{ type: 'ref', value: { data: 'branch-1', operator: '=' } },
{ type: 'filtered-search-term', value: { data: '' } },
]);
return wrapper.vm.$nextTick().then(() => {
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(true);
});
await nextTick();
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(true);
});
it('disables branch name token when tag name token is active', () => {
it('disables branch name token when tag name token is active', async () => {
findFilteredSearch().vm.$emit('input', [
{ type: 'tag', value: { data: 'tag-1', operator: '=' } },
{ type: 'filtered-search-term', value: { data: '' } },
]);
return wrapper.vm.$nextTick().then(() => {
expect(findBranchToken().disabled).toBe(true);
expect(findTagToken().disabled).toBe(false);
});
await nextTick();
expect(findBranchToken().disabled).toBe(true);
expect(findTagToken().disabled).toBe(false);
});
it('resets tokens disabled state on clear', () => {
it('resets tokens disabled state on clear', async () => {
findFilteredSearch().vm.$emit('clearInput');
return wrapper.vm.$nextTick().then(() => {
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(false);
});
await nextTick();
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(false);
});
it('resets tokens disabled state when clearing tokens by backspace', () => {
it('resets tokens disabled state when clearing tokens by backspace', async () => {
findFilteredSearch().vm.$emit('input', [{ type: 'filtered-search-term', value: { data: '' } }]);
return wrapper.vm.$nextTick().then(() => {
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(false);
});
await nextTick();
expect(findBranchToken().disabled).toBe(false);
expect(findTagToken().disabled).toBe(false);
});
describe('Url query params', () => {
......
spec/frontend/pipelines/graph/action_component_spec.js
View file @ f43fcde5
import { GlButton } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import axios from '~/lib/utils/axios_utils';
import ActionComponent from '~/pipelines/components/jobs_shared/action_component.vue';
......@@ -33,16 +34,11 @@ describe('pipeline graph action component', () => {
expect(wrapper.attributes('title')).toBe('bar');
});
it('should update bootstrap tooltip when title changes', (done) => {
it('should update bootstrap tooltip when title changes', async () => {
wrapper.setProps({ tooltipText: 'changed' });
wrapper.vm
.$nextTick()
.then(() => {
expect(wrapper.attributes('title')).toBe('changed');
})
.then(done)
.catch(done.fail);
await nextTick();
expect(wrapper.attributes('title')).toBe('changed');
});
it('should render an svg', () => {
......@@ -64,13 +60,11 @@ describe('pipeline graph action component', () => {
.catch(done.fail);
});
it('renders a loading icon while waiting for request', (done) => {
it('renders a loading icon while waiting for request', async () => {
findButton().trigger('click');
wrapper.vm.$nextTick(() => {
expect(wrapper.find('.js-action-icon-loading').exists()).toBe(true);
done();
});
await nextTick();
expect(wrapper.find('.js-action-icon-loading').exists()).toBe(true);
});
});
});
spec/frontend/pipelines/graph/job_item_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import JobItem from '~/pipelines/components/graph/job_item.vue';
describe('pipeline graph job item', () => {
......@@ -74,22 +75,19 @@ describe('pipeline graph job item', () => {
});
describe('name with link', () => {
it('should render the job name and status with a link', (done) => {
it('should render the job name and status with a link', async () => {
createWrapper({ job: mockJob });
wrapper.vm.$nextTick(() => {
const link = wrapper.find('a');
await nextTick();
const link = wrapper.find('a');
expect(link.attributes('href')).toBe(mockJob.status.detailsPath);
expect(link.attributes('href')).toBe(mockJob.status.detailsPath);
expect(link.attributes('title')).toBe(`${mockJob.name} - ${mockJob.status.label}`);
expect(link.attributes('title')).toBe(`${mockJob.name} - ${mockJob.status.label}`);
expect(wrapper.find('.ci-status-icon-success').exists()).toBe(true);
expect(wrapper.text()).toBe(mockJob.name);
expect(wrapper.find('.ci-status-icon-success').exists()).toBe(true);
done();
});
expect(wrapper.text()).toBe(mockJob.name);
});
});
......
spec/frontend/pipelines/graph/linked_pipelines_column_spec.js
View file @ f43fcde5
import { mount, shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import getPipelineDetails from 'shared_queries/pipelines/get_pipeline_details.query.graphql';
......@@ -107,7 +108,7 @@ describe('Linked Pipelines Column', () => {
expect(layersFn).not.toHaveBeenCalled();
await clickExpandButtonAndAwaitTimers();
await wrapper.setProps({ viewType: LAYER_VIEW });
await wrapper.vm.$nextTick();
await nextTick();
expect(layersFn).toHaveBeenCalledTimes(1);
await wrapper.setProps({ viewType: STAGE_VIEW });
await wrapper.setProps({ viewType: LAYER_VIEW });
......
spec/frontend/pipelines/pipeline_triggerer_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import pipelineTriggerer from '~/pipelines/components/pipelines_list/pipeline_triggerer.vue';
import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
......@@ -47,15 +48,14 @@ describe('Pipelines Triggerer', () => {
});
});
it('should render "API" when no triggerer is provided', () => {
it('should render "API" when no triggerer is provided', async () => {
wrapper.setProps({
pipeline: {
user: null,
},
});
return wrapper.vm.$nextTick(() => {
expect(wrapper.find('.js-pipeline-url-api').text()).toEqual('API');
});
await nextTick();
expect(wrapper.find('.js-pipeline-url-api').text()).toEqual('API');
});
});
spec/frontend/pipelines/pipelines_actions_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import { TEST_HOST } from 'spec/test_constants';
import createFlash from '~/flash';
......@@ -68,7 +69,7 @@ describe('Pipelines Actions dropdown', () => {
findAllDropdownItems().at(0).vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findDropdown().props('loading')).toBe(true);
await waitForPromises();
......@@ -80,7 +81,7 @@ describe('Pipelines Actions dropdown', () => {
findAllDropdownItems().at(0).vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findDropdown().props('loading')).toBe(true);
await waitForPromises();
......
spec/frontend/popovers/components/popovers_spec.js
View file @ f43fcde5
import { GlPopover } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { useMockMutationObserver } from 'helpers/mock_dom_observer';
import Popovers from '~/popovers/components/popovers.vue';
......@@ -7,10 +8,10 @@ describe('popovers/components/popovers.vue', () => {
const { trigger: triggerMutate } = useMockMutationObserver();
let wrapper;
const buildWrapper = (...targets) => {
const buildWrapper = async (...targets) => {
wrapper = shallowMount(Popovers);
wrapper.vm.addPopovers(targets);
return wrapper.vm.$nextTick();
await nextTick();
};
const createPopoverTarget = (options = {}) => {
......@@ -49,7 +50,7 @@ describe('popovers/components/popovers.vue', () => {
buildWrapper(target);
wrapper.vm.addPopovers([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findAll(GlPopover)).toHaveLength(1);
});
......@@ -86,7 +87,7 @@ describe('popovers/components/popovers.vue', () => {
await buildWrapper(createPopoverTarget(), createPopoverTarget());
wrapper.vm.dispose();
await wrapper.vm.$nextTick();
await nextTick();
expect(allPopovers()).toHaveLength(0);
});
......@@ -97,7 +98,7 @@ describe('popovers/components/popovers.vue', () => {
await buildWrapper(target, createPopoverTarget());
wrapper.vm.dispose(target);
await wrapper.vm.$nextTick();
await nextTick();
expect(allPopovers()).toHaveLength(1);
});
......@@ -109,13 +110,13 @@ describe('popovers/components/popovers.vue', () => {
await buildWrapper(target);
wrapper.vm.addPopovers([target, createPopoverTarget()]);
await wrapper.vm.$nextTick();
await nextTick();
triggerMutate(document.body, {
entry: { removedNodes: [target] },
options: { childList: true },
});
await wrapper.vm.$nextTick();
await nextTick();
expect(allPopovers()).toHaveLength(1);
});
......
spec/frontend/profile/account/components/update_username_spec.js
View file @ f43fcde5
import { GlModal } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import { TEST_HOST } from 'helpers/test_constants';
import createFlash from '~/flash';
import axios from '~/lib/utils/axios_utils';
......@@ -58,7 +59,7 @@ describe('UpdateUsername component', () => {
it('has a disabled button if the username was not changed', async () => {
const { openModalBtn } = findElements();
await wrapper.vm.$nextTick();
await nextTick();
expect(openModalBtn.props('disabled')).toBe(true);
});
......@@ -69,7 +70,7 @@ describe('UpdateUsername component', () => {
input.element.value = 'newUsername';
input.trigger('input');
await wrapper.vm.$nextTick();
await nextTick();
expect(openModalBtn.props('disabled')).toBe(false);
});
......@@ -83,7 +84,7 @@ describe('UpdateUsername component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ newUsername });
await wrapper.vm.$nextTick();
await nextTick();
});
it('confirmation modal contains proper header and body', async () => {
......@@ -100,7 +101,7 @@ describe('UpdateUsername component', () => {
jest.spyOn(axios, 'put');
await wrapper.vm.onConfirm();
await wrapper.vm.$nextTick();
await nextTick();
expect(axios.put).toHaveBeenCalledWith(actionUrl, { user: { username: newUsername } });
});
......@@ -117,7 +118,7 @@ describe('UpdateUsername component', () => {
});
await wrapper.vm.onConfirm();
await wrapper.vm.$nextTick();
await nextTick();
expect(input.attributes('disabled')).toBe(undefined);
expect(openModalBtn.props('disabled')).toBe(true);
......
spec/frontend/projects/commit/components/branches_dropdown_spec.js
View file @ f43fcde5
import { GlDropdownItem, GlSearchBoxByType } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import { DEFAULT_DEBOUNCE_AND_THROTTLE_MS } from '~/lib/utils/constants';
......@@ -115,7 +115,7 @@ describe('BranchesDropdown', () => {
findSearchBoxByType().vm.$emit('input', '_anything_');
await wrapper.vm.$nextTick();
await nextTick();
expect(spy).toHaveBeenCalledWith('_anything_');
expect(wrapper.vm.searchTerm).toBe('_anything_');
......
spec/frontend/projects/commit/components/form_modal_spec.js
View file @ f43fcde5
......@@ -2,6 +2,7 @@ import { GlModal, GlForm, GlFormCheckbox, GlSprintf } from '@gitlab/ui';
import { within } from '@testing-library/dom';
import { shallowMount, mount, createWrapper } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import api from '~/api';
import axios from '~/lib/utils/axios_utils';
......@@ -156,7 +157,7 @@ describe('CommitFormModal', () => {
it('Changes the start_branch input value', async () => {
findBranchesDropdown().vm.$emit('selectBranch', '_changed_branch_value_');
await wrapper.vm.$nextTick();
await nextTick();
expect(findStartBranch().attributes('value')).toBe('_changed_branch_value_');
});
......@@ -165,7 +166,7 @@ describe('CommitFormModal', () => {
createComponent(shallowMount, {}, {}, { isCherryPick: true });
findProjectsDropdown().vm.$emit('selectProject', '_changed_project_value_');
await wrapper.vm.$nextTick();
await nextTick();
expect(findTargetProject().attributes('value')).toBe('_changed_project_value_');
});
......@@ -174,7 +175,7 @@ describe('CommitFormModal', () => {
it('action primary button triggers Redis HLL tracking api call', async () => {
createComponent(mount, {}, {}, { primaryActionEventName: 'test_event' });
await wrapper.vm.$nextTick();
await nextTick();
jest.spyOn(findForm().element, 'submit');
......
spec/frontend/projects/commits/components/author_select_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownSectionHeader, GlSearchBoxByType, GlDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import * as urlUtility from '~/lib/utils/url_utility';
import AuthorSelect from '~/projects/commits/components/author_select.vue';
......@@ -63,36 +63,33 @@ describe('Author Select', () => {
const findDropdownItems = () => wrapper.findAll(GlDropdownItem);
describe('user is searching via "filter by commit message"', () => {
it('disables dropdown container', () => {
it('disables dropdown container', async () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ hasSearchParam: true });
return wrapper.vm.$nextTick().then(() => {
expect(findDropdownContainer().attributes('disabled')).toBeFalsy();
});
await nextTick();
expect(findDropdownContainer().attributes('disabled')).toBeFalsy();
});
it('has correct tooltip message', () => {
it('has correct tooltip message', async () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ hasSearchParam: true });
return wrapper.vm.$nextTick().then(() => {
expect(findDropdownContainer().attributes('title')).toBe(
'Searching by both author and message is currently not supported.',
);
});
await nextTick();
expect(findDropdownContainer().attributes('title')).toBe(
'Searching by both author and message is currently not supported.',
);
});
it('disables dropdown', () => {
it('disables dropdown', async () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ hasSearchParam: false });
return wrapper.vm.$nextTick().then(() => {
expect(findDropdown().attributes('disabled')).toBeFalsy();
});
await nextTick();
expect(findDropdown().attributes('disabled')).toBeFalsy();
});
it('hasSearchParam if user types a truthy string', () => {
......@@ -107,14 +104,13 @@ describe('Author Select', () => {
expect(findDropdown().attributes('text')).toBe('Author');
});
it('displays the current selected author', () => {
it('displays the current selected author', async () => {
// setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ currentAuthor });
return wrapper.vm.$nextTick().then(() => {
expect(findDropdown().attributes('text')).toBe(currentAuthor);
});
await nextTick();
expect(findDropdown().attributes('text')).toBe(currentAuthor);
});
it('displays correct header text', () => {
......@@ -149,13 +145,12 @@ describe('Author Select', () => {
expect(findDropdownItems().at(0).text()).toBe('Any Author');
});
it('displays the project authors', () => {
return wrapper.vm.$nextTick().then(() => {
expect(findDropdownItems()).toHaveLength(authors.length + 1);
});
it('displays the project authors', async () => {
await nextTick();
expect(findDropdownItems()).toHaveLength(authors.length + 1);
});
it('has the correct props', () => {
it('has the correct props', async () => {
const [{ avatar_url, username }] = authors;
const result = {
avatarUrl: avatar_url,
......@@ -167,15 +162,13 @@ describe('Author Select', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ currentAuthor });
return wrapper.vm.$nextTick().then(() => {
expect(findDropdownItems().at(1).props()).toEqual(expect.objectContaining(result));
});
await nextTick();
expect(findDropdownItems().at(1).props()).toEqual(expect.objectContaining(result));
});
it("display the author's name", () => {
return wrapper.vm.$nextTick().then(() => {
expect(findDropdownItems().at(1).text()).toBe(currentAuthor);
});
it("display the author's name", async () => {
await nextTick();
expect(findDropdownItems().at(1).text()).toBe(currentAuthor);
});
it('passes selected author to redirectPath', () => {
......
spec/frontend/projects/compare/components/app_spec.js
View file @ f43fcde5
import { GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import CompareApp from '~/projects/compare/components/app.vue';
import RevisionCard from '~/projects/compare/components/revision_card.vue';
import { appDefaultProps as defaultProps } from './mock_data';
......@@ -91,7 +92,7 @@ describe('CompareApp component', () => {
project,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findTargetRevisionCard().props('selectedProject')).toEqual(
expect.objectContaining(project),
......@@ -106,7 +107,7 @@ describe('CompareApp component', () => {
revision,
});
await wrapper.vm.$nextTick();
await nextTick();
expect(findSourceRevisionCard().props('paramsBranch')).toBe(revision);
});
......@@ -125,7 +126,7 @@ describe('CompareApp component', () => {
it('swaps revisions when clicked', async () => {
findSwapRevisionsButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findTargetRevisionCard().props('paramsBranch')).toBe(defaultProps.paramsTo);
expect(findSourceRevisionCard().props('paramsBranch')).toBe(defaultProps.paramsFrom);
......
spec/frontend/projects/compare/components/repo_dropdown_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import RepoDropdown from '~/projects/compare/components/repo_dropdown.vue';
import { revisionCardDefaultProps as defaultProps } from './mock_data';
......@@ -39,7 +40,7 @@ describe('RepoDropdown component', () => {
it('does not emit `changeTargetProject` event', async () => {
wrapper.vm.emitTargetProject('foo');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('changeTargetProject')).toBeUndefined();
});
});
......@@ -67,13 +68,13 @@ describe('RepoDropdown component', () => {
it('updates the hidden input value when onClick method is triggered', async () => {
const repoId = '1';
wrapper.vm.onClick({ id: repoId });
await wrapper.vm.$nextTick();
await nextTick();
expect(findHiddenInput().attributes('value')).toBe(repoId);
});
it('emits `selectProject` event when another target project is selected', async () => {
findGlDropdown().findAll(GlDropdownItem).at(0).vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('selectProject')[0][0]).toEqual({
direction: 'from',
......
spec/frontend/projects/compare/components/revision_dropdown_legacy_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import AxiosMockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import createFlash from '~/flash';
import axios from '~/lib/utils/axios_utils';
import RevisionDropdown from '~/projects/compare/components/revision_dropdown_legacy.vue';
......@@ -105,7 +106,7 @@ describe('RevisionDropdown component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ branches: ['some-branch'] });
await wrapper.vm.$nextTick();
await nextTick();
findFirstGlDropdownItem().vm.$emit('click');
......
spec/frontend/projects/compare/components/revision_dropdown_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownItem, GlSearchBoxByType } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import AxiosMockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import createFlash from '~/flash';
import axios from '~/lib/utils/axios_utils';
import RevisionDropdown from '~/projects/compare/components/revision_dropdown.vue';
......@@ -141,7 +142,7 @@ describe('RevisionDropdown component', () => {
it('emits `selectRevision` event when another revision is selected', async () => {
createComponent();
wrapper.vm.branches = ['some-branch'];
await wrapper.vm.$nextTick();
await nextTick();
findGlDropdown().findAll(GlDropdownItem).at(0).vm.$emit('click');
......
spec/frontend/projects/new/components/new_project_url_select_spec.js
View file @ f43fcde5
......@@ -6,7 +6,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 createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
......@@ -95,7 +95,7 @@ describe('NewProjectUrlSelect component', () => {
const clickDropdownItem = async () => {
wrapper.findComponent(GlDropdownItem).vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
};
const showDropdown = async () => {
......
spec/frontend/projects/pipelines/charts/components/app_spec.js
View file @ f43fcde5
import { GlTabs, GlTab } from '@gitlab/ui';
import { merge } from 'lodash';
import { nextTick } from 'vue';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import setWindowLocation from 'helpers/set_window_location_helper';
import { TEST_HOST } from 'helpers/test_constants';
......@@ -99,7 +100,7 @@ describe('ProjectsPipelinesChartsApp', () => {
tabs.vm.$emit('input', 1);
await wrapper.vm.$nextTick();
await nextTick();
expect(tabs.attributes('value')).toBe('1');
});
......@@ -115,7 +116,7 @@ describe('ProjectsPipelinesChartsApp', () => {
tabs.vm.$emit('input', 0);
await wrapper.vm.$nextTick();
await nextTick();
expect(updateHistory).not.toHaveBeenCalled();
});
......@@ -183,7 +184,7 @@ describe('ProjectsPipelinesChartsApp', () => {
popstateHandler();
await wrapper.vm.$nextTick();
await nextTick();
expect(findGlTabs().attributes('value')).toBe('1');
});
......
spec/frontend/projects/settings/components/shared_runners_toggle_spec.js
View file @ f43fcde5
import { GlAlert, GlToggle, GlTooltip } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import MockAxiosAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import axios from '~/lib/utils/axios_utils';
import SharedRunnersToggleComponent from '~/projects/settings/components/shared_runners_toggle.vue';
......@@ -121,7 +122,7 @@ describe('projects/settings/components/shared_runners', () => {
expect(isToggleLoading()).toBe(false);
findSharedRunnersToggle().vm.$emit('change', true);
await wrapper.vm.$nextTick();
await nextTick();
expect(isToggleLoading()).toBe(true);
await waitForPromises();
......
spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js
View file @ f43fcde5
......@@ -139,7 +139,7 @@ describe('ServiceDeskSetting', () => {
input.setValue('abc_A.');
input.trigger('blur');
await wrapper.vm.$nextTick();
await nextTick();
const errorText = wrapper.find('.invalid-feedback');
expect(errorText.exists()).toBe(true);
......
spec/frontend/ref/components/ref_selector_spec.js
View file @ f43fcde5
......@@ -137,19 +137,19 @@ describe('Ref selector component', () => {
findSearchBox().vm.$emit('input', newQuery);
};
const selectFirstBranch = () => {
const selectFirstBranch = async () => {
findFirstBranchDropdownItem().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
};
const selectFirstTag = () => {
const selectFirstTag = async () => {
findFirstTagDropdownItem().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
};
const selectFirstCommit = () => {
const selectFirstCommit = async () => {
findFirstCommitDropdownItem().vm.$emit('click');
return wrapper.vm.$nextTick();
await nextTick();
};
const waitForRequests = ({ andClearMocks } = { andClearMocks: false }) =>
......@@ -219,12 +219,11 @@ describe('Ref selector component', () => {
return waitForRequests();
});
it('renders the updated ref name', () => {
it('renders the updated ref name', async () => {
wrapper.setProps({ value: updatedRef });
return nextTick().then(() => {
expect(findButtonContent().text()).toBe(updatedRef);
});
await nextTick();
expect(findButtonContent().text()).toBe(updatedRef);
});
});
......@@ -546,9 +545,8 @@ describe('Ref selector component', () => {
await selectFirstBranch();
return nextTick().then(() => {
expect(findButtonContent().text()).toBe(fixtures.branches[0].name);
});
await nextTick();
expect(findButtonContent().text()).toBe(fixtures.branches[0].name);
});
it("updates the v-model binding with the branch's name", async () => {
......@@ -566,9 +564,8 @@ describe('Ref selector component', () => {
await selectFirstTag();
return nextTick().then(() => {
expect(findButtonContent().text()).toBe(fixtures.tags[0].name);
});
await nextTick();
expect(findButtonContent().text()).toBe(fixtures.tags[0].name);
});
it("updates the v-model binding with the tag's name", async () => {
......@@ -586,9 +583,8 @@ describe('Ref selector component', () => {
await selectFirstCommit();
return nextTick().then(() => {
expect(findButtonContent().text()).toBe(fixtures.commit.id);
});
await nextTick();
expect(findButtonContent().text()).toBe(fixtures.commit.id);
});
it("updates the v-model binding with the commit's full SHA", async () => {
......
spec/frontend/related_issues/components/related_issuable_input_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { TEST_HOST } from 'helpers/test_constants';
import RelatedIssuableInput from '~/related_issues/components/related_issuable_input.vue';
import { issuableTypesMap, PathIdSeparator } from '~/related_issues/constants';
......@@ -82,7 +83,7 @@ describe('RelatedIssuableInput', () => {
wrapper.find('li').trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(document.activeElement).toBe(wrapper.find({ ref: 'input' }).element);
});
......
spec/frontend/releases/components/app_edit_new_spec.js
View file @ f43fcde5
......@@ -3,6 +3,7 @@ import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { merge } from 'lodash';
import Vuex from 'vuex';
import { nextTick } from 'vue';
import originalRelease from 'test_fixtures/api/releases/release.json';
import setWindowLocation from 'helpers/set_window_location_helper';
import { TEST_HOST } from 'helpers/test_constants';
......@@ -71,7 +72,7 @@ describe('Release edit/new component', () => {
},
});
await wrapper.vm.$nextTick();
await nextTick();
wrapper.element.querySelectorAll('input').forEach((input) => jest.spyOn(input, 'focus'));
};
......
spec/frontend/releases/components/app_index_apollo_client_spec.js
View file @ f43fcde5
import { cloneDeep } from 'lodash';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import originalAllReleasesQueryResponse from 'test_fixtures/graphql/releases/graphql/queries/all_releases.query.graphql.json';
import createMockApollo from 'helpers/mock_apollo_helper';
......@@ -296,7 +296,7 @@ describe('app_index_apollo_client.vue', () => {
mockQueryParams = { after };
findPagination().vm.$emit('next', after);
await wrapper.vm.$nextTick();
await nextTick();
expect(queryMock.mock.calls).toEqual([
[expect.objectContaining({ before })],
......@@ -321,7 +321,7 @@ describe('app_index_apollo_client.vue', () => {
it('requeries the GraphQL endpoint and updates the URL when the sort is changed', async () => {
findSort().vm.$emit('input', CREATED_ASC);
await wrapper.vm.$nextTick();
await nextTick();
expect(queryMock.mock.calls).toEqual([
[expect.objectContaining({ sort: DEFAULT_SORT })],
......@@ -337,7 +337,7 @@ describe('app_index_apollo_client.vue', () => {
it('does not requery the GraphQL endpoint or update the URL if the sort is updated to the same value', async () => {
findSort().vm.$emit('input', DEFAULT_SORT);
await wrapper.vm.$nextTick();
await nextTick();
expect(queryMock.mock.calls).toEqual([
[expect.objectContaining({ sort: DEFAULT_SORT })],
......@@ -370,7 +370,7 @@ describe('app_index_apollo_client.vue', () => {
findSort().vm.$emit('input', CREATED_ASC);
await wrapper.vm.$nextTick();
await nextTick();
});
it(`resets the page's "${paramName}" pagination cursor when the sort is changed`, () => {
......
spec/frontend/releases/components/evidence_block_spec.js
View file @ f43fcde5
import { GlLink, GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import originalRelease from 'test_fixtures/api/releases/release.json';
import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
import { truncateSha } from '~/lib/utils/text_utility';
......@@ -51,12 +52,11 @@ describe('Evidence Block', () => {
expect(wrapper.find('.js-short').text()).toBe(truncateSha(release.evidences[0].sha));
});
it('renders the long sha after expansion', () => {
it('renders the long sha after expansion', async () => {
wrapper.find('.js-text-expander-prepend').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find('.js-expanded').text()).toBe(release.evidences[0].sha);
});
await nextTick();
expect(wrapper.find('.js-expanded').text()).toBe(release.evidences[0].sha);
});
});
......
spec/frontend/releases/components/release_block_footer_spec.js
View file @ f43fcde5
import { GlLink, GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { cloneDeep } from 'lodash';
import { nextTick } from 'vue';
import originalRelease from 'test_fixtures/api/releases/release.json';
import { trimText } from 'helpers/text_helper';
import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
......@@ -14,7 +15,7 @@ describe('Release block footer', () => {
let wrapper;
let release;
const factory = (props = {}) => {
const factory = async (props = {}) => {
wrapper = mount(ReleaseBlockFooter, {
propsData: {
...convertObjectPropsToCamelCase(release, { deep: true }),
......@@ -22,7 +23,7 @@ describe('Release block footer', () => {
},
});
return wrapper.vm.$nextTick();
await nextTick();
};
beforeEach(() => {
......
spec/frontend/releases/components/release_block_milestone_info_spec.js
View file @ f43fcde5
import { GlProgressBar, GlLink, GlBadge, GlButton } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import originalRelease from 'test_fixtures/api/releases/release.json';
import { trimText } from 'helpers/text_helper';
import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
......@@ -12,12 +13,12 @@ describe('Release block milestone info', () => {
let wrapper;
let milestones;
const factory = (props) => {
const factory = async (props) => {
wrapper = mount(ReleaseBlockMilestoneInfo, {
propsData: props,
});
return wrapper.vm.$nextTick();
await nextTick();
};
beforeEach(() => {
......@@ -105,10 +106,10 @@ describe('Release block milestone info', () => {
return factory({ milestones: lotsOfMilestones });
});
const clickShowMoreFewerButton = () => {
const clickShowMoreFewerButton = async () => {
milestoneListContainer().find(GlButton).trigger('click');
return wrapper.vm.$nextTick();
await nextTick();
};
const milestoneListText = () => trimText(milestoneListContainer().text());
......@@ -117,19 +118,16 @@ describe('Release block milestone info', () => {
expect(milestoneListText()).toContain(`Milestones ${abbreviatedListString} • show 10 more`);
});
it('renders all milestones when "show more" is clicked', () =>
clickShowMoreFewerButton().then(() => {
expect(milestoneListText()).toContain(`Milestones ${fullListString} • show fewer`);
}));
it('renders all milestones when "show more" is clicked', async () => {
await clickShowMoreFewerButton();
expect(milestoneListText()).toContain(`Milestones ${fullListString} • show fewer`);
});
it('returns to the original view when "show fewer" is clicked', () =>
clickShowMoreFewerButton()
.then(clickShowMoreFewerButton)
.then(() => {
expect(milestoneListText()).toContain(
`Milestones ${abbreviatedListString} • show 10 more`,
);
}));
it('returns to the original view when "show fewer" is clicked', async () => {
await clickShowMoreFewerButton();
await clickShowMoreFewerButton();
expect(milestoneListText()).toContain(`Milestones ${abbreviatedListString} • show 10 more`);
});
});
const expectAllZeros = () => {
......
spec/frontend/releases/components/release_block_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import $ from 'jquery';
import { nextTick } from 'vue';
import originalRelease from 'test_fixtures/api/releases/release.json';
import * as commonUtils from '~/lib/utils/common_utils';
import * as urlUtility from '~/lib/utils/url_utility';
......@@ -13,7 +14,7 @@ describe('Release block', () => {
let wrapper;
let release;
const factory = (releaseProp, featureFlags = {}) => {
const factory = async (releaseProp, featureFlags = {}) => {
wrapper = mount(ReleaseBlock, {
propsData: {
release: releaseProp,
......@@ -25,7 +26,7 @@ describe('Release block', () => {
},
});
return wrapper.vm.$nextTick();
await nextTick();
};
const milestoneListLabel = () => wrapper.find('.js-milestone-list-label');
......
spec/frontend/releases/components/tag_field_new_spec.js
View file @ f43fcde5
import { GlDropdownItem } from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import { __ } from '~/locale';
import TagFieldNew from '~/releases/components/tag_field_new.vue';
import createStore from '~/releases/stores';
......@@ -153,7 +153,7 @@ describe('releases/components/tag_field_new', () => {
* Should be passed either 'shown' or 'hidden'
*/
const expectValidationMessageToBe = async (state) => {
await wrapper.vm.$nextTick();
await nextTick();
expect(findTagNameFormGroup().element).toHaveClass(
state === 'shown' ? 'is-invalid' : 'is-valid',
......
spec/frontend/repository/components/breadcrumbs_spec.js
View file @ f43fcde5
import { GlDropdown } from '@gitlab/ui';
import { shallowMount, RouterLinkStub } from '@vue/test-utils';
import { nextTick } from 'vue';
import Breadcrumbs from '~/repository/components/breadcrumbs.vue';
import UploadBlobModal from '~/repository/components/upload_blob_modal.vue';
import NewDirectoryModal from '~/repository/components/new_directory_modal.vue';
......@@ -79,7 +80,7 @@ describe('Repository breadcrumbs component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } });
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlDropdown).exists()).toBe(false);
});
......@@ -106,7 +107,7 @@ describe('Repository breadcrumbs component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } });
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlDropdown).exists()).toBe(true);
});
......@@ -125,7 +126,7 @@ describe('Repository breadcrumbs component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ $apollo: { queries: { userPermissions: { loading: false } } } });
await wrapper.vm.$nextTick();
await nextTick();
expect(findUploadBlobModal().exists()).toBe(true);
});
......@@ -149,7 +150,7 @@ describe('Repository breadcrumbs component', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ $apollo: { queries: { userPermissions: { loading: false } } } });
await wrapper.vm.$nextTick();
await nextTick();
expect(findNewDirectoryModal().exists()).toBe(true);
});
......
spec/frontend/repository/components/upload_blob_modal_spec.js
View file @ f43fcde5
......@@ -2,6 +2,7 @@ import { GlModal, GlFormInput, GlFormTextarea, GlToggle, GlAlert } from '@gitlab
import { shallowMount } from '@vue/test-utils';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import waitForPromises from 'helpers/wait_for_promises';
import createFlash from '~/flash';
import httpStatusCodes from '~/lib/utils/http_status';
......@@ -113,7 +114,7 @@ describe('UploadBlobModal', () => {
// eslint-disable-next-line no-restricted-syntax
wrapper.setData({ target: 'Not main' });
await wrapper.vm.$nextTick();
await nextTick();
expect(findMrToggle().exists()).toBe(true);
});
......@@ -202,7 +203,7 @@ describe('UploadBlobModal', () => {
wrapper.vm.uploadFile = jest.fn();
wrapper.vm.replaceFile = jest.fn();
wrapper.vm.submitForm();
await wrapper.vm.$nextTick();
await nextTick();
};
const submitRequest = async () => {
......
spec/frontend/serverless/survey_banner_spec.js
View file @ f43fcde5
import { GlBanner } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Cookies from 'js-cookie';
import { nextTick } from 'vue';
import SurveyBanner from '~/serverless/survey_banner.vue';
describe('Knative survey banner', () => {
......@@ -27,7 +28,7 @@ describe('Knative survey banner', () => {
expect(wrapper.find(GlBanner).exists()).toBe(true);
});
it('should close the banner and set a cookie when close button is clicked', () => {
it('should close the banner and set a cookie when close button is clicked', async () => {
jest.spyOn(Cookies, 'get').mockReturnValue(undefined);
jest.spyOn(Cookies, 'set');
mountBanner();
......@@ -35,10 +36,9 @@ describe('Knative survey banner', () => {
expect(wrapper.find(GlBanner).exists()).toBe(true);
wrapper.find(GlBanner).vm.$emit('close');
return wrapper.vm.$nextTick().then(() => {
expect(Cookies.set).toHaveBeenCalledWith('hide_serverless_survey', 'true', { expires: 3650 });
expect(wrapper.find(GlBanner).exists()).toBe(false);
});
await nextTick();
expect(Cookies.set).toHaveBeenCalledWith('hide_serverless_survey', 'true', { expires: 3650 });
expect(wrapper.find(GlBanner).exists()).toBe(false);
});
it('should not render the banner when the cookie is set', () => {
......
spec/frontend/set_status_modal/set_status_modal_wrapper_spec.js
View file @ f43fcde5
import { GlModal, GlFormCheckbox } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { initEmojiMock, clearEmojiMock } from 'helpers/emoji';
import * as UserApi from '~/api/user_api';
import EmojiPicker from '~/emoji/components/picker.vue';
......@@ -48,7 +49,7 @@ describe('SetStatusModalWrapper', () => {
const findAvailabilityCheckbox = () => wrapper.find(GlFormCheckbox);
const findClearStatusAtMessage = () => wrapper.find('[data-testid="clear-status-at-message"]');
const initModal = ({ mockOnUpdateSuccess = true, mockOnUpdateFailure = true } = {}) => {
const initModal = async ({ mockOnUpdateSuccess = true, mockOnUpdateFailure = true } = {}) => {
const modal = findModal();
// mock internal emoji methods
wrapper.vm.showEmojiMenu = jest.fn();
......@@ -57,7 +58,7 @@ describe('SetStatusModalWrapper', () => {
if (mockOnUpdateFailure) wrapper.vm.onUpdateFail = jest.fn();
modal.vm.$emit('shown');
return wrapper.vm.$nextTick();
await nextTick();
};
afterEach(() => {
......@@ -207,7 +208,7 @@ describe('SetStatusModalWrapper', () => {
it('clicking "removeStatus" clears the emoji and message fields', async () => {
findModal().vm.$emit('secondary');
await wrapper.vm.$nextTick();
await nextTick();
expect(findFormField('message').element.value).toBe('');
expect(findFormField('emoji').element.value).toBe('');
......@@ -215,7 +216,7 @@ describe('SetStatusModalWrapper', () => {
it('clicking "setStatus" submits the user status', async () => {
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
// set the availability status
findAvailabilityCheckbox().vm.$emit('input', true);
......@@ -224,7 +225,7 @@ describe('SetStatusModalWrapper', () => {
wrapper.find('[data-testid="thirtyMinutes"]').vm.$emit('click');
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
const commonParams = {
emoji: defaultEmoji,
......@@ -246,7 +247,7 @@ describe('SetStatusModalWrapper', () => {
it('calls the "onUpdateSuccess" handler', async () => {
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.onUpdateSuccess).toHaveBeenCalled();
});
......@@ -262,7 +263,7 @@ describe('SetStatusModalWrapper', () => {
it('displays a toast success message', async () => {
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
expect($toast.show).toHaveBeenCalledWith('Status updated');
});
......@@ -279,7 +280,7 @@ describe('SetStatusModalWrapper', () => {
it('calls the "onUpdateFail" handler', async () => {
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.vm.onUpdateFail).toHaveBeenCalled();
});
......@@ -295,7 +296,7 @@ describe('SetStatusModalWrapper', () => {
it('flashes an error message', async () => {
findModal().vm.$emit('primary');
await wrapper.vm.$nextTick();
await nextTick();
expect(createFlash).toHaveBeenCalledWith({
message: "Sorry, we weren't able to set your status. Please try again later.",
......
spec/frontend/sidebar/assignees_spec.js
View file @ f43fcde5
import { GlIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { trimText } from 'helpers/text_helper';
import UsersMockHelper from 'helpers/user_mock_data_helper';
import Assignee from '~/sidebar/components/assignees/assignees.vue';
......@@ -59,7 +60,7 @@ describe('Assignee component', () => {
expect(componentTextNoUsers).toContain('assign yourself');
});
it('emits the assign-self event when "assign yourself" is clicked', () => {
it('emits the assign-self event when "assign yourself" is clicked', async () => {
createWrapper({
...getDefaultProps(),
editable: true,
......@@ -68,9 +69,8 @@ describe('Assignee component', () => {
jest.spyOn(wrapper.vm, '$emit');
wrapper.find('[data-testid="assign-yourself"]').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted('assign-self')).toBeTruthy();
});
await nextTick();
expect(wrapper.emitted('assign-self')).toBeTruthy();
});
});
......
spec/frontend/sidebar/components/assignees/sidebar_editable_item_spec.js
View file @ f43fcde5
import { GlLoadingIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import SidebarEditableItem from '~/sidebar/components/sidebar_editable_item.vue';
describe('boards sidebar remove issue', () => {
......@@ -71,7 +72,7 @@ describe('boards sidebar remove issue', () => {
createComponent({ canUpdate: true, slots });
findEditButton().vm.$emit('click');
await wrapper.vm.$nextTick;
await nextTick;
expect(findCollapsed().isVisible()).toBe(false);
expect(findExpanded().isVisible()).toBe(true);
......@@ -82,14 +83,14 @@ describe('boards sidebar remove issue', () => {
beforeEach(async () => {
createComponent({ canUpdate: true });
findEditButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
});
it('hides expanded section and displays collapsed section', async () => {
expect(findExpanded().isVisible()).toBe(true);
document.body.click();
await wrapper.vm.$nextTick();
await nextTick();
expect(findCollapsed().isVisible()).toBe(true);
expect(findExpanded().isVisible()).toBe(false);
......@@ -101,7 +102,7 @@ describe('boards sidebar remove issue', () => {
findEditButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted().open.length).toBe(1);
});
......@@ -111,7 +112,7 @@ describe('boards sidebar remove issue', () => {
findEditButton().vm.$emit('click');
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.collapse({ emitEvent: false });
......
spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { TEST_HOST } from 'helpers/test_constants';
import UsersMockHelper from 'helpers/user_mock_data_helper';
import AssigneeAvatarLink from '~/sidebar/components/assignees/assignee_avatar_link.vue';
......@@ -84,10 +85,10 @@ describe('UncollapsedAssigneeList component', () => {
});
describe('when more button is clicked', () => {
beforeEach(() => {
beforeEach(async () => {
findMoreButton().trigger('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('shows "show less" label', () => {
......
spec/frontend/sidebar/components/sidebar_dropdown_widget_spec.js
View file @ f43fcde5
......@@ -12,6 +12,7 @@ import { shallowMount, mount } from '@vue/test-utils';
import Vue from 'vue';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import createMockApollo from 'helpers/mock_apollo_helper';
import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
......@@ -77,7 +78,7 @@ describe('SidebarDropdownWidget', () => {
// It then emits `shown` event in a watcher for `visible`
// Hence we need both of these:
await waitForPromises();
await wrapper.vm.$nextTick();
await nextTick();
};
const waitForApollo = async () => {
......@@ -352,7 +353,7 @@ describe('SidebarDropdownWidget', () => {
});
it(`calls createFlash with "${expectedMsg}"`, async () => {
await wrapper.vm.$nextTick();
await nextTick();
expect(createFlash).toHaveBeenCalledWith({
message: expectedMsg,
captureError: true,
......@@ -375,7 +376,7 @@ describe('SidebarDropdownWidget', () => {
findSearchBox().vm.$emit('input', 'non existing milestones');
await wrapper.vm.$nextTick();
await nextTick();
expect(findDropdownText().text()).toBe('No milestone found');
});
......@@ -480,7 +481,7 @@ describe('SidebarDropdownWidget', () => {
it('sends a projectMilestones query with the entered search term "foo"', async () => {
findSearchBox().vm.$emit('input', mockSearchTerm);
await wrapper.vm.$nextTick();
await nextTick();
// Account for debouncing
jest.runAllTimers();
......
spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { stubTransition } from 'helpers/stub_transition';
import { createMockDirective } from 'helpers/vue_mock_directive';
import TimeTracker from '~/sidebar/components/time_tracking/time_tracker.vue';
......@@ -161,7 +162,7 @@ describe('Issuable Time Tracker', () => {
it('should show the correct tooltip text', async () => {
expect(findByTestId('timeTrackingComparisonPane').exists()).toBe(true);
await wrapper.vm.$nextTick();
await nextTick();
expect(findComparisonMeter()).toBe('Time remaining: 26h 23m');
});
......@@ -179,7 +180,7 @@ describe('Issuable Time Tracker', () => {
},
},
});
await wrapper.vm.$nextTick();
await nextTick();
});
it('should display the human readable version of time estimated', () => {
......@@ -282,7 +283,7 @@ describe('Issuable Time Tracker', () => {
},
},
});
await wrapper.vm.$nextTick();
await nextTick();
});
it('should not show the "Help" pane by default', () => {
......@@ -292,19 +293,19 @@ describe('Issuable Time Tracker', () => {
it('should show the "Help" pane when help button is clicked', async () => {
findHelpButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findByTestId('helpPane').exists()).toBe(true);
});
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();
expect(findByTestId('helpPane').exists()).toBe(true);
findCloseHelpButton().trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(findByTestId('helpPane').exists()).toBe(false);
});
......@@ -315,7 +316,7 @@ describe('Issuable Time Tracker', () => {
it('refetches issuableTimeTracking query when eventHub emits `timeTracker:refresh` event', async () => {
SidebarEventHub.$emit('timeTracker:refresh');
await wrapper.vm.$nextTick();
await nextTick();
expect(issuableTimeTrackingRefetchSpy).toHaveBeenCalled();
});
......
spec/frontend/sidebar/components/todo_toggle/sidebar_todo_widget_spec.js
View file @ f43fcde5
import { GlIcon, GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
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';
......@@ -119,7 +119,7 @@ describe('Sidebar Todo Widget', () => {
it('emits `todoUpdated` event on click on icon', async () => {
wrapper.find(GlIcon).vm.$emit('click', event);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.emitted('todoUpdated')).toEqual([[false]]);
});
});
......
spec/frontend/sidebar/lock/edit_form_buttons_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import createFlash from '~/flash';
import { createStore as createMrStore } from '~/mr_notes/stores';
import createStore from '~/notes/stores';
......@@ -118,15 +119,13 @@ describe('EditFormButtons', () => {
});
it('resets loading', async () => {
await wrapper.vm.$nextTick().then(() => {
expect(findLockToggle().props('loading')).toBe(false);
});
await nextTick();
expect(findLockToggle().props('loading')).toBe(false);
});
it('emits close form', () => {
return wrapper.vm.$nextTick().then(() => {
expect(eventHub.$emit).toHaveBeenCalledWith('closeLockForm');
});
it('emits close form', async () => {
await nextTick();
expect(eventHub.$emit).toHaveBeenCalledWith('closeLockForm');
});
it('does not flash an error message', () => {
......@@ -153,15 +152,13 @@ describe('EditFormButtons', () => {
});
it('resets loading', async () => {
await wrapper.vm.$nextTick().then(() => {
expect(findLockToggle().props('loading')).toBe(false);
});
await nextTick();
expect(findLockToggle().props('loading')).toBe(false);
});
it('emits close form', () => {
return wrapper.vm.$nextTick().then(() => {
expect(eventHub.$emit).toHaveBeenCalledWith('closeLockForm');
});
it('emits close form', async () => {
await nextTick();
expect(eventHub.$emit).toHaveBeenCalledWith('closeLockForm');
});
it('calls flash with the correct message', () => {
......
spec/frontend/sidebar/lock/issuable_lock_form_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { mockTracking, triggerEvent } from 'helpers/tracking_helper';
import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
import { createStore as createMrStore } from '~/mr_notes/stores';
......@@ -80,13 +81,12 @@ describe('IssuableLockForm', () => {
});
describe('when not editable', () => {
it('does not display the edit form when opened if not editable', () => {
it('does not display the edit form when opened if not editable', async () => {
expect(findEditForm().exists()).toBe(false);
findSidebarCollapseIcon().trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(findEditForm().exists()).toBe(false);
});
await nextTick();
expect(findEditForm().exists()).toBe(false);
});
});
......@@ -102,13 +102,12 @@ describe('IssuableLockForm', () => {
});
describe("when 'Edit' is clicked", () => {
it('displays the edit form when editable', () => {
it('displays the edit form when editable', async () => {
expect(findEditForm().exists()).toBe(false);
findEditLink().trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(findEditForm().exists()).toBe(true);
});
await nextTick();
expect(findEditForm().exists()).toBe(true);
});
it('tracks the event ', () => {
......@@ -123,13 +122,12 @@ describe('IssuableLockForm', () => {
});
describe('When sidebar is collapsed', () => {
it('displays the edit form when opened', () => {
it('displays the edit form when opened', async () => {
expect(findEditForm().exists()).toBe(false);
findSidebarCollapseIcon().trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(findEditForm().exists()).toBe(true);
});
await nextTick();
expect(findEditForm().exists()).toBe(true);
});
it('renders a tooltip with the lock status text', () => {
......
spec/frontend/sidebar/sidebar_assignees_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import axios from 'axios';
import AxiosMockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import Assigness from '~/sidebar/components/assignees/assignees.vue';
import AssigneesRealtime from '~/sidebar/components/assignees/assignees_realtime.vue';
import SidebarAssignees from '~/sidebar/components/assignees/sidebar_assignees.vue';
......@@ -74,16 +75,15 @@ describe('sidebar assignees', () => {
expect(mediator.store.assignees.length).toBe(1);
});
it('hides assignees until fetched', () => {
it('hides assignees until fetched', async () => {
createComponent();
expect(wrapper.find(Assigness).exists()).toBe(false);
wrapper.vm.store.isFetching.assignees = false;
return wrapper.vm.$nextTick(() => {
expect(wrapper.find(Assigness).exists()).toBe(true);
});
await nextTick();
expect(wrapper.find(Assigness).exists()).toBe(true);
});
describe('when realTimeIssueSidebar is turned on', () => {
......
spec/frontend/sidebar/todo_spec.js
View file @ f43fcde5
import { GlLoadingIcon, GlIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import SidebarTodos from '~/sidebar/components/todo_toggle/todo.vue';
const defaultProps = {
......@@ -49,13 +50,12 @@ describe('SidebarTodo', () => {
);
describe('template', () => {
it('emits `toggleTodo` event when clicked on button', () => {
it('emits `toggleTodo` event when clicked on button', async () => {
createComponent();
wrapper.find('button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted().toggleTodo).toBeTruthy();
});
await nextTick();
expect(wrapper.emitted().toggleTodo).toBeTruthy();
});
it('renders component container element with proper data attributes', () => {
......
spec/frontend/snippets/components/snippet_blob_actions_edit_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { times } from 'lodash';
import { nextTick } from 'vue';
import SnippetBlobActionsEdit from '~/snippets/components/snippet_blob_actions_edit.vue';
import SnippetBlobEdit from '~/snippets/components/snippet_blob_edit.vue';
import {
......@@ -193,7 +194,7 @@ describe('snippets/components/snippet_blob_actions_edit', () => {
it('emits an action when content changes again', async () => {
triggerBlobUpdate(0, { content });
await wrapper.vm.$nextTick();
await nextTick();
expect(getLastActions()).toEqual([testEntries.updated.diff]);
});
......
spec/frontend/snippets/components/snippet_header_spec.js
View file @ f43fcde5
......@@ -2,6 +2,7 @@ import { GlButton, GlModal, GlDropdown } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { ApolloMutation } from 'vue-apollo';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import { useMockLocationHelper } from 'helpers/mock_window_location_helper';
import waitForPromises from 'helpers/wait_for_promises';
import { Blob, BinaryBlob } from 'jest/blob/components/mock_data';
......@@ -245,7 +246,7 @@ describe('Snippet header 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({ canCreateSnippet: true });
await wrapper.vm.$nextTick();
await nextTick();
expect(findButtonsAsModel()).toEqual(
expect.arrayContaining([
......@@ -348,33 +349,31 @@ describe('Snippet header component', () => {
describe('in case of successful mutation, closes modal and redirects to correct listing', () => {
useMockLocationHelper();
const createDeleteSnippet = (snippetProps = {}) => {
const createDeleteSnippet = async (snippetProps = {}) => {
createComponent({
snippetProps,
});
wrapper.vm.closeDeleteModal = jest.fn();
wrapper.vm.deleteSnippet();
return wrapper.vm.$nextTick();
await nextTick();
};
it('redirects to dashboard/snippets for personal snippet', () => {
return createDeleteSnippet().then(() => {
expect(wrapper.vm.closeDeleteModal).toHaveBeenCalled();
expect(window.location.pathname).toBe(`${gon.relative_url_root}dashboard/snippets`);
});
it('redirects to dashboard/snippets for personal snippet', async () => {
await createDeleteSnippet();
expect(wrapper.vm.closeDeleteModal).toHaveBeenCalled();
expect(window.location.pathname).toBe(`${gon.relative_url_root}dashboard/snippets`);
});
it('redirects to project snippets for project snippet', () => {
it('redirects to project snippets for project snippet', async () => {
const fullPath = 'foo/bar';
return createDeleteSnippet({
await createDeleteSnippet({
project: {
fullPath,
},
}).then(() => {
expect(wrapper.vm.closeDeleteModal).toHaveBeenCalled();
expect(window.location.pathname).toBe(`${fullPath}/-/snippets`);
});
expect(wrapper.vm.closeDeleteModal).toHaveBeenCalled();
expect(window.location.pathname).toBe(`${fullPath}/-/snippets`);
});
});
});
......
spec/frontend/static_site_editor/components/edit_meta_controls_spec.js
View file @ f43fcde5
import { GlDropdown, GlDropdownItem, GlFormInput, GlFormTextarea } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import EditMetaControls from '~/static_site_editor/components/edit_meta_controls.vue';
import { mergeRequestMeta, mergeRequestTemplates } from '../mock_data';
......@@ -38,11 +39,11 @@ describe('~/static_site_editor/components/edit_meta_controls.vue', () => {
const findGlFormTextAreaDescription = () => wrapper.find(GlFormTextarea);
beforeEach(() => {
beforeEach(async () => {
buildWrapper();
buildMocks();
return wrapper.vm.$nextTick();
await nextTick();
});
afterEach(() => {
......
spec/frontend/static_site_editor/components/edit_meta_modal_spec.js
View file @ f43fcde5
import { GlModal } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
import { nextTick } from 'vue';
import { useLocalStorageSpy } from 'helpers/local_storage_helper';
import axios from '~/lib/utils/axios_utils';
import EditMetaControls from '~/static_site_editor/components/edit_meta_controls.vue';
......@@ -50,14 +51,14 @@ describe('~/static_site_editor/components/edit_meta_modal.vue', () => {
const findEditMetaControls = () => wrapper.find(EditMetaControls);
const findLocalStorageSync = () => wrapper.find(LocalStorageSync);
beforeEach(() => {
beforeEach(async () => {
localStorage.setItem(MR_META_LOCAL_STORAGE_KEY);
buildMockAxios();
buildWrapper();
buildMockRefs();
return wrapper.vm.$nextTick();
await nextTick();
});
afterEach(() => {
......@@ -77,7 +78,7 @@ describe('~/static_site_editor/components/edit_meta_modal.vue', () => {
findLocalStorageSync().vm.$emit('input', localStorageMeta);
await wrapper.vm.$nextTick();
await nextTick();
expect(findEditMetaControls().props()).toEqual(localStorageMeta);
});
......@@ -134,13 +135,13 @@ describe('~/static_site_editor/components/edit_meta_modal.vue', () => {
it('sets the currentTemplate on the changeTemplate event', async () => {
findEditMetaControls().vm.$emit('changeTemplate', template1);
await wrapper.vm.$nextTick();
await nextTick();
expect(findEditMetaControls().props().currentTemplate).toBe(template1);
findEditMetaControls().vm.$emit('changeTemplate', null);
await wrapper.vm.$nextTick();
await nextTick();
expect(findEditMetaControls().props().currentTemplate).toBe(null);
});
......@@ -148,7 +149,7 @@ describe('~/static_site_editor/components/edit_meta_modal.vue', () => {
it('updates the description on the changeTemplate event', async () => {
findEditMetaControls().vm.$emit('changeTemplate', template1);
await wrapper.vm.$nextTick();
await nextTick();
expect(findEditMetaControls().props().description).toEqual(template1.content);
});
......@@ -164,7 +165,7 @@ describe('~/static_site_editor/components/edit_meta_modal.vue', () => {
findEditMetaControls().vm.$emit('updateSettings', newMeta);
await wrapper.vm.$nextTick();
await nextTick();
expect(findLocalStorageSync().props('value')).toEqual(newMeta);
});
......
spec/frontend/static_site_editor/pages/home_spec.js
View file @ f43fcde5
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
import EditArea from '~/static_site_editor/components/edit_area.vue';
import EditMetaModal from '~/static_site_editor/components/edit_meta_modal.vue';
......@@ -179,7 +180,7 @@ describe('static_site_editor/pages/home', () => {
});
describe('when preparing submission', () => {
it('calls the show method when the edit-area submit event is emitted', () => {
it('calls the show method when the edit-area submit event is emitted', async () => {
buildWrapper();
const mockInstance = { show: jest.fn() };
......@@ -187,9 +188,8 @@ describe('static_site_editor/pages/home', () => {
findEditArea().vm.$emit('submit', { content });
return wrapper.vm.$nextTick().then(() => {
expect(mockInstance.show).toHaveBeenCalled();
});
await nextTick();
expect(mockInstance.show).toHaveBeenCalled();
});
});
......@@ -200,13 +200,13 @@ describe('static_site_editor/pages/home', () => {
.mockRejectedValueOnce(new Error(submitChangesError));
};
beforeEach(() => {
beforeEach(async () => {
setupMutateMock();
buildWrapper({ content });
findEditMetaModal().vm.$emit('primary', mergeRequestMeta);
return wrapper.vm.$nextTick();
await nextTick();
});
it('displays submit changes error message', () => {
......@@ -221,12 +221,11 @@ describe('static_site_editor/pages/home', () => {
expect(mutateMock).toHaveBeenCalled();
});
it('hides submit changes error message when dismiss button is clicked', () => {
it('hides submit changes error message when dismiss button is clicked', async () => {
findSubmitChangesError().vm.$emit('dismiss');
return wrapper.vm.$nextTick().then(() => {
expect(findSubmitChangesError().exists()).toBe(false);
});
await nextTick();
expect(findSubmitChangesError().exists()).toBe(false);
});
});
......@@ -234,7 +233,7 @@ describe('static_site_editor/pages/home', () => {
const newContent = `new ${content}`;
const formattedMarkdown = `formatted ${content}`;
beforeEach(() => {
beforeEach(async () => {
mutateMock.mockResolvedValueOnce(hasSubmittedChangesMutationPayload).mockResolvedValueOnce({
data: {
submitContentChanges: savedContentMeta,
......@@ -249,7 +248,7 @@ describe('static_site_editor/pages/home', () => {
findEditMetaModal().vm.$emit('primary', mergeRequestMeta);
return wrapper.vm.$nextTick();
await nextTick();
});
it('dispatches hasSubmittedChanges mutation', () => {
......
spec/frontend/terraform/components/states_table_actions_spec.js
View file @ f43fcde5
......@@ -2,6 +2,7 @@ import { GlDropdown, GlModal, GlSprintf } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import InitCommandModal from '~/terraform/components/init_command_modal.vue';
......@@ -58,7 +59,7 @@ describe('StatesTableActions', () => {
);
};
const createComponent = (propsData = defaultProps) => {
const createComponent = async (propsData = defaultProps) => {
const apolloProvider = createMockApolloProvider();
toast = jest.fn();
......@@ -70,7 +71,7 @@ describe('StatesTableActions', () => {
stubs: { GlDropdown, GlModal, GlSprintf },
});
return wrapper.vm.$nextTick();
await nextTick();
};
const findActionsDropdown = () => wrapper.findComponent(GlDropdown);
......
spec/frontend/terraform/components/states_table_spec.js
View file @ f43fcde5
import { GlIcon, GlLoadingIcon, GlTooltip } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { useFakeDate } from 'helpers/fake_date';
import StatesTable from '~/terraform/components/states_table.vue';
import StateActions from '~/terraform/components/states_table_actions.vue';
......@@ -106,9 +107,9 @@ describe('StatesTable', () => {
],
};
const createComponent = (propsData = defaultProps) => {
const createComponent = async (propsData = defaultProps) => {
wrapper = mount(StatesTable, { propsData });
return wrapper.vm.$nextTick();
await nextTick();
};
const findActions = () => wrapper.findAll(StateActions);
......
spec/frontend/tooltips/components/tooltips_spec.js
View file @ f43fcde5
import { GlTooltip } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { useMockMutationObserver } from 'helpers/mock_dom_observer';
import Tooltips from '~/tooltips/components/tooltips.vue';
......@@ -46,7 +47,7 @@ describe('tooltips/components/tooltips.vue', () => {
it('attaches tooltips to the targets specified', async () => {
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).props('target')).toBe(target);
});
......@@ -56,7 +57,7 @@ describe('tooltips/components/tooltips.vue', () => {
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).exists()).toBe(false);
});
......@@ -65,7 +66,7 @@ describe('tooltips/components/tooltips.vue', () => {
wrapper.vm.addTooltips([target]);
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.findAll(GlTooltip)).toHaveLength(1);
});
......@@ -73,7 +74,7 @@ describe('tooltips/components/tooltips.vue', () => {
it('sets tooltip content from title attribute', async () => {
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).text()).toBe(target.getAttribute('title'));
});
......@@ -85,7 +86,7 @@ describe('tooltips/components/tooltips.vue', () => {
});
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).html()).toContain(target.getAttribute('title'));
});
......@@ -94,7 +95,7 @@ describe('tooltips/components/tooltips.vue', () => {
const config = { show: true };
target = createTooltipTarget();
wrapper.vm.addTooltips([target], config);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).props()).toMatchObject(config);
});
......@@ -110,7 +111,7 @@ describe('tooltips/components/tooltips.vue', () => {
target = createTooltipTarget({ [attribute]: value });
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).props(prop)).toBe(value);
},
......@@ -124,10 +125,10 @@ describe('tooltips/components/tooltips.vue', () => {
it('removes all tooltips when elements is nil', async () => {
wrapper.vm.addTooltips([createTooltipTarget(), createTooltipTarget()]);
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.dispose();
await wrapper.vm.$nextTick();
await nextTick();
expect(allTooltips()).toHaveLength(0);
});
......@@ -136,10 +137,10 @@ describe('tooltips/components/tooltips.vue', () => {
const target = createTooltipTarget();
wrapper.vm.addTooltips([target, createTooltipTarget()]);
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.dispose(target);
await wrapper.vm.$nextTick();
await nextTick();
expect(allTooltips()).toHaveLength(1);
});
......@@ -154,13 +155,13 @@ describe('tooltips/components/tooltips.vue', () => {
const target = createTooltipTarget();
wrapper.vm.addTooltips([target, createTooltipTarget()]);
await wrapper.vm.$nextTick();
await nextTick();
triggerMutate(document.body, {
entry: { removedNodes: [target] },
options: { childList: true },
});
await wrapper.vm.$nextTick();
await nextTick();
expect(allTooltips()).toHaveLength(1);
});
......@@ -175,7 +176,7 @@ describe('tooltips/components/tooltips.vue', () => {
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
wrapper.vm.triggerEvent(target, event);
......@@ -195,14 +196,14 @@ describe('tooltips/components/tooltips.vue', () => {
wrapper.vm.addTooltips([target]);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).text()).toBe(currentTitle);
target.setAttribute('title', newTitle);
wrapper.vm.fixTitle(target);
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find(GlTooltip).text()).toBe(newTitle);
});
......@@ -225,7 +226,7 @@ describe('tooltips/components/tooltips.vue', () => {
buildWrapper();
wrapper.vm.addTooltips([createTooltipTarget()]);
await wrapper.vm.$nextTick();
await nextTick();
wrapper.findComponent(GlTooltip).vm.$emit('hidden');
expect(wrapper.emitted('hidden')).toHaveLength(1);
......
spec/frontend/user_lists/components/add_user_modal_spec.js
View file @ f43fcde5
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import AddUserModal from '~/user_lists/components/add_user_modal.vue';
describe('Add User Modal', () => {
......@@ -30,7 +31,7 @@ describe('Add User Modal', () => {
it('should clear the input after emitting', async () => {
click('confirm-add-user-ids');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('#add-user-ids').element.value).toBe('');
});
......@@ -42,7 +43,7 @@ describe('Add User Modal', () => {
it('should clear the input after cancelling', async () => {
click('cancel-add-user-ids');
await wrapper.vm.$nextTick();
await nextTick();
expect(wrapper.find('#add-user-ids').element.value).toBe('');
});
......
spec/frontend/user_lists/components/edit_user_list_spec.js
View file @ f43fcde5
import { GlAlert, GlLoadingIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import waitForPromises from 'helpers/wait_for_promises';
import Api from '~/api';
......@@ -77,11 +77,11 @@ describe('user_lists/components/edit_user_list', () => {
});
describe('update', () => {
beforeEach(() => {
beforeEach(async () => {
Api.fetchFeatureFlagUserList.mockResolvedValue({ data: userList });
factory();
return wrapper.vm.$nextTick();
await nextTick();
});
it('should link to the documentation', () => {
......@@ -99,11 +99,11 @@ describe('user_lists/components/edit_user_list', () => {
});
describe('success', () => {
beforeEach(() => {
beforeEach(async () => {
Api.updateFeatureFlagUserList.mockResolvedValue({ data: userList });
setInputValue('test');
clickSave();
return wrapper.vm.$nextTick();
await nextTick();
});
it('should create a user list with the entered name', () => {
......@@ -139,7 +139,7 @@ describe('user_lists/components/edit_user_list', () => {
it('should dismiss the error if dismiss is clicked', async () => {
alert.find('button').trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(alert.exists()).toBe(false);
});
......
spec/frontend/user_lists/components/new_user_list_spec.js
View file @ f43fcde5
import { GlAlert } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import waitForPromises from 'helpers/wait_for_promises';
import Api from '~/api';
......@@ -43,11 +43,11 @@ describe('user_lists/components/new_user_list', () => {
describe('create', () => {
describe('success', () => {
beforeEach(() => {
beforeEach(async () => {
Api.createFeatureFlagUserList.mockResolvedValue({ data: userList });
setInputValue('test');
click('save-user-list');
return wrapper.vm.$nextTick();
await nextTick();
});
it('should create a user list with the entered name', () => {
......@@ -82,7 +82,7 @@ describe('user_lists/components/new_user_list', () => {
it('should dismiss the error when the dismiss button is clicked', async () => {
alert.find('button').trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(alert.exists()).toBe(false);
});
......
spec/frontend/user_lists/components/user_list_spec.js
View file @ f43fcde5
import { GlAlert, GlEmptyState, GlLoadingIcon } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { uniq } from 'lodash';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import Api from '~/api';
import UserList from '~/user_lists/components/user_list.vue';
......@@ -57,12 +57,12 @@ describe('User List', () => {
describe('success', () => {
let userIds;
beforeEach(() => {
beforeEach(async () => {
userIds = parseUserIds(userList.user_xids);
Api.fetchFeatureFlagUserList.mockResolvedValueOnce({ data: userList });
factory();
return wrapper.vm.$nextTick();
await nextTick();
});
it('requests the user list on mount', () => {
......@@ -101,10 +101,10 @@ describe('User List', () => {
beforeEach(async () => {
Api.updateFeatureFlagUserList.mockResolvedValue(userList);
click('add-users');
await wrapper.vm.$nextTick();
await nextTick();
wrapper.find('#add-user-ids').setValue(`${stringifyUserIds(newIds)},`);
click('confirm-add-user-ids');
await wrapper.vm.$nextTick();
await nextTick();
[[, { user_xids: receivedUserIds }]] = Api.updateFeatureFlagUserList.mock.calls;
parsedReceivedUserIds = parseUserIds(receivedUserIds);
});
......@@ -140,7 +140,7 @@ describe('User List', () => {
beforeEach(async () => {
Api.updateFeatureFlagUserList.mockResolvedValue(userList);
click('delete-user-id');
await wrapper.vm.$nextTick();
await nextTick();
[[, { user_xids: receivedUserIds }]] = Api.updateFeatureFlagUserList.mock.calls;
});
......@@ -159,11 +159,11 @@ describe('User List', () => {
describe('error', () => {
const findAlert = () => wrapper.find(GlAlert);
beforeEach(() => {
beforeEach(async () => {
Api.fetchFeatureFlagUserList.mockRejectedValue();
factory();
return wrapper.vm.$nextTick();
await nextTick();
});
it('displays the alert message', () => {
......@@ -175,18 +175,18 @@ describe('User List', () => {
const alert = findAlert();
alert.find('button').trigger('click');
await wrapper.vm.$nextTick();
await nextTick();
expect(alert.exists()).toBe(false);
});
});
describe('empty list', () => {
beforeEach(() => {
beforeEach(async () => {
Api.fetchFeatureFlagUserList.mockResolvedValueOnce({ data: { ...userList, user_xids: '' } });
factory();
return wrapper.vm.$nextTick();
await nextTick();
});
it('displays an empty state', () => {
......
spec/frontend/user_lists/components/user_lists_table_spec.js
View file @ f43fcde5
import { GlModal } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import * as timeago from 'timeago.js';
import { nextTick } from 'vue';
import UserListsTable from '~/user_lists/components/user_lists_table.vue';
import { userList } from '../../feature_flags/mock_data';
......@@ -56,43 +57,40 @@ describe('User Lists Table', () => {
});
describe('delete button', () => {
it('should display the confirmation modal', () => {
it('should display the confirmation modal', async () => {
const modal = wrapper.find(GlModal);
wrapper.find('[data-testid="delete-user-list"]').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(modal.text()).toContain(`Delete ${userList.name}?`);
expect(modal.text()).toContain(`User list ${userList.name} will be removed.`);
});
await nextTick();
expect(modal.text()).toContain(`Delete ${userList.name}?`);
expect(modal.text()).toContain(`User list ${userList.name} will be removed.`);
});
});
describe('confirmation modal', () => {
let modal;
beforeEach(() => {
beforeEach(async () => {
modal = wrapper.find(GlModal);
wrapper.find('button').trigger('click');
return wrapper.vm.$nextTick();
await nextTick();
});
it('should emit delete with list on confirmation', () => {
it('should emit delete with list on confirmation', async () => {
modal.find('[data-testid="modal-confirm"]').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted('delete')).toEqual([[userLists[0]]]);
});
await nextTick();
expect(wrapper.emitted('delete')).toEqual([[userLists[0]]]);
});
it('should not emit delete with list when not confirmed', () => {
it('should not emit delete with list when not confirmed', async () => {
modal.find('button').trigger('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.emitted('delete')).toBeUndefined();
});
await nextTick();
expect(wrapper.emitted('delete')).toBeUndefined();
});
});
});
spec/frontend/whats_new/components/app_spec.js
View file @ f43fcde5
import { GlDrawer, GlInfiniteScroll } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import Vue from 'vue';
import Vue, { nextTick } from 'vue';
import Vuex from 'vuex';
import { mockTracking, unmockTracking, triggerEvent } from 'helpers/tracking_helper';
import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
......@@ -67,7 +67,7 @@ describe('App', () => {
{ title: 'Whats New Drawer', url: 'www.url.com', release: 3.11 },
];
wrapper.vm.$store.state.drawerBodyHeight = MOCK_DRAWER_BODY_HEIGHT;
await wrapper.vm.$nextTick();
await nextTick();
};
afterEach(() => {
......@@ -108,7 +108,7 @@ describe('App', () => {
it.each([true, false])('passes open property', async (openState) => {
wrapper.vm.$store.state.open = openState;
await wrapper.vm.$nextTick();
await nextTick();
expect(getDrawer().props('open')).toBe(openState);
});
......
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