aria-allowed-attr
Les attributs aria-* doivent être autorisés pour le rôle de l’élément
Vérifie que chaque attribut aria-* reconnu présent sur un élément doté d’un rôle explicite est soit pris en charge globalement, soit pris en charge par ce rôle.
Applicabilité. S’applique aux éléments qui portent au moins un attribut aria-* reconnu et non global, évalué par rapport au rôle qu’ils ont réellement : un rôle explicite valide, à défaut le rôle implicite de leur balise, et à défaut rien du tout pour les éléments que HTML-AAM n’associe à aucun rôle. Un élément personnalisé sans attribut role nommant un rôle est évalué par rapport au rôle que lui donnent ses ElementInternals (this.attachInternals().role), son rôle par défaut, comme un élément natif l’est par rapport à celui de sa balise.
Attendu. Chaque attribut aria-* reconnu présent est : (a) soit pris en charge globalement sur n’importe quel élément (les états/propriétés ARIA « globaux », p. ex. aria-label/aria-hidden/aria-describedby), (b) soit explicitement listé comme état/propriété requis ou pris en charge pour le rôle de l’élément. Un attribut qu’ARIA déclare obsolète (plutôt qu’interdit) pour le rôle reste autorisé : il est signalé en cantTell, pour que l’auteur décide, et non en fail pour attribut non autorisé. Il en va de même pour un élément sans rôle : un attribut qu’ARIA 1.2 a cessé de rendre global (aria-disabled, aria-errormessage, aria-haspopup, aria-invalid) y est aussi signalé en cantTell.
Ce que rapporte un constat.
attr: l’attribut aria-* non autorisé, ou obsolète, sur l’élément.role(un élément doté d’un rôle) : le rôle d’après lequel il a été jugé, explicite ou implicite. Absent lorsque l’élément n’a aucun rôle.
Ces champs de data.details aident à lire et à reproduire un constat. À part reasonCode et les quelques champs que la page Schéma de sortie donne comme stables, ils ne constituent pas un contrat stable : un champ peut être renommé ou supprimé dans une version mineure, ne vous appuyez donc pas dessus.
Exemples
<div role="checkbox" aria-checked="true"></div>
aria-checked fait partie des états que role="checkbox" prend en charge.
<div role="checkbox" aria-valuenow="1"></div>
aria-valuenow appartient aux widgets de plage, pas à role="checkbox".
Comment vérifier
Quand cette règle ne peut pas trancher, elle renvoie cantTell et laisse la question à une personne. Chaque question qu’elle peut poser figure ici sous son code de raison, avec les étapes pour y répondre. Un constat porte les mêmes étapes dans howToCheck, dans la langue de l’analyse. Voir Schéma de sortie.
ARIA_ATTR_DEPRECATED
- Inspectez l’élément indiqué par le rapport et notez l’attribut aria-* obsolète ainsi que le rôle de l’élément.
- Ouvrez le panneau Accessibilité des outils de développement du navigateur et vérifiez si l’état porté par l’attribut apparaît toujours sur l’élément (par exemple disabled, invalid, has popup).
- Avec un lecteur d’écran, placez-vous sur l’élément et écoutez si cet état est annoncé.
- Cherchez une manière non obsolète de transmettre la même information (un attribut natif comme disabled, ou un rôle qui prend en charge l’attribut) et vérifiez si la page l’utilise déjà.
Réussite. L’état est annoncé, ou il est aussi transmis par un attribut natif ou un rôle pris en charge : rien ne dépend donc du seul attribut obsolète.
Échec. L’état n’est transmis que par l’attribut obsolète et le lecteur d’écran ne l’annonce pas : l’état de l’élément n’est donc pas exposé (WCAG 4.1.2).