https://w3c.github.io/webcomponents-cg/#cross-root-aria
GitHub Issue(s):
- Shadow root encapsulation currently prevents references between elements in different roots. Cross-root ARIA references would re-enable this platform feature within shadow roots.
- It's not possible to "reflect" ARIA attributes from am element in a shadow root up to the host of that shadow root. For instance, the DOM for a listbox fully encapsulated in a shadow root cannot be reflected into the parent DOM tree as would be needed for it to be referenced by the
aria-controlsattribute on an<input>element. Similarly, the list item descendent could not reflect its content for reference by anaria-activedescendentattribute on the same<input>element. These DOM elements are rightfully encapsulated within their shadow root, but a system of aria reflection could map their content (sans element reference) to their host, and the host could pass that content when referenced byaria-controlsoraria-activedescendent.
Content on the web being accessible is critically important. Making web component content accessible currently requires many complicated and only partially-successful workarounds, such as:
- Observing and moving ARIA-related attributes across elements (for role, etc.)
- Using non-standard attributes for ARIA features, in order to apply them to elements in a shadow root.
- Requiring that custom elements users wrap/slot elements so that ARIA attributes can be placed directly on them. This gets very complicated as the number of slotted inputs and levels of shadow root nesting increase.
- Duplicating nodes across shadow root boundaries
- Abandoning Shadow DOM