{this.state.showPassword ? (
) : (
diff --git a/react/components/InputSearch/index.js b/react/components/InputSearch/index.js
index 4f4571b94..fc6017210 100755
--- a/react/components/InputSearch/index.js
+++ b/react/components/InputSearch/index.js
@@ -48,10 +48,19 @@ class InputSearch extends Component {
...event.target,
value,
},
- preventDefault: event.preventDefault || (() => {}),
+ preventDefault: event.preventDefault || (() => null),
})
}
+ handleKeyPress = (event, handler) => {
+ const SPACE = ' '
+ const ENTER = 'Enter'
+ const { key } = event
+ if (key === SPACE || key === ENTER) {
+ handler(event)
+ }
+ }
+
handleHovering = hover => {
this.setState({ hover })
}
@@ -60,6 +69,8 @@ class InputSearch extends Component {
this.setState({ focus })
}
+ pressedEnter = event => event.key === 'Enter'
+
render() {
const { hover, focus } = this.state
const { size } = this.props
@@ -73,15 +84,17 @@ class InputSearch extends Component {
onBlur={() => this.handleFocus(false)}
onMouseEnter={() => this.handleHovering(true)}
onMouseLeave={() => this.handleHovering(false)}
- onKeyUp={e => e.key === 'Enter' && this.handleSubmit(e)}
+ onKeyUp={e => this.pressedEnter(e) && this.handleSubmit(e)}
type="search"
suffix={
{this.props.value && (
this.handleKeyPress(e, this.handleClickClear)}
+ role="button"
+ tabIndex={0}
>
@@ -96,7 +109,13 @@ class InputSearch extends Component {
InputSearch.separatorHeight.regular,
}}
/>
-
+ this.handleKeyPress(e, this.handleSubmit)}
+ role="button"
+ tabIndex={0}
+ >