WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Examples of comboboxes supporting multiple selectedoptions

for

From: Bryan Garaventa
Date: Jan 30, 2018 6:43PM

Hi,
Actually you are encountering a bug in Safari
https://bugs.webkit.org/show_bug.cgi?id7680
This has been a bug in Safari for years, it would be nice if Apple would finally get around to fixing it. I remember first mentioning this to them back in 2012.

In regard to Chrome, Chrome is not a browser that is best supported in combination with mainstream screen readers, especially in regard to complex interactive ARIA widget constructs.

The following is an editable version of the same functionality, which is more applicable to your email analogy.
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm

The following steps were tested using JAWS2018 and NVDA in IE11, Firefox, and Chrome Canary, and aside from issues where NVDA is not announcing live regions properly nor the correct selected state in IE11, nor is JAWS announcing live regions properly in Chrome, all of them are functionally accessible regardless.

1. Open the test page above with JAWS or NVDA running in either IE11, Firefox, or Chrome Canary.

2. Set focus into the editable Combobox, and type "hu".

3. After the autopopulated list appears, press the Down arrow to enter the dropdown list, then press Up and Down to move within the filtered results and press the Spacebar to check the desired options.

4. Press Enter to save your selections, then type "sci" in the edit field to bring up a new list of search results.

5. Press Down to enter the dropdown and move up and down within the list and press the Spacebar to check your desired authors, then press the Tab key to save your selections and move to the next element in the tab order, which is the Clear button.

You can see your selections within a list below the buttons. When using JAWS in Chrome, it may be necessary to press Insert+Escape to refresh the virtual buffer because it is not updating properly when dynamic content changes occur at times, which is a JAWS bug.


Bryan Garaventa
Accessibility Fellow
Level Access, Inc.
<EMAIL REMOVED>
415.624.2709 (o)
www.LevelAccess.com