@vaadin/vaadin-combo-box 5.4.12 → 5.4.13

package/package.json

@@ -10,7 +10,7 @@
   "repository": "vaadin/vaadin-combo-box",
   "homepage": "https://vaadin.com/components",
   "name": "@vaadin/vaadin-combo-box",
-  "version": "5.4.12",
+  "version": "5.4.13",
   "main": "vaadin-combo-box.js",
   "author": "Vaadin Ltd",
   "license": "Apache-2.0",
@@ -45,10 +45,6 @@
     "@vaadin/vaadin-item": "^2.3.0",
     "@vaadin/vaadin-element-mixin": "^2.4.1"
   },
-  "scripts": {
-    "generate-typings": "gen-typescript-declarations --outDir . --verify",
-    "test": "wct --npm"
-  },
   "devDependencies": {
     "@web-padawan/gen-typescript-declarations": "^1.6.2",
     "web-component-tester": "6.9.2",
@@ -60,5 +56,9 @@
     "wct-browser-legacy": "^1.0.1",
     "@vaadin/vaadin-demo-helpers": "^3.1.0",
     "@vaadin/vaadin-dialog": "^2.5.0"
+  },
+  "scripts": {
+    "generate-typings": "gen-typescript-declarations --outDir . --verify",
+    "test": "wct --npm"
   }
 }

package/src/vaadin-combo-box-light.d.ts

@@ -85,6 +85,11 @@ declare class ComboBoxLightElement extends
   ready(): void;
   connectedCallback(): void;
   disconnectedCallback(): void;
+
+  /**
+   * Returns true if the current input value satisfies all constraints (if any).
+   */
+  checkValidity(): boolean;
 }
 
 declare global {

package/src/vaadin-combo-box-light.js

@@ -132,6 +132,17 @@ class ComboBoxLightElement extends
     return this.getRootNode().activeElement === this.inputElement;
   }
 
+  /**
+   * Returns true if the current input value satisfies all constraints (if any).
+   * @return {boolean}
+   */
+  checkValidity() {
+    if (this.inputElement && this.inputElement.validate) {
+      return this.inputElement.validate();
+    }
+    return super.checkValidity();
+  }
+
   /** @protected */
   connectedCallback() {
     super.connectedCallback();

package/src/vaadin-combo-box-mixin.js

@@ -912,6 +912,7 @@ export const ComboBoxMixin = subclass => class VaadinComboBoxMixinElement extend
   /** @private */
   _detectAndDispatchChange() {
     if (this.value !== this._lastCommittedValue) {
+      this.validate();
       this.dispatchEvent(new CustomEvent('change', {bubbles: true}));
       this._lastCommittedValue = this.value;
     }
@@ -1076,6 +1077,7 @@ export const ComboBoxMixin = subclass => class VaadinComboBoxMixinElement extend
     }
     if (!this.readonly && !this._closeOnBlurIsPrevented) {
       this._closeOrCommit();
+      this.validate();
     }
   }
 
@@ -1105,8 +1107,8 @@ export const ComboBoxMixin = subclass => class VaadinComboBoxMixinElement extend
    * @return {boolean | undefined}
    */
   checkValidity() {
-    if (this.inputElement.validate) {
-      return this.inputElement.validate();
+    if (this.inputElement.checkValidity) {
+      return this.inputElement.checkValidity();
     }
   }
 

package/src/vaadin-combo-box.js

@@ -229,7 +229,7 @@ class ComboBoxElement extends
   }
 
   static get version() {
-    return '5.4.12';
+    return '5.4.13';
   }
 
   static get properties() {
@@ -351,6 +351,13 @@ class ComboBoxElement extends
   ready() {
     super.ready();
 
+    // Disable the internal text-field's validation to prevent it from overriding
+    // the invalid state that was propagated to the text-field from the combo-box.
+    this.inputElement.validate = () => {};
+    // Restore the internal text-field's invalid state in case
+    // it got overridden before the validation was disabled above.
+    this.inputElement.invalid = this.invalid;
+
     this._nativeInput = this.inputElement.focusElement;
     this._toggleElement = this.$.toggleButton;
     this._clearElement = this.inputElement.shadowRoot.querySelector('[part="clear-button"]');