ARIA spec is not clear on use of the role attribute and global ARIA attributes on non-HTML elements

[Wildebrew]

The ARIA Spec needs to explicitly state whether global ARIA attributes are valid when used directly on custom elements

I am increasingly seeing design systems apply ARIA attributes directly to custom elements, e.g. Examples: An interactive button: <foo-button role="button" tabindex="0" aria-label="Delete"> </foo-button>

instead of: <foo-button a11yLabel="delete"> producing <button aria-label="delete"> </button>

A tablist container:

<foo-tabs role="tablist"> <button role="tab" aria-selected="true"></button> ...</foo-tabs">

A grouping element <foo-group role="group" aria-labelledby="gTitle"> <div id="gTitle"> .. group of form controls </foo-group>

My assumption has always been that you can only use ARIA attributes on valid markup language elements, but in my reading of the ARIA spec I do not explicitly speaking to this. Also I notice that the Axe Core rules do not flag this use as an ARIA validation fail.

A question and a change request:

The Question: Can ARIA only be used with valid markup language elements?

The change Request: Whether the anser is yay or nay, to add a section to the ARIA spec that speaks to this explicitly, to eliminate confusion. This could e.g. be added as a subsection of the global attributes section.