react-autosuggest
react-autosuggest copied to clipboard
Accessibility: The WAI-ARIA role(s) and/or attribute(s) combobox, aria-expanded are not valid for the element input.
Hello,
I am using the DAP (Dynamic Assessment Plugin), to find accessibility issues in the web application that I am developing. The application finds an accessibility violation linked to the auto-suggest component:

Related to this input element:

Possibly this is related to #283. I would appreciate any help in resolving this issue.
Could you include the link to the guidance?
Hi Misha,
Thank you for a reply. This is a guideline link that I come across about combo box pattern, though I am new to accessibility and not sure if this is appropriate to follow: https://www.w3.org/TR/wai-aria/roles#combobox
I re-run the test using aXe google plugin and this tool does not give me the same violation. Possibly Dynamic Assessment Plugin incorporates a new combo pattern described in Aria 1.1. This is article that talks about a change: https://www.levelaccess.com/differences-aria-1-0-1-1-changes-rolecombobox/
Sorry, I'm not an accessibility expert.
If anyone has a concrete suggestion how to make the Autosuggest more accessible, I'll happily accept a PR.
Yes, you may find accessibility validation issues for ARIA 1.0 comboboxes, such as "role combobox not allowed on input field" but this is based on 1.1 ARIA.
But here's the rub ... ARIA 1.1 combobox is not ready for prime time. Therefore, though this 1.1 combobox may technically validate, when we tested it with a suite of assistive technologies, this 1.1 combobox version was not accessible.
As mentioned in Bryan Garaventa's excellent article on the combobox conundrum, the ARIA 1.0 combobox pattern is NOT deprecated, and is therefore still valid, despite what a11y validators say.
Quoting Bryan regarding ARIA 1.0 Combobox:
"First, it’s important to understand that the ARIA 1.0 Combobox design pattern is not deprecated, nor will any of the following guidance stop working accessibly in the future. For this reason, the following statement was added to the 1.1 Combobox design pattern to guarantee this. 'The ARIA 1.0 specification describes a combobox pattern where a text input element has the combobox role and owns a listbox element. User agents, assistive technologies, and conformance checkers SHOULD continue to support the ARIA 1.0 pattern so that existing implementations of the ARIA 1.0 pattern remain functional.'"
Quoting Bryan regarding ARIA 1.1 Combobox:
"Now, and this is really important, don’t do any of this [ARIA 1.1 combobox pattern] for public usage right now because it will not work reliably or accessibly for assistive technology users! In addition to these new markup requirements not being supported in assistive technologies as yet, they are not supported properly in platform accessibility APIs yet either, making all of these features extremely unreliable and sometimes totally inaccessible at present when implemented."
Here is Bryan Garaventa's article that I quoted above: https://www.levelaccess.com/differences-aria-1-0-1-1-changes-rolecombobox/
Here is the W3C's ARIA 1.0 combobox spec and pattern: https://www.w3.org/TR/wai-aria-1.0/roles#combobox
cc: @mra11yx, @accdc, @mraccess77
Hi, the ARIA Combobox guidance in the blog references above are still valid, and the Combobox 1.1 design pattern is still not supported widely enough for use within public usage software for these reasons.
In fact, within the ARIA Authoring Practices Guide 1.1 Read Me First section, it states the following: "Testing assistive technology interoperability is essential before using code from this guide in production. Because the purpose of this guide is to illustrate appropriate use of ARIA 1.1 as defined in the ARIA specification, the design patterns, reference examples, and sample code intentionally do not describe and implement coding techniques for working around problems caused by gaps in support for ARIA 1.1 in browsers and assistive technologies. It is thus advisable to test implementations thoroughly with each browser and assistive technology combination that is relevant within a target audience."
Validators should not be throwing errors for the valid usage of the only Combobox pattern that is actually accessible for use within web technologies. This only deepens the misunderstandings of ARIA that exist by all developers around the world.
@jnurthen @mcking65
@moroshko We are currently working on creating a PR for an updated accessible version of your autocomplete. It may take a little while but when we're done we will submit it here.
Is there any update on this @haltersweb or @moroshko ?