IBMa / equal-access

IBM Equal Access Accessibility Checker contains tools to automate accessibility checking from a browser or in a continuous development/build environment
https://www.ibm.com/able/toolkit/tools#develop
Apache License 2.0
633 stars 82 forks source link

ARIA in HTML update for role allowances for button/input button elements #1304

Closed scottaohara closed 1 year ago

scottaohara commented 1 year ago

ARIA in HTML (https://github.com/w3c/html-aria/pull/446) is updating the role allowances for the button element, as well as input type=button, image, reset, submit. ARIA in HTML spec update preview.

This update serves two purposes:

  1. to add new role allowances to these elements - specifically treeitem, gridcell and slider. Each of these roles - if implemented correctly - can work just fine with the button element. Other potential accessibility gaps due to author implementation may be found via other existing automated or manual checks.
  2. The various input buttons were in misalignment with each other, as well as the button element. These input types now all have the same allowances as the button element. input type=reset, submit and image have been revised to allow all the same roles, but note that authors are NOT RECOMMENDED to use them. The reason for this is that the LOE of making a proper implementation of these roles, compared to using a button element or other element (like a div), is likely far greater than using these input types due to the limitations of their styling and content models, in comparison.

The full list of allowed roles for these elements now would be: checkbox, combobox, gridcell, link, menuitem, menuitemcheckbox, menuitemradio, option, radio, slider, switch, tab, or treeitem. (button is also allowed, but NOT RECOMMENDED.)

The expectation here would be that all the allowed roles would no longer be exposed as errors or warnings. For the input types (image, reset, submit) where roles are allowed but NOT RECOMMENDED, a warning message indicating that a more malleable HTML element, such as a <button> or <div> may be more appropriate to ease the development of the custom feature.

Test cases - button and input type=button tests and input type=reset, image, submit tests

aliunwala commented 1 year ago

Triage: We will backlog this for implementation and discussion.

ErickRenteria commented 1 year ago

Validated