Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

ajoute un role ARIA à la div wrapper de modale du header #173

Merged
merged 2 commits into from
Jun 6, 2024

Conversation

adipasquale
Copy link
Collaborator

Tel quel, le DOM du composant footer ne passe pas la batterie de specs de la gem AXE core sans configuration particulière

Le problème vient de la div wrapper de la modale de menu qui utilise un aria-labelledby alors qu’elle n’a pas de role ARIA.
Cela semble être une faute et c’est remonté comme serious :

       1) aria-allowed-attr: Elements must only use allowed ARIA attributes (serious)
           https://dequeuniversity.com/rules/axe/4.3/aria-allowed-attr?application=axeAPI
           The following 1 node violate this rule:

               Selector: #modal-header-menu
               HTML: <div class="fr-header__menu fr-modal" id="modal-header-menu" aria-labelledby="button-header-menu" data-fr-js-modal="true" data-fr-js-header-modal="true">
               Fix all of the following:
               - ARIA attribute cannot be used, add a role attribute or use a different element: aria-labelledby

cf la règle un peu dure à lire https://dequeuniversity.com/rules/axe/4.3/aria-allowed-attr?application=axeAPI

J’en déduis que pour utiliser aria-labelledby il faut un role, ce qu je rajoute ici.
J’ai envisagé d’utiliser un <nav> plutôt qu’un rôle nav mais il y a déjà une nav nestée dans la modale donc je trouve ça un peu bizarre
J’ai aussi envisagé d’utiliser le rôle alertdialog mais ça ne semble pas correspondre à un menu de navigation.

@adipasquale adipasquale merged commit 077c53f into main Jun 6, 2024
8 checks passed
@adipasquale adipasquale deleted the aria/header-role branch June 6, 2024 14:35
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant