Skip to content

Commit dec8f09

Browse files
CMTegnerwhichsteveyp
authored andcommitted
Remove typeahead (fixes reactjs#40, reactjs#111) (reactjs#152)
I initially started by trying to fix a regression to reactjs#80 which was introduced in 2fbafa, but after having evaluated the code I discovered that there's no easy way to both fix the regression and make the typeahead logic work again. This is sadly a side-effect of no longer keeping `value` in state, since we can no longer diff previous state and next state in the same fashion. Since the current typeahead situation is very poor on mobile, not to mention how broken it is in IE, I decided the best way forward is to temporarily remove the typeahead logic.
1 parent db87fea commit dec8f09

File tree

1 file changed

+3
-21
lines changed

1 file changed

+3
-21
lines changed

lib/Autocomplete.js

Lines changed: 3 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -103,18 +103,9 @@ let Autocomplete = React.createClass({
103103
if (this.keyDownHandlers[event.key])
104104
this.keyDownHandlers[event.key].call(this, event)
105105
else {
106-
const { selectionStart, value } = event.target
107-
if (value === this.props.value)
108-
// Nothing changed, no need to do anything. This also prevents
109-
// our workaround below from nuking user-made selections
110-
return
111106
this.setState({
112107
highlightedIndex: null,
113108
isOpen: true
114-
}, () => {
115-
// Restore caret position before autocompletion process
116-
// to work around a setSelectionRange bug in IE (#80)
117-
this.refs.input.selectionStart = selectionStart
118109
})
119110
}
120111
},
@@ -235,17 +226,8 @@ let Autocomplete = React.createClass({
235226
var itemValueDoesMatch = (itemValue.toLowerCase().indexOf(
236227
this.props.value.toLowerCase()
237228
) === 0)
238-
if (itemValueDoesMatch) {
239-
var node = this.refs.input
240-
var setSelection = () => {
241-
node.value = itemValue
242-
node.setSelectionRange(this.props.value.length, itemValue.length)
243-
}
244-
if (highlightedIndex === null)
245-
this.setState({ highlightedIndex: 0 }, setSelection)
246-
else
247-
setSelection()
248-
}
229+
if (itemValueDoesMatch && highlightedIndex === null)
230+
this.setState({ highlightedIndex: 0 })
249231
},
250232

251233
setMenuPositions () {
@@ -352,7 +334,7 @@ let Autocomplete = React.createClass({
352334
<input
353335
{...this.props.inputProps}
354336
role="combobox"
355-
aria-autocomplete="both"
337+
aria-autocomplete="list"
356338
autoComplete="off"
357339
ref="input"
358340
onFocus={this.handleInputFocus}

0 commit comments

Comments
 (0)