Skip to content

Examples in ARIA Authoring Practices fail ARIA required owned elements rule #1985

@dd8

Description

@dd8

Some examples in ARIA Authoring Practices 1.2 fail the ARIA required owned elements rule

Which one is wrong? The ARIA Authoring Practices examples or the rule?

The tab examples - they have an h3 with implicit role=heading inside the tab, which isn't in the required owned elements list of tab:

The radiogroup example also contains an h3:

<div role="radiogroup" aria-labelledby="group_label_1" id="rg1">
  <h3 id="group_label_1">Pizza Crust</h3>

  <div role="radio" aria-checked="false" tabindex="0">
    Regular crust
  </div>

https://w3c.github.io/aria-practices/examples/radio/radio.html

The table example has a div#students_table_desc inside the tab which has implicit role=generic:

<div role="table" aria-label="Students" aria-describedby="students_table_desc">
  <div id="students_table_desc">Students currently enrolled in WAI-ARIA 101 for the coming semester</div>
  <div role="rowgroup">
    <div role="row">

https://w3c.github.io/aria-practices/#table

The menubar example has an explicit role=separator in the middle of the menu which isn't in the required owned elements list. This definitely looks like a problem with the rule - not representing the menu separator in the a11y tree is probably a failure of 1.3.1.

          <li role="separator"></li>
          <li role="none">
            <a role="menuitem" href="#course-explorer">Course Explorer</a>
          </li>

https://w3c.github.io/aria-practices/examples/menubar/menubar-navigation.html

And what about these - the caption element maps to role=caption but that isn't a required owned element of table or treegrid:

<table role='table'>
<caption>This is the table caption</caption>
</table>

<table role='treegrid'>
<caption>This is the treegrid caption</caption>
</table>

The problematic part of the rule is the expectation that only required owned roles appear - which means the rule fails optional owned elements like table captions, or menu separators (all menus have menu items, but not all menus have menu separators)

For example, the spec for menuitemcheckbox says:

Authors MAY separate menu items into sets by use of a separator or an element with an equivalent role from the native markup language

https://www.w3.org/TR/wai-aria-1.2/#menuitemcheckbox

Edit: the problems with headings and separator occur with the ARIA 1.1 examples as well:
https://www.w3.org/WAI/ARIA/apg/example-index/tabs/tabs-automatic.html#sc1_label
https://www.w3.org/WAI/ARIA/apg/example-index/radio/radio.html#sc1_label
https://www.w3.org/WAI/ARIA/apg/patterns/menu/#h-note-17

But other problems are new in ARIA 1.2 because of new roles like generic, caption and paragraph.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions