A11y keyboard control AutoComplete nonstandard drop-down list filter #3373
Description
Bug, feature request, or proposal:
Bug: AutoComplete Drop-Down list does not display States as expected.
What is the expected behavior?
With focus in an empty text box, type any letter key. If any of the available choices begin with the letter typed, those choices are displayed in a drop down. If the letter typed does not match any of the available choices the drop-down list is not displayed and the focus remains in the text box, and the user is allowed to press up/down arrow keys in the list box. Until the user presses the arrow keys to highlight a particular choice, only the typed letters are displayed in the text box.
What is the current behavior?
Currently the screen reader user cannot see what is in the Edit box, and filtered list items with the typed text that appears anywhere in the item is displayed.
What are the steps to reproduce?
Use the keyboard with mouse disconnected and screen reader running.
What is the use-case or motivation for changing an existing behavior?
WCAG standard keyboard controls provide a consistent behaviour, and a consistent filter listing.
Which versions of Angular, Material, OS, browsers are affected?
Windows10 browsers and screen readers.
Is there anything else we should know?
Typing characters moves focus to any list item that has that letter in the State name. When focus is on "Alabama", pressing "n" moves focus to "Arizona" instead of "Nebraska". Pressing up/down arrow keys only shows those States that have that letter in the name, instead of those that start with that letter. Focus does not stay in the Edit box until an arrow key is pressed. Aria-alert could be used to announce the list item without moving the focus from the Edit box.