imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make Autocomplete more accessible to screen reader users

Browse source 
Use ARIA to:
 + notate that the composer has an autocomplete
 + notate the open/closed state of the autocomplete
 + notate the name of the open autocomplete options
 + notate the ID of the highlighted autocomplete option
 + improve naming of emoji autocomplete options for screen readers

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2019-09-30 14:04:39 +01:00
parent ca0130db02
commit f160a308b4
9 changed files with 63 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/autocomplete/Components.js
View file

@ -60,7 +60,7 @@ export class PillCompletion extends React.Component {
...restProps
} = this.props;
return (
<div className={classNames('mx_Autocomplete_Completion_pill', className)} {...restProps}>
<div className={classNames('mx_Autocomplete_Completion_pill', className)} role="option" {...restProps}>
{ initialComponent }
<span className="mx_Autocomplete_Completion_title">{ title }</span>
<span className="mx_Autocomplete_Completion_subtitle">{ subtitle }</span>