fix: validate custom-field when required is set to false (#7923)

vaadin · Oct 3, 2024 · 87bc674 · 87bc674
1 parent 79e40ce
commit 87bc674
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 0 deletions.
diff --git 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
@@ -97,5 +97,12 @@ describe('validation', () => {
       fire(customField.inputs[0], 'change');
       expect(customField.invalid).to.be.true;
     });
+
+    it('should validate when setting required to false', async () => {
+      const validateSpy = sinon.spy(customField, 'validate');
+      customField.required = false;
+      await nextUpdate(customField);
+      expect(validateSpy).to.be.calledOnce;
+    });
   });
 });