fix(Dropdown): closing the search menu on spacebar press (#3766)

* Fix closing the search menu on spacebar press

* Update Dropdown.js

Author: honzajerabek

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())

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 />)