|
| 1 | +--- |
| 2 | +id: gp1889 |
| 3 | +name: ARIA allowed child element of another element with presentational role |
| 4 | +rule_type: atomic |
| 5 | +description: | |
| 6 | + This rule checks that allowed child element of another element with presentational role does not cause presentational roles conflicts |
| 7 | +accessibility_requirements: |
| 8 | + aria12:conflict_resolution_presentation_none: |
| 9 | + title: ARIA 1.2, Presentational Roles Conflict Resolution |
| 10 | + forConformance: true |
| 11 | + failed: not satisfied |
| 12 | + passed: satisfied |
| 13 | + inapplicable: satisfied |
| 14 | + wcag20:1.3.1: # Info and Relationships (A) |
| 15 | + secondary: This success criterion is **related** to this rule. This is because ancestor elements assigned a presentational role with semantic allowed child elements may prevents assistive technologies to convey relationship details, potentially leading to WCAG violations. Some of the examples that either pass or fail overlap with this success criterion. |
| 16 | +input_aspects: |
| 17 | + - Accessibility Tree |
| 18 | + - CSS styling |
| 19 | + - DOM Tree |
| 20 | +acknowledgments: |
| 21 | + authors: |
| 22 | + - Giacomo Petri |
| 23 | +--- |
| 24 | + |
| 25 | +## Applicability |
| 26 | + |
| 27 | +This rule applies to any [HTML or SVG element][] that is [included in the accessibility tree][], is an [allowed child element](https://w3c.github.io/aria/#mustContain) of another element with an [explicit semantic role][] of `none` or `presentation`. |
| 28 | + |
| 29 | +## Expectation |
| 30 | + |
| 31 | +For each target element one of the following is true: |
| 32 | +- The element doesn't have any [explicit semantic role][]; |
| 33 | +- The element has an [explicit semantic role][] of `none` or `presentation`. |
| 34 | + |
| 35 | +## Assumptions |
| 36 | + |
| 37 | +There are no assumptions. |
| 38 | + |
| 39 | +## Accessibility Support |
| 40 | + |
| 41 | +There are no accessibility support issues known. |
| 42 | + |
| 43 | +## Background |
| 44 | + |
| 45 | +While user agents consistently handle elements undergoing [Presentational Roles Conflict Resolution][], authors bear the responsibility of preventing such conflicts. |
| 46 | + |
| 47 | +### Bibliography |
| 48 | + |
| 49 | +- [WAI-ARIA 1.2 - Presentational Roles Conflict Resolution][Presentational Roles Conflict Resolution] |
| 50 | + |
| 51 | +## Test Cases |
| 52 | + |
| 53 | +### Passed |
| 54 | + |
| 55 | +#### Passed Example 1 |
| 56 | + |
| 57 | +The `li` elements inherit the presentational role from their `ul` parent element with an [explicit semantic role][] of `none`. |
| 58 | + |
| 59 | +```html |
| 60 | +<ul role="none"> |
| 61 | + <li>WCAG</li> |
| 62 | + <li>ARIA</li> |
| 63 | + <li>ACT Rules</li> |
| 64 | +</ul> |
| 65 | +``` |
| 66 | + |
| 67 | +#### Passed Example 2 |
| 68 | + |
| 69 | +The `tr` and `td` elements inherit the presentational role from their `table` ancestor element with an [explicit semantic role][] of `presentation`. |
| 70 | + |
| 71 | +```html |
| 72 | +<table role='presentation'> |
| 73 | + <tbody> |
| 74 | + <tr> |
| 75 | + <td>ACT Rules</td> |
| 76 | + <td>WCAG</td> |
| 77 | + </tr> |
| 78 | + <tr> |
| 79 | + <td>ARIA</td> |
| 80 | + <td></td> |
| 81 | + </tr> |
| 82 | + </tbody> |
| 83 | +</table> |
| 84 | +``` |
| 85 | + |
| 86 | +#### Passed Example 3 |
| 87 | + |
| 88 | +The `li` elements inherit the presentational role from their `ul` parent element with an [explicit semantic role][] of `none`. The `li` have an [explicit semantic role][] of `none`. |
| 89 | + |
| 90 | +```html |
| 91 | +<ul role="none"> |
| 92 | + <li role="none">WCAG</li> |
| 93 | + <li role="none">ARIA</li> |
| 94 | + <li role="none">ACT Rules</li> |
| 95 | +</ul> |
| 96 | +``` |
| 97 | + |
| 98 | +### Failed |
| 99 | + |
| 100 | +#### Failed Example 1 |
| 101 | + |
| 102 | +The `li` elements inherit the presentational role from their `ul` parent element with an [explicit semantic role][] of `none`, but the author forced its [explicit semantic role][] with `listitem`. |
| 103 | + |
| 104 | +```html |
| 105 | +<ul role="none"> |
| 106 | + <li role="listitem">WCAG</li> |
| 107 | + <li role="listitem">ARIA</li> |
| 108 | + <li role="listitem">ACT Rules</li> |
| 109 | +</ul> |
| 110 | +``` |
| 111 | + |
| 112 | +#### Failed Example 2 |
| 113 | + |
| 114 | +The `td` elements inherit the presentational role from their `table` ancestor element with an [explicit semantic role][] of `presentation`, but the author forced its [explicit semantic role][] with `cell`. |
| 115 | + |
| 116 | +```html |
| 117 | +<table role='presentation'> |
| 118 | + <tbody> |
| 119 | + <tr> |
| 120 | + <td role="cell">ACT Rules</td> |
| 121 | + <td role="cell">WCAG</td> |
| 122 | + </tr> |
| 123 | + <tr> |
| 124 | + <td role="cell">ARIA</td> |
| 125 | + <td role="cell"></td> |
| 126 | + </tr> |
| 127 | + </tbody> |
| 128 | +</table> |
| 129 | +``` |
| 130 | + |
| 131 | +### Inapplicable |
| 132 | + |
| 133 | +#### Inapplicable Example 1 |
| 134 | + |
| 135 | +The `li` elements are no included in the accessibility tree. |
| 136 | + |
| 137 | +```html |
| 138 | +<ul role="none" style="display:none"> |
| 139 | + <li role="none">WCAG</li> |
| 140 | + <li role="none">ARIA</li> |
| 141 | + <li role="none">ACT Rules</li> |
| 142 | +</ul> |
| 143 | +``` |
| 144 | + |
| 145 | +#### Inapplicable Example 2 |
| 146 | + |
| 147 | +The `ul` element doesn't have a role of `none` or `presentation`. |
| 148 | + |
| 149 | +```html |
| 150 | +<ul> |
| 151 | + <li role="listitem">WCAG</li> |
| 152 | + <li role="listitem">ARIA</li> |
| 153 | + <li role="listitem">ACT Rules</li> |
| 154 | +</ul> |
| 155 | +``` |
| 156 | + |
| 157 | +#### Inapplicable Example 3 |
| 158 | + |
| 159 | +The `a` elements with a semantic role of `link` are not [allowed child element](https://w3c.github.io/aria/#mustContain) of the `ul` element. |
| 160 | + |
| 161 | +```html |
| 162 | +<ul role="presentation"> |
| 163 | + <a href="https://www.w3.org/TR/WCAG22/">WCAG</button> |
| 164 | + <a href="https://w3c.github.io/aria/">ARIA</button> |
| 165 | +</ul> |
| 166 | +``` |
| 167 | + |
| 168 | +[explicit semantic role]: #explicit-role 'Definition of Explicit Role' |
| 169 | +[inherited semantic role]: https://w3c.github.io/aria/#presentational-role-inheritance |
| 170 | +[included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of Included in the Accessibility Tree' |
| 171 | +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.2/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' |
| 172 | +[wai-aria 1.2]: https://www.w3.org/TR/wai-aria-1.2/ |
| 173 | +[html or svg element]: #namespaced-element |
0 commit comments