diff --git a/packages/custom-field/src/vaadin-custom-field-mixin.js b/packages/custom-field/src/vaadin-custom-field-mixin.js index cf2fb328a8..9effd936ee 100644 --- a/packages/custom-field/src/vaadin-custom-field-mixin.js +++ b/packages/custom-field/src/vaadin-custom-field-mixin.js @@ -190,6 +190,21 @@ export const CustomFieldMixin = (superClass) => return true; } + /** + * Override an observer from `FieldMixin` + * to validate when required is removed. + * + * @protected + * @override + */ + _requiredChanged(required) { + super._requiredChanged(required); + + if (required === false) { + this.validate(); + } + } + /** * @param {KeyboardEvent} e * @protected diff --git a/packages/custom-field/test/validation.test.js b/packages/custom-field/test/validation.test.js index 7d2f21bb7c..590e2d2914 100644 --- a/packages/custom-field/test/validation.test.js +++ b/packages/custom-field/test/validation.test.js @@ -97,5 +97,11 @@ describe('validation', () => { fire(customField.inputs[0], 'change'); expect(customField.invalid).to.be.true; }); + + it('should validate when setting required to false', () => { + const validateSpy = sinon.spy(customField, 'validate'); + customField.required = false; + expect(validateSpy).to.be.calledOnce; + }); }); });