dialog-name-present
Les boîtes de dialogue ont un nom accessible
Vérifie que les dialogues (éléments avec role="dialog" ou role="alertdialog", et éléments <dialog> natifs) exposent un nom accessible non vide.
Applicabilité. S’applique aux éléments inclus dans l’arbre d’accessibilité dont le rôle est dialog ou alertdialog : un élément dont l’attribut role se résout en l’un de ces rôles (le premier jeton qui nomme un rôle ARIA concret l’emporte, donc role="alertdialog dialog" est un alertdialog), et un <dialog> natif dont l’attribut role est absent ou ne nomme aucun rôle concret (son rôle implicite est dialog). Un <dialog> fermé est masqué et donc hors périmètre. Un élément personnalisé auquel ses ElementInternals donnent l’un de ces rôles (this.attachInternals().role), sans attribut role qui en nomme un autre, compte comme un élément natif doté de ce rôle.
Attendu. L’élément a un nom accessible non vide issu d’aria-label, d’un aria-labelledby qui se résout en texte non vide, ou de title. Ces deux rôles tirent leur nom uniquement de l’auteur, donc le titre ou le texte du corps de la boîte de dialogue n’est pas accepté comme nom, sauf si aria-labelledby pointe vers lui.
Exemples
<div role="dialog" aria-label="Confirm deletion"><p>Are you sure?</p></div>
aria-label nomme la boîte de dialogue.
<div role="dialog"><p>Body text only.</p></div>
Aucun nom accessible ; le texte visible du corps ne compte pas dans le nom d’une boîte de dialogue.
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.
name_internals
- Inspectez la boîte de dialogue indiquée par le rapport, un élément personnalisé, et notez son rôle.
- Ouvrez le panneau Accessibilité des outils de développement du navigateur et lisez le nom accessible de l’élément.
- Avec un lecteur d’écran, placez-vous sur l’élément et écoutez le nom annoncé.
Réussite. L’arbre d’accessibilité montre un nom pour la boîte de dialogue, défini par ses internals ou autrement, et le lecteur d’écran l’annonce.
Échec. La boîte de dialogue n’a pas de nom dans l’arbre d’accessibilité et le lecteur d’écran n’annonce que son rôle, ce qui ne respecte pas le critère WCAG 4.1.2.