Saknad ARIA-underordnad roll

Silktide kontrollerar behållarwidgetar som byggts med ARIA-roller, till exempel flikfält, menyer och listboxar, och verifierar att varje sådan widget innehåller den typ av objekt som den ska innehålla. Ett flikfält utan flikar eller en meny utan menyalternativ annonseras som en widget men erbjuder inget att använda.

<!-- Problem: en tablist måste innehålla element med role="tab" -->
<div role="tablist">
  <button>Översikt</button>
</div>

<!-- Åtgärd: ge de underordnade elementen den roll som krävs -->
<div role="tablist">
  <button role="tab">Översikt</button>
</div>

Varför detta är viktigt

Sammansatta -roller beskriver en widget som helhet: tablist utlovar flikar, listbox utlovar alternativ och menu utlovar menyalternativ. växlar till specialiserad navigering för dessa widgetar och förväntar sig de utlovade underordnade elementen. När de underordnade elementen saknar sina roller annonserar widgeten sig själv och fungerar sedan som ett tomt skal – användare kan nå den men hittar inget inuti, medan seende användare ser ett fullt fungerande reglage.

Så här åtgärdar du det

Lägg till den roll som krävs på varje objekt i behållaren – till exempel role="tab" på varje kontroll i en role="tablist".
Om objekten måste finnas någon annanstans i koden kopplar du dem till behållaren med aria-owns.
Om behållaren egentligen inte är den typen av widget tar du i stället bort eller korrigerar dess roll.

Vanliga kombinationer: tablist behöver tab; listbox behöver option; menu och menubar behöver menuitem (eller dess varianter för kryssrutor och alternativknappar); radiogroup behöver radio; tree behöver treeitem; grid och table behöver row; row behöver celler eller rubriker.

Så här testar Silktide detta

Hitta alla element vars ARIA-roll kräver specifika underordnade roller.
Sök bland dess underordnade element, inklusive element som lagts till med aria-owns, efter minst ett element med en obligatorisk underordnad roll.
Rapportera behållare där ingen sådan roll hittas.

Felsökning

Objekten läses in senare av ett skript

Silktide testar sidan medan den läses in. Om en listbox eller meny fylls i först vid behov annonseras den som tom fram till dess. Återge om möjligt åtminstone de ursprungliga objekten tillsammans med sidan.

Den här kontrollen rapporterar inget trots att jag förväntar mig resultat

ARIA-tester kan stängas av för varje webbplats. Kontrollera webbplatsens avancerade inställningar.