-
Notifications
You must be signed in to change notification settings - Fork 168
Description
Describe the bug
Associating a <label for="..."> with a <button id="..."> that has a different role such as checkbox will give an "Ensures buttons have discernible text" error.
This is expected for a button with the standard button role, but if a <button> element is used with a different role it should be allowed? The w3.org page is not entirely clear about the proper behavior here, but it seems to be a common pattern in third-party component libraries to use a <button> element for e.g. checkboxes (see Radix-UI as an example), and Firefox and Chrome accessibility inspectors show the associated label in these cases.
CodePen repro example
Use this code: <label for="switch">test<label><button id="switch" role="switch"></button>, or check the Radix-UI checkbox page.
Expected behavior
This should be allowed if the role is set to e.g. checkbox or switch.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status