To test this, simply put focus on the input field and use arrows up and down )no string matching capability is coded intoo this yet, it is not necessary for testing the navigation to and through the list of suggested matches.
Implementation notes: As the user arrows through the list of options the focus stays on the input field,. Its value attribute is updated to match the option that is visually selected.
Knife
Fork
Spoon
Spork
Screen reader observations with Firefox.
This widget was written to test a problem recently encountered after a Firefox upgrade. Here are the observations:
If you add aria-owns="lb" to the input above (lb1 is the id of the listbox), both Jaws and NVDA with Firefox will read "outline level 2 bullet knife" (knife is the first choice). If you keep pressing arrow down the word "knife" is announced repeatedly, even if the actual selection has changed and the value of the input field is updated. You can test this by tabbing over to the "submit" button and activating it. It will tell you what the value is.
If you add role="combobox" in addition to aria-owns="lb1" to the input, the situation gets a little better but still odd. Both Jaws and NVDA now announce the values, but announce the word "bullet" before each (the listbox is based on a ul tag with ARIA roles added). Jaws will announce "outline level 2" before the first option.