From a4b8757de8d0315cf66b6e39996af1ec11aa9f4f Mon Sep 17 00:00:00 2001
From: Honza Jerabek <jan.jerabek@praguetigers.cz>
Date: Mon, 2 Sep 2019 15:19:16 +0200
Subject: [PATCH] fix(Dropdown): closing the search menu on spacebar press
 (#3766)

* Fix closing the search menu on spacebar press

* Update Dropdown.js
---
 src/modules/Dropdown/Dropdown.js             | 11 ++++----
 test/specs/modules/Dropdown/Dropdown-test.js | 29 +++++++++++++++++++-
 2 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
index 36d2773de1..2a051705dd 100644
--- a/src/modules/Dropdown/Dropdown.js
+++ b/src/modules/Dropdown/Dropdown.js
@@ -581,11 +581,12 @@ export default class Dropdown extends Component {
     debug('selectItemOnEnter()', keyboardKey.getKey(e))
     const { search } = this.props
 
-    if (
-      keyboardKey.getCode(e) !== keyboardKey.Enter &&
-      keyboardKey.getCode(e) !== keyboardKey.Spacebar
-    )
-      return
+    const shouldSelect =
+      keyboardKey.getCode(e) === keyboardKey.Enter ||
+      // https://github.com/Semantic-Org/Semantic-UI-React/pull/3766
+      (!search && keyboardKey.getCode(e) === keyboardKey.Spacebar)
+
+    if (!shouldSelect) return
     e.preventDefault()
 
     const optionSize = _.size(this.getMenuOptions())
diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
index 828c76d3f0..58e4d4d2ea 100644
--- a/test/specs/modules/Dropdown/Dropdown-test.js
+++ b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -1078,7 +1078,7 @@ describe('Dropdown', () => {
         .at(1)
         .should.have.props({ selected: true, active: true })
     })
-    it('closes the menu', () => {
+    it('closes the menu on ENTER key', () => {
       wrapperMount(<Dropdown options={options} selection />).simulate('click')
 
       dropdownMenuIsOpen()
@@ -1087,6 +1087,33 @@ describe('Dropdown', () => {
       domEvent.keyDown(document, { key: 'Enter' })
       dropdownMenuIsClosed()
     })
+    it('closes the menu on SPACE key', () => {
+      wrapperMount(<Dropdown options={options} selection />).simulate('click')
+
+      dropdownMenuIsOpen()
+
+      // choose an item closes
+      domEvent.keyDown(document, { key: 'Spacebar' })
+      dropdownMenuIsClosed()
+    })
+    it('closes the Search menu on ENTER key', () => {
+      wrapperMount(<Dropdown options={options} selection search />).simulate('click')
+
+      dropdownMenuIsOpen()
+
+      // choose an item closes
+      domEvent.keyDown(document, { key: 'Enter' })
+      dropdownMenuIsClosed()
+    })
+    it('does not close the Search menu on SPACE key', () => {
+      wrapperMount(<Dropdown options={options} selection search />).simulate('click')
+
+      dropdownMenuIsOpen()
+
+      // choose an item closes
+      domEvent.keyDown(document, { key: 'Spacebar' })
+      dropdownMenuIsOpen()
+    })
     it('keeps value of the searchQuery when selection is changed', () => {
       wrapperMount(<Dropdown options={options} selection search />)