nested-interactive-controls-absent
Interaktive Bedienelemente dürfen nicht verschachtelt sein
Prüft, dass ein interaktives Bedienelement (Link, Button, Formularelement oder ARIA-Widget-Rolle) kein weiteres interaktives Bedienelement enthält.
Anwendbarkeit. Gilt für Elemente aus der Menge der interaktiven Bedienelemente (native a[href], button, input (nicht hidden), select, textarea; oder eine explizite ARIA-Widget-Rolle: button, link, checkbox, radio, switch, tab, textbox, combobox, listbox, menuitem, menuitemcheckbox, menuitemradio, option, slider, spinbutton, searchbox, treeitem, entnommen dem ersten Token des role-Attributs, das eine bekannte Rolle nennt, ohne Berücksichtigung der Groß-/Kleinschreibung abgeglichen, sodass role="foo button" und role="BUTTON" zählen und role="none button" nicht). Der Container ist unabhängig davon betroffen, ob er selbst fokussierbar ist; die Fokussierbarkeit entscheidet nur, ob ein Nachfahre ein interaktives Bedienelement verschachtelt. Ein Custom Element, dem seine ElementInternals eine dieser Widget-Rollen geben (this.attachInternals().role), ohne role-Attribut, das eine andere nennt, zählt wie ein natives Element mit dieser Rolle.
Erwartung. Das Element enthält als Nachfahren kein weiteres bedienbares interaktives Bedienelement (z. B. ein <button>, der ein <select> umschließt, oder ein Link, der eine Checkbox enthält). Verschachtelte interaktive Bedienelemente werden von assistiven Technologien nicht zuverlässig angekündigt oder bedienbar gemacht: Ob das äußere oder das innere Element aktiviert wird, ist mehrdeutig, und manche assistiven Technologien stellen nur eines der beiden bereit.
Was ein Befund meldet.
nestedElements: die in diesem Bedienelement verschachtelten Bedienelemente, ein Tag-Name pro Bedienelement.
Diese Felder in data.details helfen, einen Befund zu lesen und zu reproduzieren. Außer reasonCode und den wenigen Feldern, die Ausgabeschema als stabil nennt, sind sie kein stabiler Vertrag: Ein Feld kann in einer Minor-Version umbenannt werden oder wegfallen, bauen Sie also nicht darauf auf.
Beispiele
<button>Click me</button>
Kein verschachteltes interaktives Bedienelement.
<button><input type="checkbox"> Accept</button>
Ein <button> enthält ein verschachteltes <input type="checkbox">, ein weiteres fokussierbares Bedienelement.