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().simulate('click')
dropdownMenuIsOpen()
@@ -1087,6 +1087,33 @@ describe('Dropdown', () => {
domEvent.keyDown(document, { key: 'Enter' })
dropdownMenuIsClosed()
})
+ it('closes the menu on SPACE key', () => {
+ wrapperMount().simulate('click')
+
+ dropdownMenuIsOpen()
+
+ // choose an item closes
+ domEvent.keyDown(document, { key: 'Spacebar' })
+ dropdownMenuIsClosed()
+ })
+ it('closes the Search menu on ENTER key', () => {
+ wrapperMount().simulate('click')
+
+ dropdownMenuIsOpen()
+
+ // choose an item closes
+ domEvent.keyDown(document, { key: 'Enter' })
+ dropdownMenuIsClosed()
+ })
+ it('does not close the Search menu on SPACE key', () => {
+ wrapperMount().simulate('click')
+
+ dropdownMenuIsOpen()
+
+ // choose an item closes
+ domEvent.keyDown(document, { key: 'Spacebar' })
+ dropdownMenuIsOpen()
+ })
it('keeps value of the searchQuery when selection is changed', () => {
wrapperMount()