Accessibility Enhancements - Aria tags, Space/Enter keys #1428
Conversation
|
Is the only thing preventing this merge the test coverage? |
| @@ -866,12 +880,14 @@ const Select = React.createClass({ | |||
| aria-expanded={isOpen} | |||
| aria-owns={isOpen ? this._instancePrefix + '-list' : this._instancePrefix + '-value'} | |||
| aria-activedescendant={isOpen ? this._instancePrefix + '-option-' + focusedOptionIndex : this._instancePrefix + '-value'} | |||
| aria-labelledby={this.props['aria-labelledby']} | |||
There was a problem hiding this comment.
Nit: Looks like there is a space before the dash, please remove.
| @@ -866,12 +880,14 @@ const Select = React.createClass({ | |||
| aria-expanded={isOpen} | |||
| aria-owns={isOpen ? this._instancePrefix + '-list' : this._instancePrefix + '-value'} | |||
| aria-activedescendant={isOpen ? this._instancePrefix + '-option-' + focusedOptionIndex : this._instancePrefix + '-value'} | |||
| aria-labelledby={this.props['aria-labelledby']} | |||
| aria-label={this.props['aria-label']} | |||
| className={className} | ||
| tabIndex={this.props.tabIndex || 0} | ||
| onBlur={this.handleInputBlur} | ||
| onFocus={this.handleInputFocus} | ||
| ref={ref => this.input = ref} | ||
| aria-readonly={'' + !!this.props.disabled} | ||
| aria-disabled={'' + !!this.props.disabled} |
|
It would be great to get this merged! |
|
bump :) .. would be really nice to see those changes in the next version of react-select! |
fixed failing tests, resolved merge conflicts on #1428
|
Thanks for this @sushmabadam I've cleaned this up and merged it into master in the following PR #2092 |
| return; | ||
| } | ||
| event.stopPropagation(); | ||
| this.selectFocusedOption(); |
There was a problem hiding this comment.
Hey guys, sorry to drudge up an old PR discussion, but I'm noticing some quirky behavior since this code. Bisecting for bug #2156 led me to PR #2092 and therefore here.
It would seem this didn't intentionally cause the functionality I'm noticing on multiselect (selecting options on space or creating options on space for Creatable), so I'm trying to figure out how I might fix this bug while keeping the intentions of this change.
What use case are we trying to add here? As an example of a use case we don't want (I'm assuming) is if you're on the example page in the first example of states and click "United States," then start typing to New York, when you hit space after New it will select New Hampshire instead of continuing to filter down.
Tagging @gwyneplaine as the merger.
There was a problem hiding this comment.
Hey @buob thanks for catching this, the intention was to mimic native select behaviour, to enable selection of a focused option on SPACE. the behaviour you've identified is definitely an unintended side-effect.
Let me have a think about how to best solve for both these cases (it may very well be removing this behaviour when props.searchable is true). Happy to hear your thoughts on this as well
This PR contains the fixes for the issue #1399 Accessibility Enhancements - Aria tags, Space/Enter keys