-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
Description
Subject of the issue
The aria-required attribute is being added to radio buttons if they are required, when it is only allowed for a specific set of roles . This causes a "This element has an unsupported ARIA attribute" error in validators like Google's Developer Accessibility Tools.
Your environment
Jquery validate 1.15.0
Chrome 52.0.2743.116
Steps to reproduce
To reproduce, validate a form with a radio button with the required attribute.
https://jsfiddle.net/Steven_Lawton/dr98hqL5/13/
Expected behaviour
It is an acceptable use of the required attribute to put "required" on each radio button without a radiogroup above it. (https://www.w3.org/TR/html5/forms.html#the-required-attribute). However, it is not acceptable to use the aria-required attribute in this way (https://www.w3.org/TR/wai-aria/states_and_properties#aria-required). Instead, the aria-required attribute should be applied to a parent element with the radiogroup role. This also is true with tree items & their parent trees.
When an element that doesn't support aria-required is validated and has the required attribute, the aria-required attribute should not be added to it.
If a radiobutton or tree item element has the required attribute, and its parent has the corresponding radiogroup/tree aria-role attribute, then the parent could receive the "aria-required" attribute rather than the
Actual behaviour
When any element with the required attribute is validated, the aria-required attribute is added to it.
see line 170-175
if ( data.required ) { param = data.required; delete data.required; data = $.extend( { required: param }, data ); $( element ).attr( "aria-required", "true" ); }