diff options
Diffstat (limited to 'spec/frontend/registry/shared')
-rw-r--r-- | spec/frontend/registry/shared/components/__snapshots__/expiration_policy_fields_spec.js.snap | 2 | ||||
-rw-r--r-- | spec/frontend/registry/shared/components/expiration_policy_fields_spec.js | 69 |
2 files changed, 45 insertions, 26 deletions
diff --git a/spec/frontend/registry/shared/components/__snapshots__/expiration_policy_fields_spec.js.snap b/spec/frontend/registry/shared/components/__snapshots__/expiration_policy_fields_spec.js.snap index 9f30ed43093..882f1b3211a 100644 --- a/spec/frontend/registry/shared/components/__snapshots__/expiration_policy_fields_spec.js.snap +++ b/spec/frontend/registry/shared/components/__snapshots__/expiration_policy_fields_spec.js.snap @@ -114,7 +114,6 @@ exports[`Expiration Policy Form renders 1`] = ` <gl-form-group-stub id="expiration-policy-name-matching-group" - invalid-feedback="The value of this input should be less than 255 characters" label-align="right" label-cols="3" label-for="expiration-policy-name-matching" @@ -131,7 +130,6 @@ exports[`Expiration Policy Form renders 1`] = ` </gl-form-group-stub> <gl-form-group-stub id="expiration-policy-keep-name-group" - invalid-feedback="The value of this input should be less than 255 characters" label-align="right" label-cols="3" label-for="expiration-policy-keep-name" diff --git a/spec/frontend/registry/shared/components/expiration_policy_fields_spec.js b/spec/frontend/registry/shared/components/expiration_policy_fields_spec.js index d9889dc534c..ee765ffd1c0 100644 --- a/spec/frontend/registry/shared/components/expiration_policy_fields_spec.js +++ b/spec/frontend/registry/shared/components/expiration_policy_fields_spec.js @@ -94,7 +94,9 @@ describe('Expiration Policy Form', () => { : 'input'; element.vm.$emit(modelUpdateEvent, value); return wrapper.vm.$nextTick().then(() => { - expect(wrapper.emitted('input')).toEqual([[{ [modelName]: value }]]); + expect(wrapper.emitted('input')).toEqual([ + [{ newValue: { [modelName]: value }, modified: modelName }], + ]); }); }); @@ -126,42 +128,61 @@ describe('Expiration Policy Form', () => { }); describe.each` - modelName | elementName | stateVariable - ${'name_regex'} | ${'name-matching'} | ${'nameRegexState'} - ${'name_regex_keep'} | ${'keep-name'} | ${'nameKeepRegexState'} - `('regex textarea validation', ({ modelName, elementName, stateVariable }) => { - describe(`when name regex is longer than ${NAME_REGEX_LENGTH}`, () => { - const invalidString = new Array(NAME_REGEX_LENGTH + 2).join(','); - - beforeEach(() => { - mountComponent({ value: { [modelName]: invalidString } }); + modelName | elementName + ${'name_regex'} | ${'name-matching'} + ${'name_regex_keep'} | ${'keep-name'} + `('regex textarea validation', ({ modelName, elementName }) => { + const invalidString = new Array(NAME_REGEX_LENGTH + 2).join(','); + + describe('when apiError contains an error message', () => { + const errorMessage = 'something went wrong'; + + it('shows the error message on the relevant field', () => { + mountComponent({ apiErrors: { [modelName]: errorMessage } }); + expect(findFormGroup(elementName).attributes('invalid-feedback')).toBe(errorMessage); }); - it(`${stateVariable} is false`, () => { - expect(wrapper.vm.textAreaState[stateVariable]).toBe(false); - }); - - it('emit the @invalidated event', () => { - expect(wrapper.emitted('invalidated')).toBeTruthy(); + it('gives precedence to API errors compared to local ones', () => { + mountComponent({ + apiErrors: { [modelName]: errorMessage }, + value: { [modelName]: invalidString }, + }); + expect(findFormGroup(elementName).attributes('invalid-feedback')).toBe(errorMessage); }); }); - it('if the user did not type validation is null', () => { - mountComponent({ value: { [modelName]: '' } }); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.vm.textAreaState[stateVariable]).toBe(null); + describe('when apiErrors is empty', () => { + it('if the user did not type validation is null', async () => { + mountComponent({ value: { [modelName]: '' } }); + expect(findFormGroup(elementName).attributes('state')).toBeUndefined(); expect(wrapper.emitted('validated')).toBeTruthy(); }); - }); - it(`if the user typed and is less than ${NAME_REGEX_LENGTH} state is true`, () => { - mountComponent({ value: { [modelName]: 'foo' } }); - return wrapper.vm.$nextTick().then(() => { + it(`if the user typed and is less than ${NAME_REGEX_LENGTH} state is true`, () => { + mountComponent({ value: { [modelName]: 'foo' } }); + const formGroup = findFormGroup(elementName); const formElement = findFormElements(elementName, formGroup); expect(formGroup.attributes('state')).toBeTruthy(); expect(formElement.attributes('state')).toBeTruthy(); }); + + describe(`when name regex is longer than ${NAME_REGEX_LENGTH}`, () => { + beforeEach(() => { + mountComponent({ value: { [modelName]: invalidString } }); + }); + + it('textAreaValidation state is false', () => { + expect(findFormGroup(elementName).attributes('state')).toBeUndefined(); + // we are forced to check the model attribute because falsy attrs are all casted to undefined in attrs + // while in this case false shows an error and null instead shows nothing. + expect(wrapper.vm.textAreaValidation[modelName].state).toBe(false); + }); + + it('emit the @invalidated event', () => { + expect(wrapper.emitted('invalidated')).toBeTruthy(); + }); + }); }); }); |