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

Co-authored-by: Serhii Kulykov <[email protected]>
vaadin · Oct 3, 2024 · 52f6373 · 52f6373
1 parent 80dca0d
commit 52f6373
Show file tree

Hide file tree

Showing 2 changed files with 21 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
@@ -191,6 +191,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,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;
+    });
   });
 });