fix: reset focusedIndex when value is reset (#2935)

vaadin · Nov 1, 2021 · fd35ad5 · fd35ad5
1 parent c76f6e2
commit fd35ad5
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 0 deletions.
diff --git a/packages/combo-box/src/vaadin-combo-box-mixin.js b/packages/combo-box/src/vaadin-combo-box-mixin.js
@@ -930,6 +930,14 @@ export const ComboBoxMixin = (subclass) =>
           this.opened || this.autoOpenDisabled
             ? this.$.dropdown.indexOfLabel(this.filter)
             : this._indexOfValue(this.value, this.filteredItems);
+
+        // see https://github.com/vaadin/web-components/issues/2615
+        if (this.selectedItem === null && this._focusedIndex >= 0) {
+          const filteredItem = this.filteredItems[this._focusedIndex];
+          if (this._getItemValue(filteredItem) === this.value) {
+            this._selectItemForValue(this.value);
+          }
+        }
       }
     }
 

diff --git a/packages/combo-box/test/filtering.test.js b/packages/combo-box/test/filtering.test.js
@@ -390,3 +390,27 @@ describe('filtered items attribute', () => {
     expect(comboBox._focusedIndex).to.eql(1);
   });
 });
+
+describe('value attribute', () => {
+  let comboBox, input;
+
+  beforeEach(() => {
+    comboBox = fixtureSync(`<vaadin-combo-box value="foo"></vaadin-combo-box>`);
+    input = comboBox.inputElement;
+  });
+
+  it('should be able to be set before filtered items', () => {
+    comboBox.filteredItems = ['foo', 'bar', 'baz'];
+    expect(comboBox.selectedItem).to.eql('foo');
+    expect(input.value).to.eql('foo');
+  });
+
+  // see https://github.com/vaadin/web-components/issues/2615
+  it('should not reset value after blur when set as html attribute', () => {
+    comboBox.filteredItems = ['foo'];
+    comboBox.value = '';
+    comboBox.focus();
+    comboBox.blur();
+    expect(comboBox.value).to.equal('');
+  });
+});