You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
To do more heavy lifting, ngAria should inject missing roles such as checkbox and range where it detects types. Currently, using type="checkbox" or type="range" on a <div> or <md-checkbox> does not inject a role, leaving the developer responsible for rounding out accessibility support.
For example:
<divtype="checkbox" ng-model="data">
Div masquerading as a checkbox
</div>
With ngAria included, this becomes:
<divtype="checkbox" ng-model="data" aria-checked="false" aria-invalid="false">
Div masquerading as a checkbox
</div>
ngAria should add role="checkbox" to any element that is not an <input> with a type of checkbox, and similarly for each type it checks. Many of the ARIA attributes added by ngAria are redundant on native inputs. Custom element directives and divs requiring roles to communicate purpose to assistive technologies stand to benefit much more from this module.
Note that tabindex, aria-label and keyboard operability are also required to make the above example accessible; this issue is focusing solely on roles.
To do more heavy lifting, ngAria should inject missing roles such as
checkbox
andrange
where it detects types. Currently, usingtype="checkbox"
ortype="range"
on a<div>
or<md-checkbox>
does not inject a role, leaving the developer responsible for rounding out accessibility support.For example:
With ngAria included, this becomes:
ngAria should add
role="checkbox"
to any element that is not an<input>
with a type ofcheckbox
, and similarly for each type it checks. Many of the ARIA attributes added by ngAria are redundant on native inputs. Custom element directives and divs requiring roles to communicate purpose to assistive technologies stand to benefit much more from this module.Note that
tabindex
,aria-label
and keyboard operability are also required to make the above example accessible; this issue is focusing solely on roles.See this Codepen for a live example.
Hat tip to @ewinslow for the suggestion in #9254.
The text was updated successfully, but these errors were encountered: