diff options
Diffstat (limited to 'spec/frontend/pipeline_new')
-rw-r--r-- | spec/frontend/pipeline_new/components/pipeline_new_form_spec.js | 129 | ||||
-rw-r--r-- | spec/frontend/pipeline_new/utils/format_refs_spec.js | 2 |
2 files changed, 87 insertions, 44 deletions
diff --git a/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js b/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js index 421ad9f4939..51bb0ecee9c 100644 --- a/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js +++ b/spec/frontend/pipeline_new/components/pipeline_new_form_spec.js @@ -1,9 +1,10 @@ -import { mount, shallowMount } from '@vue/test-utils'; import { GlDropdown, GlDropdownItem, GlForm, GlSprintf, GlLoadingIcon } from '@gitlab/ui'; +import { mount, shallowMount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; import waitForPromises from 'helpers/wait_for_promises'; -import httpStatusCodes from '~/lib/utils/http_status'; import axios from '~/lib/utils/axios_utils'; +import httpStatusCodes from '~/lib/utils/http_status'; +import { redirectTo } from '~/lib/utils/url_utility'; import PipelineNewForm from '~/pipeline_new/components/pipeline_new_form.vue'; import { mockBranches, @@ -13,7 +14,6 @@ import { mockProjectId, mockError, } from '../mock_data'; -import { redirectTo } from '~/lib/utils/url_utility'; jest.mock('~/lib/utils/url_utility', () => ({ redirectTo: jest.fn(), @@ -34,6 +34,7 @@ describe('Pipeline New Form', () => { const findForm = () => wrapper.find(GlForm); const findDropdown = () => wrapper.find(GlDropdown); const findDropdownItems = () => wrapper.findAll(GlDropdownItem); + const findSubmitButton = () => wrapper.find('[data-testid="run_pipeline_button"]'); const findVariableRows = () => wrapper.findAll('[data-testid="ci-variable-row"]'); const findRemoveIcons = () => wrapper.findAll('[data-testid="remove-ci-variable-row"]'); const findKeyInputs = () => wrapper.findAll('[data-testid="pipeline-form-ci-variable-key"]'); @@ -155,6 +156,18 @@ describe('Pipeline New Form', () => { await waitForPromises(); }); + + it('disables the submit button immediately after submitting', async () => { + createComponent(); + + expect(findSubmitButton().props('disabled')).toBe(false); + + findForm().vm.$emit('submit', dummySubmitEvent); + await waitForPromises(); + + expect(findSubmitButton().props('disabled')).toBe(true); + }); + it('creates pipeline with full ref and variables', async () => { createComponent(); @@ -167,6 +180,7 @@ describe('Pipeline New Form', () => { expect(getExpectedPostParams().ref).toEqual(wrapper.vm.$data.refValue.fullName); expect(redirectTo).toHaveBeenCalledWith(`${pipelinesPath}/${postResponse.id}`); }); + it('creates a pipeline with short ref and variables', async () => { // query params are used createComponent('', mockParams); @@ -225,42 +239,47 @@ describe('Pipeline New Form', () => { }); }); - describe('when feature flag new_pipeline_form_prefilled_vars is enabled', () => { - let origGon; - + describe('when yml defines a variable', () => { const mockYmlKey = 'yml_var'; const mockYmlValue = 'yml_var_val'; + const mockYmlMultiLineValue = `A value + with multiple + lines`; const mockYmlDesc = 'A var from yml.'; - beforeAll(() => { - origGon = window.gon; - window.gon = { features: { newPipelineFormPrefilledVars: true } }; - }); + it('loading icon is shown when content is requested and hidden when received', async () => { + createComponent('', mockParams, mount); - afterAll(() => { - window.gon = origGon; - }); + mock.onGet(configVariablesPath).reply(httpStatusCodes.OK, { + [mockYmlKey]: { + value: mockYmlValue, + description: mockYmlDesc, + }, + }); - describe('loading state', () => { - it('loading icon is shown when content is requested and hidden when received', async () => { - createComponent('', mockParams, mount); + expect(findLoadingIcon().exists()).toBe(true); - mock.onGet(configVariablesPath).reply(httpStatusCodes.OK, { - [mockYmlKey]: { - value: mockYmlValue, - description: mockYmlDesc, - }, - }); + await waitForPromises(); - expect(findLoadingIcon().exists()).toBe(true); + expect(findLoadingIcon().exists()).toBe(false); + }); - await waitForPromises(); + it('multi-line strings are added to the value field without removing line breaks', async () => { + createComponent('', mockParams, mount); - expect(findLoadingIcon().exists()).toBe(false); + mock.onGet(configVariablesPath).reply(httpStatusCodes.OK, { + [mockYmlKey]: { + value: mockYmlMultiLineValue, + description: mockYmlDesc, + }, }); + + await waitForPromises(); + + expect(findValueInputs().at(0).element.value).toBe(mockYmlMultiLineValue); }); - describe('when yml defines a variable with description', () => { + describe('with description', () => { beforeEach(async () => { createComponent('', mockParams, mount); @@ -302,7 +321,7 @@ describe('Pipeline New Form', () => { }); }); - describe('when yml defines a variable without description', () => { + describe('without description', () => { beforeEach(async () => { createComponent('', mockParams, mount); @@ -325,31 +344,55 @@ describe('Pipeline New Form', () => { describe('Form errors and warnings', () => { beforeEach(() => { createComponent(); + }); - mock.onPost(pipelinesPath).reply(httpStatusCodes.BAD_REQUEST, mockError); + describe('when the error response can be handled', () => { + beforeEach(async () => { + mock.onPost(pipelinesPath).reply(httpStatusCodes.BAD_REQUEST, mockError); - findForm().vm.$emit('submit', dummySubmitEvent); + findForm().vm.$emit('submit', dummySubmitEvent); - return waitForPromises(); - }); + await waitForPromises(); + }); - it('shows both error and warning', () => { - expect(findErrorAlert().exists()).toBe(true); - expect(findWarningAlert().exists()).toBe(true); - }); + it('shows both error and warning', () => { + expect(findErrorAlert().exists()).toBe(true); + expect(findWarningAlert().exists()).toBe(true); + }); - it('shows the correct error', () => { - expect(findErrorAlert().text()).toBe(mockError.errors[0]); - }); + it('shows the correct error', () => { + expect(findErrorAlert().text()).toBe(mockError.errors[0]); + }); - it('shows the correct warning title', () => { - const { length } = mockError.warnings; + it('shows the correct warning title', () => { + const { length } = mockError.warnings; + + expect(findWarningAlertSummary().attributes('message')).toBe(`${length} warnings found:`); + }); - expect(findWarningAlertSummary().attributes('message')).toBe(`${length} warnings found:`); + it('shows the correct amount of warnings', () => { + expect(findWarnings()).toHaveLength(mockError.warnings.length); + }); + + it('re-enables the submit button', () => { + expect(findSubmitButton().props('disabled')).toBe(false); + }); }); - it('shows the correct amount of warnings', () => { - expect(findWarnings()).toHaveLength(mockError.warnings.length); + describe('when the error response cannot be handled', () => { + beforeEach(async () => { + mock + .onPost(pipelinesPath) + .reply(httpStatusCodes.INTERNAL_SERVER_ERROR, 'something went wrong'); + + findForm().vm.$emit('submit', dummySubmitEvent); + + await waitForPromises(); + }); + + it('re-enables the submit button', () => { + expect(findSubmitButton().props('disabled')).toBe(false); + }); }); }); }); diff --git a/spec/frontend/pipeline_new/utils/format_refs_spec.js b/spec/frontend/pipeline_new/utils/format_refs_spec.js index 1fda6a8af83..405a747c3ba 100644 --- a/spec/frontend/pipeline_new/utils/format_refs_spec.js +++ b/spec/frontend/pipeline_new/utils/format_refs_spec.js @@ -1,5 +1,5 @@ -import formatRefs from '~/pipeline_new/utils/format_refs'; import { BRANCH_REF_TYPE, TAG_REF_TYPE } from '~/pipeline_new/constants'; +import formatRefs from '~/pipeline_new/utils/format_refs'; import { mockBranchRefs, mockTagRefs } from '../mock_data'; describe('Format refs util', () => { |