diff --git a/src/vaadin-combo-box-light.html b/src/vaadin-combo-box-light.html
index 713f2473..7b1bcb27 100644
--- a/src/vaadin-combo-box-light.html
+++ b/src/vaadin-combo-box-light.html
@@ -142,6 +142,17 @@
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();
diff --git a/src/vaadin-combo-box-mixin.html b/src/vaadin-combo-box-mixin.html
index 073f55c5..208a4501 100644
--- a/src/vaadin-combo-box-mixin.html
+++ b/src/vaadin-combo-box-mixin.html
@@ -916,6 +916,7 @@
/** @private */
_detectAndDispatchChange() {
if (this.value !== this._lastCommittedValue) {
+ this.validate();
this.dispatchEvent(new CustomEvent('change', {bubbles: true}));
this._lastCommittedValue = this.value;
}
@@ -1080,6 +1081,7 @@
}
if (!this.readonly && !this._closeOnBlurIsPrevented) {
this._closeOrCommit();
+ this.validate();
}
}
@@ -1109,8 +1111,8 @@
* @return {boolean | undefined}
*/
checkValidity() {
- if (this.inputElement.validate) {
- return this.inputElement.validate();
+ if (this.inputElement.checkValidity) {
+ return this.inputElement.checkValidity();
}
}
diff --git a/src/vaadin-combo-box.html b/src/vaadin-combo-box.html
index c522dbba..cb050f47 100644
--- a/src/vaadin-combo-box.html
+++ b/src/vaadin-combo-box.html
@@ -387,6 +387,13 @@
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"]');
diff --git a/test/.eslintrc.json b/test/.eslintrc.json
index 47e71e3e..34849ebf 100644
--- a/test/.eslintrc.json
+++ b/test/.eslintrc.json
@@ -1,4 +1,7 @@
{
+ "parserOptions": {
+ "ecmaVersion": 8
+ },
"rules": {
"no-unused-vars": 0
},
@@ -34,6 +37,7 @@
"_fixture": false,
"gemini": false,
"flush": false,
- "ShadyDOM": false
+ "ShadyDOM": false,
+ "nextRender": false
}
}
diff --git a/test/helpers.html b/test/helpers.html
new file mode 100644
index 00000000..a65a4e8a
--- /dev/null
+++ b/test/helpers.html
@@ -0,0 +1,14 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/test/test-suites.js b/test/test-suites.js
index ec165a9e..b7ad4f7d 100644
--- a/test/test-suites.js
+++ b/test/test-suites.js
@@ -17,7 +17,8 @@ window.VaadinComboBoxSuites = [
'item-renderer.html',
'item-template.html',
'vaadin-combo-box-dropdown.html',
- 'lazy-loading.html'
+ 'lazy-loading.html',
+ 'validation.html'
];
if (isPolymer2) {
diff --git a/test/vaadin-combo-box-light.html b/test/vaadin-combo-box-light.html
index 0c4c70a9..7657920d 100644
--- a/test/vaadin-combo-box-light.html
+++ b/test/vaadin-combo-box-light.html
@@ -309,33 +309,33 @@
it('should clear the selection when clicking on the clear button', () => {
comboBox.open();
-
+
fire('click', clearButton);
-
+
expect(comboBox.value).to.eql('');
expect(comboBox.$.overlay._selectedItem).to.be.null;
expect(comboBox.selectedItem).to.be.null;
});
-
+
it('should not close the dropdown after clearing a selection', () => {
comboBox.open();
-
+
fire('click', clearButton);
-
+
expect(comboBox.opened).to.eql(true);
});
-
+
it('should not open the dropdown after clearing a selection', () => {
fire('click', clearButton);
-
+
expect(comboBox.opened).to.eql(false);
});
-
+
it('should cancel click event to avoid input blur', () => {
comboBox.open();
-
+
const event = fire('click', clearButton);
-
+
expect(event.defaultPrevented).to.eql(true);
});
diff --git a/test/validation.html b/test/validation.html
new file mode 100644
index 00000000..c62a7e8c
--- /dev/null
+++ b/test/validation.html
@@ -0,0 +1,157 @@
+
+
+
+
+
+ vaadin-combo-box validation tests
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+