Ontbrekende aria-activedescendant-ID

Silktide controleert elk aria-activedescendant-attribuut op je pagina's en verifieert of de element-ID waarnaar het verwijst daadwerkelijk bestaat. Dit attribuut vertelt welk item in een widget, zoals een vervolgkeuzelijst, op dit moment is gemarkeerd.

<!-- Probleem: geen enkel element op de pagina heeft id="opt-2" -->
<ul role="listbox" aria-activedescendant="opt-2">
  <li role="option" id="opt-1">Eerste optie</li>
</ul>

Waarom dit belangrijk is

Widgets zoals aangepaste vervolgkeuzelijsten, combovakken en rasters houden de op de container en gebruiken het -attribuut aria-activedescendant om aan te geven welk item erin actief is. Als de verwijzing naar een ID wijst die niet bestaat, hoort een gebruiker van een niets wanneer die door de opties navigeert - de widget lijkt helemaal geen selectie te hebben, waardoor deze zonder zicht niet bruikbaar is.

Zo los je het op

Laat het attribuut verwijzen naar de id van het momenteel actieve item en werk dit bij wanneer de gebruiker door de widget navigeert.
Als de widget de items opnieuw rendert, zorg er dan voor dat de nieuwe items stabiele ID's behouden, of werk aria-activedescendant in dezelfde stap bij.
Verwijder het attribuut als de widget niet langer bestaat of de focus in plaats daarvan rechtstreeks beheert.

Zo test Silktide dit

Zoek elk element op de pagina met een aria-activedescendant- attribuut.
Controleer de ID waarnaar het verwijst aan de hand van de element-ID's die op de pagina aanwezig zijn.
Rapporteer elke verwijzing die met geen enkel element overeenkomt.

Problemen oplossen

Het doel wordt later door een script gemaakt

Silktide test de pagina terwijl deze wordt geladen. Als het element waarnaar wordt verwezen pas na interactie van de gebruiker bestaat, is de verwijzing in de tussentijd nog steeds ongeldig - stel aria-activedescendant pas in zodra het doel ervan bestaat.

Deze controle rapporteert niets, hoewel ik resultaten verwacht

ARIA-tests kunnen per website worden uitgeschakeld. Controleer de geavanceerde instellingen voor de website.