diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-29 12:09:23 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-29 12:09:23 +0300 |
commit | 7fd2c757976e33cd231ef844cc0c40b8e8b2b998 (patch) | |
tree | 054fd89896a6b335756b1a032449d078ee0dccc3 /spec/frontend/feature_flags | |
parent | ccd969b8d516264f1d525d81d91388d25b6d4234 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/feature_flags')
-rw-r--r-- | spec/frontend/feature_flags/components/form_spec.js | 43 |
1 files changed, 24 insertions, 19 deletions
diff --git a/spec/frontend/feature_flags/components/form_spec.js b/spec/frontend/feature_flags/components/form_spec.js index 3a057aedde9..6c9ccba5181 100644 --- a/spec/frontend/feature_flags/components/form_spec.js +++ b/spec/frontend/feature_flags/components/form_spec.js @@ -1,6 +1,7 @@ import { uniqueId } from 'lodash'; import { shallowMount } from '@vue/test-utils'; -import { GlFormTextarea, GlFormCheckbox, GlButton } from '@gitlab/ui'; +import { GlFormTextarea, GlFormCheckbox, GlButton, GlToggle } from '@gitlab/ui'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import Api from '~/api'; import Form from '~/feature_flags/components/form.vue'; import EnvironmentsDropdown from '~/feature_flags/components/environments_dropdown.vue'; @@ -14,7 +15,6 @@ import { NEW_VERSION_FLAG, } from '~/feature_flags/constants'; import RelatedIssuesRoot from '~/related_issues/components/related_issues_root.vue'; -import ToggleButton from '~/vue_shared/components/toggle_button.vue'; import { featureFlag, userList, allUsersStrategy } from '../mock_data'; jest.mock('~/api.js'); @@ -35,14 +35,19 @@ describe('feature flag form', () => { }, }; + const findAddNewScopeRow = () => wrapper.findByTestId('add-new-scope'); + const findGlToggle = () => wrapper.find(GlToggle); + const factory = (props = {}, provide = {}) => { - wrapper = shallowMount(Form, { - propsData: { ...requiredProps, ...props }, - provide: { - ...requiredInjections, - ...provide, - }, - }); + wrapper = extendedWrapper( + shallowMount(Form, { + propsData: { ...requiredProps, ...props }, + provide: { + ...requiredInjections, + ...provide, + }, + }), + ); }; beforeEach(() => { @@ -102,13 +107,13 @@ describe('feature flag form', () => { }); it('should render scopes table with a new row ', () => { - expect(wrapper.find('.js-add-new-scope').exists()).toBe(true); + expect(findAddNewScopeRow().exists()).toBe(true); }); describe('status toggle', () => { describe('without filled text input', () => { it('should add a new scope with the text value empty and the status', () => { - wrapper.find(ToggleButton).vm.$emit('change', true); + findGlToggle().vm.$emit('change', true); expect(wrapper.vm.formScopes).toHaveLength(1); expect(wrapper.vm.formScopes[0].active).toEqual(true); @@ -121,7 +126,7 @@ describe('feature flag form', () => { it('should be disabled if the feature flag is not active', (done) => { wrapper.setProps({ active: false }); wrapper.vm.$nextTick(() => { - expect(wrapper.find(ToggleButton).props('disabledInput')).toBe(true); + expect(findGlToggle().props('disabled')).toBe(true); done(); }); }); @@ -166,11 +171,11 @@ describe('feature flag form', () => { describe('scopes', () => { it('should be possible to remove a scope', () => { - expect(wrapper.find('.js-feature-flag-delete').exists()).toEqual(true); + expect(wrapper.findByTestId('feature-flag-delete').exists()).toEqual(true); }); it('renders empty row to add a new scope', () => { - expect(wrapper.find('.js-add-new-scope').exists()).toEqual(true); + expect(findAddNewScopeRow().exists()).toEqual(true); }); it('renders the user id checkbox', () => { @@ -186,7 +191,7 @@ describe('feature flag form', () => { describe('update scope', () => { describe('on click on toggle', () => { it('should update the scope', () => { - wrapper.find(ToggleButton).vm.$emit('change', false); + findGlToggle().vm.$emit('change', false); expect(wrapper.vm.formScopes[0].active).toBe(false); }); @@ -195,7 +200,7 @@ describe('feature flag form', () => { wrapper.setProps({ active: false }); wrapper.vm.$nextTick(() => { - expect(wrapper.find(ToggleButton).props('disabledInput')).toBe(true); + expect(findGlToggle().props('disabled')).toBe(true); done(); }); }); @@ -294,7 +299,7 @@ describe('feature flag form', () => { const row = wrapper.findAll('.gl-responsive-table-row').at(2); expect(row.find(EnvironmentsDropdown).vm.disabled).toBe(true); - expect(row.find(ToggleButton).vm.disabledInput).toBe(true); + expect(row.find(GlToggle).props('disabled')).toBe(true); expect(row.find('.js-delete-scope').exists()).toBe(false); }); }); @@ -347,10 +352,10 @@ describe('feature flag form', () => { return wrapper.vm.$nextTick(); }) .then(() => { - wrapper.find('.js-add-new-scope').find(ToggleButton).vm.$emit('change', true); + findAddNewScopeRow().find(GlToggle).vm.$emit('change', true); }) .then(() => { - wrapper.find(ToggleButton).vm.$emit('change', true); + findGlToggle().vm.$emit('change', true); return wrapper.vm.$nextTick(); }) |