WCAG Rule 90: Required properties and states should be defined
Rule Mapping
- Status: Accepted
- Severity: Violation
- Priority: Priority 1
Details
- For each valid role, check that any required properties are not missing.
Markup References
- ARIA 1.0: [role="checkbox"]
- ARIA 1.0: [role="combobox"]
- ARIA 1.0: [role="complementary"]
- ARIA 1.0: [role="contentinfo"]
- ARIA 1.0: [role="menuitemcheckbox"]
- ARIA 1.0: [role="menuitemradio"]
- ARIA 1.0: [role="navigation"]
- ARIA 1.0: [role="radio"]
- ARIA 1.0: [role="radiogroup"]
- ARIA 1.0: [role="scrollbar"]
- ARIA 1.0: [role="search"]
- ARIA 1.0: [role="slider"]
- ARIA 1.0: [role="spinbutton"]
Validation Code
Dependencies
None
Context
.containsAriaAttr
Parameters
None
Code
function (ruleContext) {
var passed = true;
var attrNameArr = new Array();
var designPatterns = OpenAjax.a11y.aria.designPatterns;
var role = ruleContext.getAttribute("role");
// - a role value of null indicates no role attribute is present in (FF,Opera, Safari, Chrome).
// - '' value indicates the role is set to an empty string for all browsers except
// IE which also returns '' if no role attribute is present
// neither of these values allow for unsupported state to be tested
// Make sure the role value is consistent with IE as you don't want to push a null on the stack
if (role==null)
role='';
//If the role is valid and there are required properties make sure none are missing
if (role != '' && designPatterns[role] && designPatterns[role].reqProps != null) {
for(var i=0; i< designPatterns[role].reqProps.length; i++) {
if (!OpenAjax.a11y.xbrowser.hasAttribute(ruleContext, designPatterns[role].reqProps[i])) {
attrNameArr.push(designPatterns[role].reqProps[i]);
}
}
}
var retMsg = new Array();
retMsg.push (role);
retMsg.push (attrNameArr.toString());
var passed = attrNameArr.length == 0;
return new ValidationResult(passed, [ruleContext], attrNameArr, '', retMsg);
}
>