Rôle enfant ARIA manquant

Silktide vérifie les widgets de conteneur construits avec des rôles ARIA, comme les barres d’onglets, les menus et les boîtes de liste, et s’assure que chacun contient le type d’éléments qu’il est censé accueillir. Une barre d’onglets sans onglets, ou un menu sans éléments de menu, est annoncée comme un widget mais n’offre rien à utiliser.

<!-- Problème : le rôle tablist doit contenir des éléments avec role="tab" -->
<div role="tablist">
  <button>Aperçu</button>
</div>

<!-- Correctif : donner aux éléments enfants leur rôle requis -->
<div role="tablist">
  <button role="tab">Aperçu</button>
</div>

Pourquoi c’est important

Les rôles composites décrivent un widget dans son ensemble : tablist promet des onglets, listbox promet des options, menu promet des éléments de menu. Les passent à une navigation spécialisée pour ces widgets, en s’attendant aux éléments enfants annoncés. Lorsque les enfants n’ont pas leurs rôles, le widget s’annonce puis se comporte comme une coquille vide - les utilisateurs peuvent l’atteindre mais ne trouvent rien à l’intérieur, tandis que les utilisateurs voyants voient un contrôle pleinement fonctionnel.

Comment corriger

Ajouter le rôle requis à chaque élément à l’intérieur du conteneur : par exemple, role="tab" sur chaque contrôle à l’intérieur d’un role="tablist".
Si les éléments doivent se trouver ailleurs dans le code, les relier avec aria-owns sur le conteneur.
Si le conteneur n’est pas réellement ce type de widget, supprimer ou corriger son rôle à la place.

Paires courantes : tablist a besoin de tab ; listbox a besoin de option ; menu et menubar ont besoin de menuitem (ou de ses variantes case à cocher et bouton radio) ; radiogroup a besoin de radio ; tree a besoin de treeitem ; grid et table ont besoin de row ; row a besoin de cellules ou d’en-têtes.

Comment Silktide procède

Trouver chaque élément dont le rôle ARIA exige des rôles enfants spécifiques.
Chercher parmi ses descendants, y compris tout élément adopté avec aria-owns, au moins un élément avec un rôle enfant requis.
Signaler les conteneurs où aucun n’est trouvé.

Dépannage

Les éléments sont chargés plus tard par un script

Silktide teste la page lors de son chargement. Si une boîte de liste ou un menu n’est rempli qu’à la demande, il est annoncé comme vide jusque-là; dans la mesure du possible, rendez au moins les éléments initiaux avec la page.

Cette vérification ne signale rien même si je m’attends à des résultats

Les tests ARIA peuvent être désactivés par site Web. Vérifiez les paramètres avancés du site Web.