diff --git a/src/vaadin-combo-box-mixin.html b/src/vaadin-combo-box-mixin.html
index 5dbf1b9c..981e164b 100644
--- a/src/vaadin-combo-box-mixin.html
+++ b/src/vaadin-combo-box-mixin.html
@@ -774,7 +774,9 @@
_inputValueChanged(e) {
// Handle only input events from our inputElement.
if (e.composedPath().indexOf(this.inputElement) !== -1) {
- this._inputElementValue = this.inputElement[this._propertyForValue];
+ if (!e.__fromClearButton) {
+ this._inputElementValue = this.inputElement[this._propertyForValue];
+ }
this._filterFromInput(e);
}
}
diff --git a/src/vaadin-combo-box.html b/src/vaadin-combo-box.html
index 31efc419..8802556d 100644
--- a/src/vaadin-combo-box.html
+++ b/src/vaadin-combo-box.html
@@ -38,7 +38,7 @@
pattern="[[pattern]]"
prevent-invalid-input="[[preventInvalidInput]]"
- value="{{_inputElementValue}}"
+ value="[[_inputElementValue]]"
autocomplete="off"
invalid="[[invalid]]"
diff --git a/test/events.html b/test/events.html
index e2c1f8cd..05206ff2 100644
--- a/test/events.html
+++ b/test/events.html
@@ -83,13 +83,13 @@
it('should not fire the event when modifying input', async() => {
input.value = 'foobar';
- input.dispatchEvent(new CustomEvent('input'));
+ input.dispatchEvent(new CustomEvent('input', {bubbles: true, composed: true}));
expect(hasInputValueChangedSpy.called).to.be.false;
});
it('should fire the event once when removing input', async() => {
input.value = '';
- input.dispatchEvent(new CustomEvent('input'));
+ input.dispatchEvent(new CustomEvent('input', {bubbles: true, composed: true}));
expect(hasInputValueChangedSpy.calledOnce).to.be.true;
expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
});
@@ -104,7 +104,7 @@
describe('without user input', () => {
it('should fire the event once when entering input', async() => {
input.value = 'foo';
- input.dispatchEvent(new CustomEvent('input'));
+ input.dispatchEvent(new CustomEvent('input', {bubbles: true, composed: true}));
expect(hasInputValueChangedSpy.calledOnce).to.be.true;
expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
});
@@ -116,7 +116,7 @@
});
});
- describe('with value', () => {
+ describe('with custom value', () => {
beforeEach(async() => {
comboBox.clearButtonVisible = true;
clearButton = comboBox.inputElement.$.clearButton;
@@ -143,6 +143,30 @@
expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
});
});
+
+ describe('with dropdown value', () => {
+ beforeEach(async() => {
+ comboBox.items = ['foo', 'bar', 'baz', 'qux'];
+ comboBox.clearButtonVisible = true;
+ clearButton = comboBox.inputElement.$.clearButton;
+ // Open the combo-box
+ arrowDown(input);
+ // select the first option
+ arrowDown(input);
+ enter(input);
+ valueChangedSpy.reset();
+ hasInputValueChangedSpy.reset();
+ });
+
+ it('should be fired on clear button click', () => {
+ expect(input.value).to.equal('foo');
+ clearButton.click();
+ expect(input.value).to.be.empty;
+ expect(valueChangedSpy.calledOnce).to.be.true;
+ expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+ expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+ });
+ });
});
});
diff --git a/test/lazy-loading.html b/test/lazy-loading.html
index 3a62405c..9a2ea569 100644
--- a/test/lazy-loading.html
+++ b/test/lazy-loading.html
@@ -83,6 +83,7 @@
comboBox.inputElement.inputElement.value = value;
} else {
comboBox.inputElement.value = value;
+ comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
}
};
@@ -984,22 +985,6 @@
expect(comboBox.value).to.equal('other value');
});
- it('should keep previous value if allow-custom-value is set', () => {
- comboBox.allowCustomValue = true;
- comboBox.open();
- setInputValue('other value');
- comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
- comboBox.close();
- expect(comboBox.value).to.eql('other value');
-
- comboBox.focus();
- setInputValue('item 12');
- comboBox.filter = 'item 12';
-
- expect(comboBox.value).to.eql('other value');
- expect(comboBox.inputElement.value).to.eql('other value');
- });
-
});
describe('after empty data set loaded', () => {
diff --git a/test/using-object-values.html b/test/using-object-values.html
index 6adb8c27..f91e5514 100644
--- a/test/using-object-values.html
+++ b/test/using-object-values.html
@@ -335,6 +335,7 @@
combobox.readonly = true;
combobox.inputElement.value = 'not found';
+ combobox.inputElement.dispatchEvent(new CustomEvent('input'));
combobox.focus();
fire('focusout', combobox.inputElement);
diff --git a/test/vaadin-combo-box-light-events.html b/test/vaadin-combo-box-light-events.html
index 81e3c5ad..47581f10 100644
--- a/test/vaadin-combo-box-light-events.html
+++ b/test/vaadin-combo-box-light-events.html
@@ -118,7 +118,7 @@
});
});
- describe('with value', () => {
+ describe('with custom value', () => {
beforeEach(async() => {
comboBox.clearButtonVisible = true;
clearButton = comboBox.inputElement.$.clearButton;
@@ -145,6 +145,30 @@
expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
});
});
+
+ describe('with dropdown value', () => {
+ beforeEach(async() => {
+ comboBox.items = ['foo', 'bar', 'baz', 'qux'];
+ comboBox.clearButtonVisible = true;
+ clearButton = comboBox.inputElement.$.clearButton;
+ // Open the combo-box
+ arrowDown(input);
+ // select the first option
+ arrowDown(input);
+ enter(input);
+ valueChangedSpy.reset();
+ hasInputValueChangedSpy.reset();
+ });
+
+ it('should be fired on clear button click', () => {
+ expect(input.value).to.equal('foo');
+ clearButton.click();
+ expect(input.value).to.be.empty;
+ expect(valueChangedSpy.calledOnce).to.be.true;
+ expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+ expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+ });
+ });
});
});
diff --git a/test/vaadin-combo-box.html b/test/vaadin-combo-box.html
index 0d2f270d..3b8a289e 100644
--- a/test/vaadin-combo-box.html
+++ b/test/vaadin-combo-box.html
@@ -272,6 +272,7 @@
comboBox.open();
comboBox.inputElement.value = 'a';
+ comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
comboBox.$.overlay._selector.querySelector('vaadin-combo-box-item').click();
expect(spy).to.not.have.been.called;
});
@@ -282,6 +283,7 @@
comboBox.open();
comboBox.inputElement.value = 'a';
+ comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
comboBox.close();
comboBox.inputElement.blur();
expect(spy).to.not.have.been.called;
@@ -297,6 +299,7 @@
comboBox.open();
comboBox.inputElement.value = 'foo';
+ comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
comboBox.close();
expect(spy.called).to.be.false;
@@ -312,6 +315,7 @@
comboBox.open();
comboBox.inputElement.value = 'bar';
+ comboBox.inputElement.dispatchEvent(new CustomEvent('input'));
comboBox.close();
expect(spy.calledOnce).to.be.true;