fix(Dropdown): update text when item selected with keyboard. (Semanti…

…c-Org#2161)
ayastreb · Oct 4, 2017 · 4ca4d94 · 4ca4d94
1 parent 9c97ed9
commit 4ca4d94
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 2 deletions.
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -603,7 +603,7 @@ export default class Dropdown extends Component {
 
   selectItemOnEnter = (e) => {
     debug('selectItemOnEnter()', keyboardKey.getName(e))
-    const { search } = this.props
+    const { multiple, search } = this.props
 
     if (keyboardKey.getCode(e) !== keyboardKey.Enter) return
     e.preventDefault()
@@ -617,7 +617,7 @@ export default class Dropdown extends Component {
     this.makeSelectedItemActive(e)
     this.closeOnChange(e)
 
-    if (isAdditionItem || optionSize === 1) this.clearSearchQuery()
+    if (!multiple || isAdditionItem || optionSize === 1) this.clearSearchQuery()
     if (search && this.searchRef) this.searchRef.focus()
   }
 

diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -947,6 +947,30 @@ describe('Dropdown', () => {
         .find('div.text')
         .should.contain.text(item.text())
     })
+    it('is updated on item enter if multiple search results present', () => {
+      const searchOptions = [
+        { value: 0, text: 'foo' },
+        { value: 1, text: 'foe' },
+      ]
+      wrapperMount(<Dropdown options={searchOptions} selection />)
+
+      // open and simulate search
+      wrapper
+        .simulate('click')
+        .setState({ searchQuery: 'fo' })
+
+      // arrow down
+      domEvent.keyDown(document, { key: 'ArrowDown' })
+      domEvent.keyDown(document, { key: 'Enter' })
+
+      const item = wrapper
+        .find('.selected')
+
+      // text updated
+      wrapper
+        .find('div.text')
+        .should.contain.text(item.text())
+    })
     it('displays if value is 0', () => {
       const text = faker.hacker.noun()