diff options
Diffstat (limited to 'spec/frontend/integrations/edit')
| -rw-r--r-- | spec/frontend/integrations/edit/components/dynamic_field_spec.js | 229 | ||||
| -rw-r--r-- | spec/frontend/integrations/edit/components/jira_issues_fields_spec.js | 87 |
2 files changed, 189 insertions, 127 deletions
diff --git a/spec/frontend/integrations/edit/components/dynamic_field_spec.js b/spec/frontend/integrations/edit/components/dynamic_field_spec.js index da8a2f41c1b..bf044e388ea 100644 --- a/spec/frontend/integrations/edit/components/dynamic_field_spec.js +++ b/spec/frontend/integrations/edit/components/dynamic_field_spec.js @@ -35,136 +35,145 @@ describe('DynamicField', () => { const findGlFormTextarea = () => wrapper.findComponent(GlFormTextarea); describe('template', () => { - describe.each([ - [true, 'disabled', 'readonly'], - [false, undefined, undefined], - ])('dynamic field, when isInheriting = `%p`', (isInheriting, disabled, readonly) => { - describe('type is checkbox', () => { - beforeEach(() => { - createComponent( - { - type: 'checkbox', - }, - isInheriting, - ); - }); + describe.each` + isInheriting | disabled | readonly | checkboxLabel + ${true} | ${'disabled'} | ${'readonly'} | ${undefined} + ${false} | ${undefined} | ${undefined} | ${'Custom checkbox label'} + `( + 'dynamic field, when isInheriting = `%p`', + ({ isInheriting, disabled, readonly, checkboxLabel }) => { + describe('type is checkbox', () => { + beforeEach(() => { + createComponent( + { + type: 'checkbox', + checkboxLabel, + }, + isInheriting, + ); + }); - it(`renders GlFormCheckbox, which ${isInheriting ? 'is' : 'is not'} disabled`, () => { - expect(findGlFormCheckbox().exists()).toBe(true); - expect(findGlFormCheckbox().find('[type=checkbox]').attributes('disabled')).toBe( - disabled, - ); - }); + it(`renders GlFormCheckbox, which ${isInheriting ? 'is' : 'is not'} disabled`, () => { + expect(findGlFormCheckbox().exists()).toBe(true); + expect(findGlFormCheckbox().find('[type=checkbox]').attributes('disabled')).toBe( + disabled, + ); + }); - it('does not render other types of input', () => { - expect(findGlFormSelect().exists()).toBe(false); - expect(findGlFormTextarea().exists()).toBe(false); - expect(findGlFormInput().exists()).toBe(false); - }); - }); + it(`renders GlFormCheckbox with correct text content when checkboxLabel is ${checkboxLabel}`, () => { + expect(findGlFormCheckbox().text()).toBe(checkboxLabel ?? defaultProps.title); + }); - describe('type is select', () => { - beforeEach(() => { - createComponent( - { - type: 'select', - choices: [ - ['all', 'All details'], - ['standard', 'Standard'], - ], - }, - isInheriting, - ); + it('does not render other types of input', () => { + expect(findGlFormSelect().exists()).toBe(false); + expect(findGlFormTextarea().exists()).toBe(false); + expect(findGlFormInput().exists()).toBe(false); + }); }); - it(`renders GlFormSelect, which ${isInheriting ? 'is' : 'is not'} disabled`, () => { - expect(findGlFormSelect().exists()).toBe(true); - expect(findGlFormSelect().findAll('option')).toHaveLength(2); - expect(findGlFormSelect().find('select').attributes('disabled')).toBe(disabled); - }); + describe('type is select', () => { + beforeEach(() => { + createComponent( + { + type: 'select', + choices: [ + ['all', 'All details'], + ['standard', 'Standard'], + ], + }, + isInheriting, + ); + }); - it('does not render other types of input', () => { - expect(findGlFormCheckbox().exists()).toBe(false); - expect(findGlFormTextarea().exists()).toBe(false); - expect(findGlFormInput().exists()).toBe(false); - }); - }); + it(`renders GlFormSelect, which ${isInheriting ? 'is' : 'is not'} disabled`, () => { + expect(findGlFormSelect().exists()).toBe(true); + expect(findGlFormSelect().findAll('option')).toHaveLength(2); + expect(findGlFormSelect().find('select').attributes('disabled')).toBe(disabled); + }); - describe('type is textarea', () => { - beforeEach(() => { - createComponent( - { - type: 'textarea', - }, - isInheriting, - ); + it('does not render other types of input', () => { + expect(findGlFormCheckbox().exists()).toBe(false); + expect(findGlFormTextarea().exists()).toBe(false); + expect(findGlFormInput().exists()).toBe(false); + }); }); - it(`renders GlFormTextarea, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { - expect(findGlFormTextarea().exists()).toBe(true); - expect(findGlFormTextarea().find('textarea').attributes('readonly')).toBe(readonly); - }); + describe('type is textarea', () => { + beforeEach(() => { + createComponent( + { + type: 'textarea', + }, + isInheriting, + ); + }); - it('does not render other types of input', () => { - expect(findGlFormCheckbox().exists()).toBe(false); - expect(findGlFormSelect().exists()).toBe(false); - expect(findGlFormInput().exists()).toBe(false); - }); - }); + it(`renders GlFormTextarea, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { + expect(findGlFormTextarea().exists()).toBe(true); + expect(findGlFormTextarea().find('textarea').attributes('readonly')).toBe(readonly); + }); - describe('type is password', () => { - beforeEach(() => { - createComponent( - { - type: 'password', - }, - isInheriting, - ); + it('does not render other types of input', () => { + expect(findGlFormCheckbox().exists()).toBe(false); + expect(findGlFormSelect().exists()).toBe(false); + expect(findGlFormInput().exists()).toBe(false); + }); }); - it(`renders GlFormInput, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { - expect(findGlFormInput().exists()).toBe(true); - expect(findGlFormInput().attributes('type')).toBe('password'); - expect(findGlFormInput().attributes('readonly')).toBe(readonly); - }); + describe('type is password', () => { + beforeEach(() => { + createComponent( + { + type: 'password', + }, + isInheriting, + ); + }); - it('does not render other types of input', () => { - expect(findGlFormCheckbox().exists()).toBe(false); - expect(findGlFormSelect().exists()).toBe(false); - expect(findGlFormTextarea().exists()).toBe(false); - }); - }); + it(`renders GlFormInput, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { + expect(findGlFormInput().exists()).toBe(true); + expect(findGlFormInput().attributes('type')).toBe('password'); + expect(findGlFormInput().attributes('readonly')).toBe(readonly); + }); - describe('type is text', () => { - beforeEach(() => { - createComponent( - { - type: 'text', - required: true, - }, - isInheriting, - ); + it('does not render other types of input', () => { + expect(findGlFormCheckbox().exists()).toBe(false); + expect(findGlFormSelect().exists()).toBe(false); + expect(findGlFormTextarea().exists()).toBe(false); + }); }); - it(`renders GlFormInput, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { - expect(findGlFormInput().exists()).toBe(true); - expect(findGlFormInput().attributes()).toMatchObject({ - type: 'text', - id: 'service_project_url', - name: 'service[project_url]', - placeholder: defaultProps.placeholder, - required: 'required', + describe('type is text', () => { + beforeEach(() => { + createComponent( + { + type: 'text', + required: true, + }, + isInheriting, + ); }); - expect(findGlFormInput().attributes('readonly')).toBe(readonly); - }); - it('does not render other types of input', () => { - expect(findGlFormCheckbox().exists()).toBe(false); - expect(findGlFormSelect().exists()).toBe(false); - expect(findGlFormTextarea().exists()).toBe(false); + it(`renders GlFormInput, which ${isInheriting ? 'is' : 'is not'} readonly`, () => { + expect(findGlFormInput().exists()).toBe(true); + expect(findGlFormInput().attributes()).toMatchObject({ + type: 'text', + id: 'service_project_url', + name: 'service[project_url]', + placeholder: defaultProps.placeholder, + required: 'required', + }); + expect(findGlFormInput().attributes('readonly')).toBe(readonly); + }); + + it('does not render other types of input', () => { + expect(findGlFormCheckbox().exists()).toBe(false); + expect(findGlFormSelect().exists()).toBe(false); + expect(findGlFormTextarea().exists()).toBe(false); + }); }); - }); - }); + }, + ); describe('help text', () => { it('renders description with help text', () => { diff --git a/spec/frontend/integrations/edit/components/jira_issues_fields_spec.js b/spec/frontend/integrations/edit/components/jira_issues_fields_spec.js index 119afbfecfe..3a664b652ac 100644 --- a/spec/frontend/integrations/edit/components/jira_issues_fields_spec.js +++ b/spec/frontend/integrations/edit/components/jira_issues_fields_spec.js @@ -1,7 +1,10 @@ import { GlFormCheckbox, GlFormInput } from '@gitlab/ui'; -import { mountExtended } from 'helpers/vue_test_utils_helper'; +import { mountExtended, shallowMountExtended } from 'helpers/vue_test_utils_helper'; -import { GET_JIRA_ISSUE_TYPES_EVENT } from '~/integrations/constants'; +import { + GET_JIRA_ISSUE_TYPES_EVENT, + VALIDATE_INTEGRATION_FORM_EVENT, +} from '~/integrations/constants'; import JiraIssuesFields from '~/integrations/edit/components/jira_issues_fields.vue'; import eventHub from '~/integrations/edit/event_hub'; import { createStore } from '~/integrations/edit/store'; @@ -17,12 +20,17 @@ describe('JiraIssuesFields', () => { upgradePlanPath: 'https://gitlab.com', }; - const createComponent = ({ isInheriting = false, props, ...options } = {}) => { + const createComponent = ({ + isInheriting = false, + mountFn = mountExtended, + props, + ...options + } = {}) => { store = createStore({ defaultState: isInheriting ? {} : undefined, }); - wrapper = mountExtended(JiraIssuesFields, { + wrapper = mountFn(JiraIssuesFields, { propsData: { ...defaultProps, ...props }, store, stubs: ['jira-issue-creation-vulnerabilities'], @@ -38,12 +46,19 @@ describe('JiraIssuesFields', () => { const findEnableCheckboxDisabled = () => findEnableCheckbox().find('[type=checkbox]').attributes('disabled'); const findProjectKey = () => wrapper.findComponent(GlFormInput); + const findProjectKeyFormGroup = () => wrapper.findByTestId('project-key-form-group'); const findPremiumUpgradeCTA = () => wrapper.findByTestId('premium-upgrade-cta'); const findUltimateUpgradeCTA = () => wrapper.findByTestId('ultimate-upgrade-cta'); const findJiraForVulnerabilities = () => wrapper.findByTestId('jira-for-vulnerabilities'); + const findConflictWarning = () => wrapper.findByTestId('conflict-warning-text'); const setEnableCheckbox = async (isEnabled = true) => findEnableCheckbox().vm.$emit('input', isEnabled); + const assertProjectKeyState = (expectedStateValue) => { + expect(findProjectKey().attributes('state')).toBe(expectedStateValue); + expect(findProjectKeyFormGroup().attributes('state')).toBe(expectedStateValue); + }; + describe('template', () => { describe.each` showJiraIssuesIntegration | showJiraVulnerabilitiesIntegration @@ -151,19 +166,18 @@ describe('JiraIssuesFields', () => { }); describe('GitLab issues warning', () => { - const expectedText = 'Consider disabling GitLab issues'; - - it('contains warning when GitLab issues is enabled', () => { - createComponent(); - - expect(wrapper.text()).toContain(expectedText); - }); - - it('does not contain warning when GitLab issues is disabled', () => { - createComponent({ props: { gitlabIssuesEnabled: false } }); - - expect(wrapper.text()).not.toContain(expectedText); - }); + it.each` + gitlabIssuesEnabled | scenario + ${true} | ${'displays conflict warning'} + ${false} | ${'does not display conflict warning'} + `( + '$scenario when `gitlabIssuesEnabled` is `$gitlabIssuesEnabled`', + ({ gitlabIssuesEnabled }) => { + createComponent({ props: { gitlabIssuesEnabled } }); + + expect(findConflictWarning().exists()).toBe(gitlabIssuesEnabled); + }, + ); }); describe('Vulnerabilities creation', () => { @@ -211,5 +225,44 @@ describe('JiraIssuesFields', () => { expect(eventHubEmitSpy).toHaveBeenCalledWith(GET_JIRA_ISSUE_TYPES_EVENT); }); }); + + describe('Project key input field', () => { + beforeEach(() => { + createComponent({ + props: { + initialProjectKey: '', + initialEnableJiraIssues: true, + }, + mountFn: shallowMountExtended, + }); + }); + + it('sets Project Key `state` attribute to `true` by default', () => { + assertProjectKeyState('true'); + }); + + describe('when event hub recieves `VALIDATE_INTEGRATION_FORM_EVENT` event', () => { + describe('with no project key', () => { + it('sets Project Key `state` attribute to `undefined`', async () => { + eventHub.$emit(VALIDATE_INTEGRATION_FORM_EVENT); + await wrapper.vm.$nextTick(); + + assertProjectKeyState(undefined); + }); + }); + + describe('when project key is set', () => { + it('sets Project Key `state` attribute to `true`', async () => { + eventHub.$emit(VALIDATE_INTEGRATION_FORM_EVENT); + + // set the project key + await findProjectKey().vm.$emit('input', 'AB'); + await wrapper.vm.$nextTick(); + + assertProjectKeyState('true'); + }); + }); + }); + }); }); }); |