Manglende overordnet ARIA-rolle

Silktide tjekker elementer, hvis ARIA-rolle kun giver mening i en bestemt type container, f.eks. en fane, der skal ligge i en faneliste, og kontrollerer, at den påkrævede container er til stede.

<!-- Problem: en fane uden en tablist omkring sig -->
<button role="tab">Oversigt</button>

<!-- Løsning: ombryd fanerne med deres påkrævede container -->
<div role="tablist">
  <button role="tab">Oversigt</button>
</div>

Hvorfor dette er vigtigt

Elementroller i defineres af deres kontekst: en tab er den tredje af fem faner, en option er ét valg i en liste, en row er en del af en tabel. afledes position, antal og navigationsadfærd fra den overordnede widget. Uden den kan elementet blive fejlidentificeret, annonceret uden nogen kontekst eller helt springes over – forfatteren har tilføjet halvdelen af en widget, og brugerne får ikke nogen af halvdelene pålideligt.

Sådan løser du det

Omslut elementet med en container med den påkrævede rolle – placer for eksempel elementer med role="tab" inde i en role="tablist".
Hvis den overordnede container ikke fysisk kan omslutte de underordnede elementer i koden, skal du tilføje aria-owns på den logiske overordnede container for at knytte dem til den.
Hvis elementet ikke reelt er den type element, skal du fjerne eller rette dets rolle.

Almindelige kombinationer: tab kræver tablist; option kræver listbox; menuitem kræver menu eller menubar; radio i en ARIA-gruppe kræver radiogroup; treeitem kræver tree; row kræver grid, table, treegrid eller rowgroup; celler og overskrifter kræver row.

Sådan tester Silktide dette

Find alle elementer, hvis ARIA-rolle kræver en bestemt overordnet rolle.
Gå op gennem deres overordnede elementer, og følg også eventuelle aria-owns-tilknytninger, for at finde et element med en påkrævet overordnet rolle.
Rapportér elementer, hvor der ikke findes et sådant overordnet element.

Fejlfinding

Den overordnede rolle er på et element med en implicit rolle

Native elementer tæller med: En <option> inde i en <select> behøver ingen udtrykkelige roller, fordi begge implicit har de rigtige roller. Fund vises, når en udtrykkelig elementrolle bruges uden en kvalificerende overordnet rolle, udtrykkelig eller implicit.

Dette tjek rapporterer ikke noget, selv om jeg forventer fund

ARIA-test kan slås fra for hver website. Tjek de avancerede indstillinger for websitet.