diff options
Diffstat (limited to 'spec/frontend/feature_flags')
13 files changed, 137 insertions, 147 deletions
diff --git a/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js b/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js index f244da228b3..4a0242b4a46 100644 --- a/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js +++ b/spec/frontend/feature_flags/components/configure_feature_flags_modal_spec.js @@ -1,5 +1,6 @@ import { GlModal, GlSprintf, GlAlert } from '@gitlab/ui'; +import { nextTick } from 'vue'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import Component from '~/feature_flags/components/configure_feature_flags_modal.vue'; @@ -56,7 +57,7 @@ describe('Configure Feature Flags Modal', () => { it('should emit a `token` event when clicking on the Primary action', async () => { findGlModal().vm.$emit('secondary', mockEvent); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.emitted('token')).toEqual([[]]); expect(mockEvent.preventDefault).toHaveBeenCalled(); }); @@ -64,7 +65,7 @@ describe('Configure Feature Flags Modal', () => { it('should clear the project name input after generating the token', async () => { findProjectNameInput().vm.$emit('input', provide.projectName); findGlModal().vm.$emit('primary', mockEvent); - await wrapper.vm.$nextTick(); + await nextTick(); expect(findProjectNameInput().attributes('value')).toBe(''); }); @@ -116,7 +117,7 @@ describe('Configure Feature Flags Modal', () => { it('should enable the secondary action', async () => { findProjectNameInput().vm.$emit('input', provide.projectName); - await wrapper.vm.$nextTick(); + await nextTick(); const [{ disabled }] = findSecondaryAction().attributes; expect(disabled).toBe(false); }); diff --git a/spec/frontend/feature_flags/components/edit_feature_flag_spec.js b/spec/frontend/feature_flags/components/edit_feature_flag_spec.js index 721b7249abc..05709cd05e6 100644 --- a/spec/frontend/feature_flags/components/edit_feature_flag_spec.js +++ b/spec/frontend/feature_flags/components/edit_feature_flag_spec.js @@ -1,7 +1,7 @@ import { GlToggle, GlAlert } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; -import Vue from 'vue'; +import Vue, { nextTick } from 'vue'; import Vuex from 'vuex'; import { mockTracking } from 'helpers/tracking_helper'; import waitForPromises from 'helpers/wait_for_promises'; @@ -12,6 +12,7 @@ import createStore from '~/feature_flags/store/edit'; import axios from '~/lib/utils/axios_utils'; Vue.use(Vuex); + describe('Edit feature flag form', () => { let wrapper; let mock; @@ -66,13 +67,12 @@ describe('Edit feature flag form', () => { }); describe('with error', () => { - it('should render the error', () => { + it('should render the error', async () => { store.dispatch('receiveUpdateFeatureFlagError', { message: ['The name is required'] }); - return wrapper.vm.$nextTick(() => { - const warningGlAlert = findWarningGlAlert(); - expect(warningGlAlert.exists()).toEqual(true); - expect(warningGlAlert.text()).toContain('The name is required'); - }); + await nextTick(); + const warningGlAlert = findWarningGlAlert(); + expect(warningGlAlert.exists()).toEqual(true); + expect(warningGlAlert.text()).toContain('The name is required'); }); }); diff --git a/spec/frontend/feature_flags/components/empty_state_spec.js b/spec/frontend/feature_flags/components/empty_state_spec.js index 86d0c1a05fd..4ac82ae44a6 100644 --- a/spec/frontend/feature_flags/components/empty_state_spec.js +++ b/spec/frontend/feature_flags/components/empty_state_spec.js @@ -1,5 +1,6 @@ import { GlAlert, GlEmptyState, GlLink, GlLoadingIcon } from '@gitlab/ui'; import { mount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import EmptyState from '~/feature_flags/components/empty_state.vue'; const DEFAULT_PROPS = { @@ -123,7 +124,7 @@ describe('feature_flags/components/feature_flags_tab.vue', () => { beforeEach(async () => { wrapper = factory(); - await wrapper.vm.$nextTick(); + await nextTick(); slot = wrapper.find('[data-testid="test-slot"]'); }); diff --git a/spec/frontend/feature_flags/components/environments_dropdown_spec.js b/spec/frontend/feature_flags/components/environments_dropdown_spec.js index 9194db3a182..cca472012e9 100644 --- a/spec/frontend/feature_flags/components/environments_dropdown_spec.js +++ b/spec/frontend/feature_flags/components/environments_dropdown_spec.js @@ -1,6 +1,7 @@ import { GlLoadingIcon, GlButton, GlSearchBoxByType } 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 EnvironmentsDropdown from '~/feature_flags/components/environments_dropdown.vue'; @@ -54,7 +55,7 @@ describe('Feature flags > Environments dropdown ', () => { factory(); findEnvironmentSearchInput().vm.$emit('focus'); await waitForPromises(); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.find('.dropdown-content > ul').exists()).toBe(true); expect(wrapper.findAll('.dropdown-content > ul > li').exists()).toBe(true); }); @@ -66,7 +67,7 @@ describe('Feature flags > Environments dropdown ', () => { factory(); findEnvironmentSearchInput().vm.$emit('keyup'); await waitForPromises(); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.find('.dropdown-content > ul').exists()).toBe(true); expect(wrapper.findAll('.dropdown-content > ul > li').exists()).toBe(true); }); @@ -80,7 +81,7 @@ describe('Feature flags > Environments dropdown ', () => { findEnvironmentSearchInput().vm.$emit('focus'); findEnvironmentSearchInput().vm.$emit('input', 'production'); await waitForPromises(); - await wrapper.vm.$nextTick(); + await nextTick(); }); it('sets filter value', () => { @@ -103,7 +104,7 @@ describe('Feature flags > Environments dropdown ', () => { .filter((b) => b.text() === 'production') .at(0); button.vm.$emit('click'); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.emitted('selectEnvironment')).toEqual([['production']]); }); }); @@ -111,7 +112,7 @@ describe('Feature flags > Environments dropdown ', () => { describe('on click clear button', () => { beforeEach(async () => { wrapper.find(GlButton).vm.$emit('click'); - await wrapper.vm.$nextTick(); + await nextTick(); }); it('resets filter value', () => { @@ -132,12 +133,12 @@ describe('Feature flags > Environments dropdown ', () => { findEnvironmentSearchInput().vm.$emit('focus'); findEnvironmentSearchInput().vm.$emit('input', 'production'); await waitForPromises(); - await wrapper.vm.$nextTick(); + await nextTick(); }); it('emits create event', async () => { wrapper.findAll(GlButton).at(0).vm.$emit('click'); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.emitted('createClicked')).toEqual([['production']]); }); }); diff --git a/spec/frontend/feature_flags/components/feature_flags_spec.js b/spec/frontend/feature_flags/components/feature_flags_spec.js index db4bdc736de..d27b23c5cd1 100644 --- a/spec/frontend/feature_flags/components/feature_flags_spec.js +++ b/spec/frontend/feature_flags/components/feature_flags_spec.js @@ -1,5 +1,6 @@ import { GlAlert, GlEmptyState, GlLoadingIcon } from '@gitlab/ui'; -import { mount, createLocalVue } from '@vue/test-utils'; +import { mount } from '@vue/test-utils'; +import Vue, { nextTick } from 'vue'; import MockAdapter from 'axios-mock-adapter'; import Vuex from 'vuex'; import waitForPromises from 'helpers/wait_for_promises'; @@ -13,8 +14,7 @@ import axios from '~/lib/utils/axios_utils'; import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue'; import { getRequestData } from '../mock_data'; -const localVue = createLocalVue(); -localVue.use(Vuex); +Vue.use(Vuex); describe('Feature flags', () => { const mockData = { @@ -45,7 +45,6 @@ describe('Feature flags', () => { const factory = (provide = mockData, fn = mount) => { store = createStore(mockState); wrapper = fn(FeatureFlagsComponent, { - localVue, store, provide, stubs: { @@ -72,12 +71,12 @@ describe('Feature flags', () => { describe('when limit exceeded', () => { const provideData = { ...mockData, featureFlagsLimitExceeded: true }; - beforeEach((done) => { + beforeEach(() => { mock .onGet(`${TEST_HOST}/endpoint.json`, { params: { page: '1' } }) .reply(200, getRequestData, {}); factory(provideData); - setImmediate(done); + return waitForPromises(); }); it('makes the new feature flag button do nothing if clicked', () => { @@ -117,12 +116,12 @@ describe('Feature flags', () => { userListPath: null, }; - beforeEach((done) => { + beforeEach(() => { mock .onGet(`${TEST_HOST}/endpoint.json`, { params: { page: '1' } }) .reply(200, getRequestData, {}); factory(provideData); - setImmediate(done); + return waitForPromises(); }); it('does not render configure button', () => { @@ -173,7 +172,7 @@ describe('Feature flags', () => { factory(); await waitForPromises(); - await wrapper.vm.$nextTick(); + await nextTick(); emptyState = wrapper.findComponent(GlEmptyState); }); @@ -203,7 +202,7 @@ describe('Feature flags', () => { }); describe('with paginated feature flags', () => { - beforeEach((done) => { + beforeEach(() => { mock.onGet(mockState.endpoint, { params: { page: '1' } }).replyOnce(200, getRequestData, { 'x-next-page': '2', 'x-page': '1', @@ -215,7 +214,7 @@ describe('Feature flags', () => { factory(); jest.spyOn(store, 'dispatch'); - setImmediate(done); + return waitForPromises(); }); it('should render a table with feature flags', () => { @@ -271,11 +270,11 @@ describe('Feature flags', () => { }); describe('unsuccessful request', () => { - beforeEach((done) => { + beforeEach(() => { mock.onGet(mockState.endpoint, { params: { page: '1' } }).replyOnce(500, {}); factory(); - setImmediate(done); + return waitForPromises(); }); it('should render error state', () => { @@ -301,12 +300,12 @@ describe('Feature flags', () => { }); describe('rotate instance id', () => { - beforeEach((done) => { + beforeEach(() => { mock .onGet(`${TEST_HOST}/endpoint.json`, { params: { page: '1' } }) .reply(200, getRequestData, {}); factory(); - setImmediate(done); + return waitForPromises(); }); it('should fire the rotate action when a `token` event is received', () => { diff --git a/spec/frontend/feature_flags/components/feature_flags_table_spec.js b/spec/frontend/feature_flags/components/feature_flags_table_spec.js index d06d60ae310..99864a95f59 100644 --- a/spec/frontend/feature_flags/components/feature_flags_table_spec.js +++ b/spec/frontend/feature_flags/components/feature_flags_table_spec.js @@ -1,5 +1,6 @@ import { GlToggle, GlBadge } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import { trimText } from 'helpers/text_helper'; import { mockTracking } from 'helpers/tracking_helper'; import FeatureFlagsTable from '~/feature_flags/components/feature_flags_table.vue'; @@ -148,13 +149,12 @@ describe('Feature flag table', () => { }); }); - it('should trigger a toggle event', () => { + it('should trigger a toggle event', async () => { toggle.vm.$emit('change'); const flag = { ...props.featureFlags[0], active: !props.featureFlags[0].active }; - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.emitted('toggle-flag')).toEqual([[flag]]); - }); + await nextTick(); + expect(wrapper.emitted('toggle-flag')).toEqual([[flag]]); }); it('tracks a click', () => { diff --git a/spec/frontend/feature_flags/components/form_spec.js b/spec/frontend/feature_flags/components/form_spec.js index c0f9638390a..3ad1225906b 100644 --- a/spec/frontend/feature_flags/components/form_spec.js +++ b/spec/frontend/feature_flags/components/form_spec.js @@ -1,5 +1,6 @@ import { GlButton } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import Api from '~/api'; import Form from '~/feature_flags/components/form.vue'; @@ -126,28 +127,26 @@ describe('feature flag form', () => { expect(wrapper.findAll(Strategy)).toHaveLength(2); }); - it('adds an all users strategy when clicking the Add button', () => { + it('adds an all users strategy when clicking the Add button', async () => { wrapper.find(GlButton).vm.$emit('click'); - return wrapper.vm.$nextTick().then(() => { - const strategies = wrapper.findAll(Strategy); + await nextTick(); + const strategies = wrapper.findAll(Strategy); - expect(strategies).toHaveLength(3); - expect(strategies.at(2).props('strategy')).toEqual(allUsersStrategy); - }); + expect(strategies).toHaveLength(3); + expect(strategies.at(2).props('strategy')).toEqual(allUsersStrategy); }); - it('should remove a strategy on delete', () => { + it('should remove a strategy on delete', async () => { const strategy = { type: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, parameters: { percentage: '30' }, scopes: [], }; wrapper.find(Strategy).vm.$emit('delete'); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.findAll(Strategy)).toHaveLength(1); - expect(wrapper.find(Strategy).props('strategy')).not.toEqual(strategy); - }); + await nextTick(); + expect(wrapper.findAll(Strategy)).toHaveLength(1); + expect(wrapper.find(Strategy).props('strategy')).not.toEqual(strategy); }); }); }); diff --git a/spec/frontend/feature_flags/components/new_environments_dropdown_spec.js b/spec/frontend/feature_flags/components/new_environments_dropdown_spec.js index 6342ac0bda7..63fa5d19982 100644 --- a/spec/frontend/feature_flags/components/new_environments_dropdown_spec.js +++ b/spec/frontend/feature_flags/components/new_environments_dropdown_spec.js @@ -1,6 +1,7 @@ import { GlLoadingIcon, GlSearchBoxByType, GlDropdownItem } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; +import { nextTick } from 'vue'; import NewEnvironmentsDropdown from '~/feature_flags/components/new_environments_dropdown.vue'; import axios from '~/lib/utils/axios_utils'; import httpStatusCodes from '~/lib/utils/http_status'; @@ -47,16 +48,13 @@ describe('New Environments Dropdown', () => { describe('with empty results', () => { let item; - beforeEach(() => { + beforeEach(async () => { axiosMock.onGet(TEST_HOST).reply(200, []); wrapper.find(GlSearchBoxByType).vm.$emit('focus'); wrapper.find(GlSearchBoxByType).vm.$emit('input', TEST_SEARCH); - return axios - .waitForAll() - .then(() => wrapper.vm.$nextTick()) - .then(() => { - item = wrapper.find(GlDropdownItem); - }); + await axios.waitForAll(); + await nextTick(); + item = wrapper.find(GlDropdownItem); }); it('should display a Create item label', () => { diff --git a/spec/frontend/feature_flags/components/new_feature_flag_spec.js b/spec/frontend/feature_flags/components/new_feature_flag_spec.js index fe98b6421d4..9c1657bc0d2 100644 --- a/spec/frontend/feature_flags/components/new_feature_flag_spec.js +++ b/spec/frontend/feature_flags/components/new_feature_flag_spec.js @@ -1,5 +1,6 @@ import { GlAlert } from '@gitlab/ui'; -import { shallowMount, createLocalVue } from '@vue/test-utils'; +import { shallowMount } from '@vue/test-utils'; +import Vue, { nextTick } from 'vue'; import Vuex from 'vuex'; import { TEST_HOST } from 'spec/test_constants'; import Form from '~/feature_flags/components/form.vue'; @@ -10,8 +11,7 @@ import { allUsersStrategy } from '../mock_data'; const userCalloutId = 'feature_flags_new_version'; const userCalloutsPath = `${TEST_HOST}/user_callouts`; -const localVue = createLocalVue(); -localVue.use(Vuex); +Vue.use(Vuex); describe('New feature flag form', () => { let wrapper; @@ -27,7 +27,6 @@ describe('New feature flag form', () => { wrapper = null; } wrapper = shallowMount(NewFeatureFlag, { - localVue, store, provide: { showUserCallout: true, @@ -52,13 +51,12 @@ describe('New feature flag form', () => { }); describe('with error', () => { - it('should render the error', () => { + it('should render the error', async () => { store.dispatch('receiveCreateFeatureFlagError', { message: ['The name is required'] }); - return wrapper.vm.$nextTick(() => { - const warningGlAlert = findWarningGlAlert(); - expect(warningGlAlert.at(0).exists()).toBe(true); - expect(warningGlAlert.at(0).text()).toContain('The name is required'); - }); + await nextTick(); + const warningGlAlert = findWarningGlAlert(); + expect(warningGlAlert.at(0).exists()).toBe(true); + expect(warningGlAlert.at(0).text()).toContain('The name is required'); }); }); diff --git a/spec/frontend/feature_flags/components/strategies/flexible_rollout_spec.js b/spec/frontend/feature_flags/components/strategies/flexible_rollout_spec.js index 07aa456e69e..56b14d80ab3 100644 --- a/spec/frontend/feature_flags/components/strategies/flexible_rollout_spec.js +++ b/spec/frontend/feature_flags/components/strategies/flexible_rollout_spec.js @@ -1,5 +1,6 @@ import { GlFormInput, GlFormSelect } from '@gitlab/ui'; import { mount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import FlexibleRollout from '~/feature_flags/components/strategies/flexible_rollout.vue'; import ParameterFormGroup from '~/feature_flags/components/strategies/parameter_form_group.vue'; import { PERCENT_ROLLOUT_GROUP_ID } from '~/feature_flags/constants'; @@ -51,7 +52,7 @@ describe('feature_flags/components/strategies/flexible_rollout.vue', () => { it('emits a change when the percentage value changes', async () => { percentageInput.setValue('75'); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.emitted('change')).toEqual([ [ { diff --git a/spec/frontend/feature_flags/components/strategies/gitlab_user_list_spec.js b/spec/frontend/feature_flags/components/strategies/gitlab_user_list_spec.js index 6188672b23b..3b69194494f 100644 --- a/spec/frontend/feature_flags/components/strategies/gitlab_user_list_spec.js +++ b/spec/frontend/feature_flags/components/strategies/gitlab_user_list_spec.js @@ -1,5 +1,6 @@ import { GlDropdown, GlDropdownItem, GlSearchBoxByType, GlLoadingIcon } from '@gitlab/ui'; -import { mount, createLocalVue } from '@vue/test-utils'; +import { mount } from '@vue/test-utils'; +import Vue, { nextTick } from 'vue'; import Vuex from 'vuex'; import Api from '~/api'; import GitlabUserList from '~/feature_flags/components/strategies/gitlab_user_list.vue'; @@ -12,15 +13,13 @@ const DEFAULT_PROPS = { strategy: userListStrategy, }; -const localVue = createLocalVue(); -localVue.use(Vuex); +Vue.use(Vuex); describe('~/feature_flags/components/strategies/gitlab_user_list.vue', () => { let wrapper; const factory = (props = {}) => mount(GitlabUserList, { - localVue, store: createStore({ projectId: '1' }), propsData: { ...DEFAULT_PROPS, ...props }, }); @@ -72,7 +71,7 @@ describe('~/feature_flags/components/strategies/gitlab_user_list.vue', () => { ); const searchWrapper = wrapper.find(GlSearchBoxByType); searchWrapper.vm.$emit('input', 'new'); - await wrapper.vm.$nextTick(); + await nextTick(); const loadingIcon = wrapper.find(GlLoadingIcon); expect(loadingIcon.exists()).toBe(true); @@ -80,7 +79,7 @@ describe('~/feature_flags/components/strategies/gitlab_user_list.vue', () => { r({ data: [userList] }); - await wrapper.vm.$nextTick(); + await nextTick(); expect(loadingIcon.exists()).toBe(false); }); diff --git a/spec/frontend/feature_flags/components/strategies/percent_rollout_spec.js b/spec/frontend/feature_flags/components/strategies/percent_rollout_spec.js index 442f7faf161..180697e93e4 100644 --- a/spec/frontend/feature_flags/components/strategies/percent_rollout_spec.js +++ b/spec/frontend/feature_flags/components/strategies/percent_rollout_spec.js @@ -1,5 +1,6 @@ import { GlFormInput } from '@gitlab/ui'; import { mount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import ParameterFormGroup from '~/feature_flags/components/strategies/parameter_form_group.vue'; import PercentRollout from '~/feature_flags/components/strategies/percent_rollout.vue'; import { PERCENT_ROLLOUT_GROUP_ID } from '~/feature_flags/constants'; @@ -39,7 +40,7 @@ describe('~/feature_flags/components/strategies/percent_rollout.vue', () => { it('emits a change when the value changes', async () => { input.setValue('75'); - await wrapper.vm.$nextTick(); + await nextTick(); expect(wrapper.emitted('change')).toEqual([ [{ parameters: { percentage: '75', groupId: PERCENT_ROLLOUT_GROUP_ID } }], ]); diff --git a/spec/frontend/feature_flags/components/strategy_spec.js b/spec/frontend/feature_flags/components/strategy_spec.js index 4fdf436bfc4..aee3873721c 100644 --- a/spec/frontend/feature_flags/components/strategy_spec.js +++ b/spec/frontend/feature_flags/components/strategy_spec.js @@ -1,5 +1,6 @@ import { GlAlert, GlFormSelect, GlLink, GlToken, GlButton } from '@gitlab/ui'; -import { mount, createLocalVue } from '@vue/test-utils'; +import { mount } from '@vue/test-utils'; +import Vue, { nextTick } from 'vue'; import { last } from 'lodash'; import Vuex from 'vuex'; import Api from '~/api'; @@ -26,8 +27,7 @@ const provide = { environmentsEndpoint: '', }; -const localVue = createLocalVue(); -localVue.use(Vuex); +Vue.use(Vuex); describe('Feature flags strategy', () => { let wrapper; @@ -48,7 +48,7 @@ describe('Feature flags strategy', () => { wrapper.destroy(); wrapper = null; } - wrapper = mount(Strategy, { localVue, store: createStore({ projectId: '1' }), ...opts }); + wrapper = mount(Strategy, { store: createStore({ projectId: '1' }), ...opts }); }; beforeEach(() => { @@ -85,11 +85,11 @@ describe('Feature flags strategy', () => { let propsData; let strategy; - beforeEach(() => { + beforeEach(async () => { strategy = { name, parameters: {}, scopes: [] }; propsData = { strategy, index: 0 }; factory({ propsData, provide }); - return wrapper.vm.$nextTick(); + await nextTick(); }); it('should set the select to match the strategy name', () => { @@ -138,19 +138,18 @@ describe('Feature flags strategy', () => { factory({ propsData, provide }); }); - it('should revert to all-environments scope when last scope is removed', () => { + it('should revert to all-environments scope when last scope is removed', async () => { const token = wrapper.find(GlToken); token.vm.$emit('close'); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.findAll(GlToken)).toHaveLength(0); - expect(last(wrapper.emitted('change'))).toEqual([ - { - name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, - parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, - scopes: [{ environmentScope: '*' }], - }, - ]); - }); + await nextTick(); + expect(wrapper.findAll(GlToken)).toHaveLength(0); + expect(last(wrapper.emitted('change'))).toEqual([ + { + name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, + parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, + scopes: [{ environmentScope: '*' }], + }, + ]); }); }); @@ -167,56 +166,52 @@ describe('Feature flags strategy', () => { factory({ propsData, provide }); }); - it('should change the parameters if a different strategy is chosen', () => { + it('should change the parameters if a different strategy is chosen', async () => { const select = wrapper.find(GlFormSelect); select.setValue(ROLLOUT_STRATEGY_ALL_USERS); - return wrapper.vm.$nextTick().then(() => { - expect(last(wrapper.emitted('change'))).toEqual([ - { - name: ROLLOUT_STRATEGY_ALL_USERS, - parameters: {}, - scopes: [{ environmentScope: '*' }], - }, - ]); - }); + await nextTick(); + expect(last(wrapper.emitted('change'))).toEqual([ + { + name: ROLLOUT_STRATEGY_ALL_USERS, + parameters: {}, + scopes: [{ environmentScope: '*' }], + }, + ]); }); - it('should display selected scopes', () => { + it('should display selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.findAll(GlToken)).toHaveLength(1); - expect(wrapper.find(GlToken).text()).toBe('production'); - }); + await nextTick(); + expect(wrapper.findAll(GlToken)).toHaveLength(1); + expect(wrapper.find(GlToken).text()).toBe('production'); }); - it('should display all selected scopes', () => { + it('should display all selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); dropdown.vm.$emit('add', 'staging'); - return wrapper.vm.$nextTick().then(() => { - const tokens = wrapper.findAll(GlToken); - expect(tokens).toHaveLength(2); - expect(tokens.at(0).text()).toBe('production'); - expect(tokens.at(1).text()).toBe('staging'); - }); + await nextTick(); + const tokens = wrapper.findAll(GlToken); + expect(tokens).toHaveLength(2); + expect(tokens.at(0).text()).toBe('production'); + expect(tokens.at(1).text()).toBe('staging'); }); - it('should emit selected scopes', () => { + it('should emit selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); - return wrapper.vm.$nextTick().then(() => { - expect(last(wrapper.emitted('change'))).toEqual([ - { - name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, - parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, - scopes: [ - { environmentScope: '*', shouldBeDestroyed: true }, - { environmentScope: 'production' }, - ], - }, - ]); - }); + await nextTick(); + expect(last(wrapper.emitted('change'))).toEqual([ + { + name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, + parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, + scopes: [ + { environmentScope: '*', shouldBeDestroyed: true }, + { environmentScope: 'production' }, + ], + }, + ]); }); it('should emit a delete if the delete button is clicked', () => { @@ -236,39 +231,36 @@ describe('Feature flags strategy', () => { factory({ propsData, provide }); }); - it('should display selected scopes', () => { + it('should display selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.findAll(GlToken)).toHaveLength(1); - expect(wrapper.find(GlToken).text()).toBe('production'); - }); + await nextTick(); + expect(wrapper.findAll(GlToken)).toHaveLength(1); + expect(wrapper.find(GlToken).text()).toBe('production'); }); - it('should display all selected scopes', () => { + it('should display all selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); dropdown.vm.$emit('add', 'staging'); - return wrapper.vm.$nextTick().then(() => { - const tokens = wrapper.findAll(GlToken); - expect(tokens).toHaveLength(2); - expect(tokens.at(0).text()).toBe('production'); - expect(tokens.at(1).text()).toBe('staging'); - }); + await nextTick(); + const tokens = wrapper.findAll(GlToken); + expect(tokens).toHaveLength(2); + expect(tokens.at(0).text()).toBe('production'); + expect(tokens.at(1).text()).toBe('staging'); }); - it('should emit selected scopes', () => { + it('should emit selected scopes', async () => { const dropdown = wrapper.find(NewEnvironmentsDropdown); dropdown.vm.$emit('add', 'production'); - return wrapper.vm.$nextTick().then(() => { - expect(last(wrapper.emitted('change'))).toEqual([ - { - name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, - parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, - scopes: [{ environmentScope: 'production' }], - }, - ]); - }); + await nextTick(); + expect(last(wrapper.emitted('change'))).toEqual([ + { + name: ROLLOUT_STRATEGY_PERCENT_ROLLOUT, + parameters: { percentage: '50', groupId: PERCENT_ROLLOUT_GROUP_ID }, + scopes: [{ environmentScope: 'production' }], + }, + ]); }); }); }); |