Proposed Test Rule: ARIA state or property has valid value
Applicability
This rule applies to any WAI-ARIA 1.1 state or property that is not empty (“”), and that is specified on an HTML or SVG element.
Expectation
Each test target has a valid value according to its WAI-ARIA 1.1 value type.
For value types ID Reference
and ID Reference List
for WAI-ARIA required properties at least one of the elements with the given ids exists in the same document tree or in the same shadow tree as the element that specifies the target attribute.
For value type URI
the value matches the generic URI syntax.
Assumptions
This rule catches values that are undefined in WAI-ARIA Specifications, and where the resulting behavior in user agents are also undefined in WAI-ARIA. This might lead to accessibility issues, if the intention was to use behavior defined in WAI-ARIA Specifications. When values are used that do not have a defined behavior in WAI-ARIA Specifications, the HTML/SVG specification decides what default values should be used, since it is defined here what should happen when an invalid value is used for an attribute. If the default value for invalid attribute values happens to match the author’s intention for the value, there will not be an accessibility issue.
Accessibility Support
Some user agents treat the value of aria-*
attribute as case-sensitive (even when these are not ID) while some treat them as case-insensitive.
Background
Only for WAI-ARIA required properties with value types ID Reference
and ID Reference List
is there a requirement that the elements with the given ids actually exists. For non-required properties, this is not a requirement. For example, the value of the aria-errormessage
attribute on an input
does not need to reference an id
that exists within the same document, because an HTML element with such and id
may be created in response to an event that may or may not happen.
For value type URI
, this rule does not require that the destination URI exists.
Related rules
Bibliography
- Understanding Success Criterion 4.1.2: Name, Role, Value
- ARIA5: Using WAI-ARIA state and property attributes to expose the state of a user interface component
- WAI-ARIA 1.1, Definitions of States and Properties
- WAI-ARIA 1.1, Characteristics of States and Properties, Value
- Uniform Resource Identifier (URI): Generic Syntax (RFC 3986)
Accessibility Requirements Mapping
ARIA 1.1, 6.3 Values for States and Properties
- Learn more about ARIA 1.1, 6.3 Values for States and Properties
- Required for conformance to WAI-ARIA 1.1 author requirements.
- Outcome mapping:
- Any
failed
outcomes: WAI-ARIA requirement is not satisfied - All
passed
outcomes: WAI-ARIA requirement is satisfied - An
inapplicable
outcome: WAI-ARIA requirement is satisfied
- Any
Input Aspects
The following aspects are required in using this rule.
Test Cases
Passed
Passed Example 1
aria-required
property with valid true/false value
<div role="textbox" aria-required="true" aria-label="A required textbox"></div>
Passed Example 2
aria-expanded
state with valid true/false/undefined value
<div role="button" aria-expanded="undefined">A button</div>
Passed Example 3
aria-pressed
state with valid tristate value
<div role="button" aria-pressed="mixed">An other button</div>
Passed Example 4
aria-errormessage
property with valid ID reference value
<div role="textbox" aria-errormessage="my-error" aria-label="A textbox"></div>
Passed Example 5
aria-owns
property with valid ID reference list value
<h1>Shopping list</h1>
<div role="list" aria-owns="item1 item2"></div>
<div id="item1">Apples</div>
<div id="item2">Bananas</div>
Passed Example 6
aria-rowindex
property with valid integer value
<div role="gridcell" aria-rowindex="2">Fred</div>
Passed Example 7
aria-valuemin
, aria-valuemax
and aria-valuenow
properties with valid number values
<div role="spinbutton" aria-valuemin="1.0" aria-valuemax="2.0" aria-valuenow="1.5" aria-label="Select a value"></div>
Passed Example 8
aria-placeholder
property with valid string value
<div role="textbox" aria-placeholder="MM-DD-YYYY" aria-label="Your birthdate">
MM-DD-YYYY
</div>
Passed Example 9
aria-dropeffect
property with valid token list value
<div role="dialog" aria-dropeffect="copy move"></div>
Passed Example 10
aria-controls
, which is a required property for the role scrollbar
, has ID Reference list
that references at least one element existing in the same document tree.
<div id="content1">Lorem ipsum...</div>
<div
role="scrollbar"
aria-controls="content1 content2"
aria-orientation="vertical"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="25"
></div>
Failed
Failed Example 1
aria-required
property with invalid true/false value
<div role="textbox" aria-required="undefined" aria-label="A required textbox"></div>
Failed Example 2
aria-expanded
state with invalid true/false/undefined value
<div role="button" aria-expanded="mixed">A button</div>
Failed Example 3
aria-pressed
state with invalid tristate value
<div role="button" aria-pressed="horizontal">An other button</div>
Failed Example 4
aria-errormessage
property with invalid ID reference value, since space is not allowed in a single ID
<div role="textbox" aria-errormessage="error1 error2" aria-label="A textbox with an error"></div>
Failed Example 5
aria-rowindex
property with invalid integer value
<div role="gridcell" aria-rowindex="2.5">Fred</div>
Failed Example 6
aria-valuemin
, aria-valuemax
and aria-valuenow
property with invalid number values
<div role="spinbutton" aria-valuemin="one" aria-valuemax="three" aria-valuenow="two" aria-label="Choose a value"></div>
Failed Example 7
aria-live
property with invalid token value
<div role="main" aria-live="nope"></div>
Failed Example 8
Element with invalid token list value
<div role="dialog" aria-dropeffect="invalid move"></div>
Failed Example 9
aria-expanded
state with invalid true/false/undefined value for custom element
<my-button role="button" aria-expanded="collapsed">My button</my-button>
Failed Example 10
aria-controls
, which is a required property for the role scrollbar
, references an element that does not exist in the same document tree.
<div
role="scrollbar"
aria-controls="content1"
aria-orientation="vertical"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="25"
></div>
Inapplicable
Inapplicable Example 1
Element does not have any ARIA states or properties
<div>Some Content</div>
Inapplicable Example 2
Element has ARIA role, but no ARIA states or properties
<div role="button">Some Content</div>
Inapplicable Example 3
aria-checked
state with empty value
Note: The HTML validator flags an aria-checked
attribute with an empty value as an issue. However WAI-ARIA 1.1 indicates aria-checked
has a default value of undefined
.
<div role="checkbox" aria-checked>Accept terms and conditions</div>
Inapplicable Example 4
aria-hidden
state on an element that is not an HTML or SVG element.
<math aria-hidden="true"></math>
Glossary
Namespaced Element
An element with a specific namespaceURI value from HTML namespaces. For example an “SVG element” is any element with the “SVG namespace”, which is http://www.w3.org/2000/svg
.
Namespaced elements are not limited to elements described in a specification. They also include custom elements. Elements such as a
and title
have a different namespace depending on where they are used. For example a title
in an HTML page usually has the HTML namespace. When used in an svg
element, a title
element has the SVG namespace instead.
Outcome
An outcome is a conclusion that comes from evaluating an ACT Rule on a test subject or one of its constituent test target. An outcome can be one of the three following types:
- Inapplicable: No part of the test subject matches the applicability
- Passed: A test target meets all expectations
- Failed: A test target does not meet all expectations
Note: A rule has one passed
or failed
outcome for every test target. When there are no test targets the rule has one inapplicable
outcome. This means that each test subject will have one or more outcomes.
Note: Implementations using the EARL10-Schema can express the outcome with the outcome property. In addition to passed
, failed
and inapplicable
, EARL 1.0 also defined an incomplete
outcome. While this cannot be the outcome of an ACT Rule when applied in its entirety, it often happens that rules are only partially evaluated. For example, when applicability was automated, but the expectations have to be evaluated manually. Such “interim” results can be expressed with the incomplete
outcome.
WAI-ARIA specifications
The WAI ARIA Specifications group both the WAI ARIA W3C Recommendation and ARIA modules, namely:
- Accessible Rich Internet Applications (WAI-ARIA) 1.1
- WAI-ARIA Graphics Module 1.0
- Digital Publishing WAI-ARIA Module 1.0
Note: depending on the type of content being evaluated, part of the specifications might be irrelevant and should be ignored.
Implementations
This section is not part of the official rule. It is populated dynamically and not accounted for in the change history or the last modified date.
Implementation | Consistency | Complete | Report |
---|---|---|---|
Alfa | Partially-consistent | Yes | View Report |
QualWeb | Consistent | Yes | View Report |
SortSite | Consistent | Yes | View Report |
Changelog
This is the first version of this ACT rule.