aria-controls in web components

[schrotie]

Hey folks!

I'm working on an ARIA tabs web component and stumbled over something ... I'm not sure this is an issue, but may well be.

Tabs components usually work like this: the author (client programmer) usually "just" provides the tab panel content and labels it using an attribute or something. The tab component renders the tablist automatically. If I do this following web component best practice, the tablist will be in shadow DOM while the tab panels are in light DOM. This may break the ID referencing scheme employed by aria-controls. aria-controls would contain IDs from the parent document(-fragment).

A solution may be to render the tablist in light DOM, too. This would work but exposes all the functional CSS to the parent document(fragment) which should be avoided.

Please advise
Thorsten

[jnurthen]

@schrotie you are correct that the only current solution is a light DOM. This issue is being addressed by AOM - you can find discussion of this particular issue at whatwg/html#3515 (comment)
Please follow the discussion there.