Skip to content

Switch to DSFR tooltips

Sylvain Boulade requested to merge dsfr-tooltip into main

Contexte

Afin de réaliser un audit d'accessibilité pour notre produit fiches, nous avons eu un certain nombre de retours de l'équipe accessibilité de l'incubateur.

L'une d'entre elle est que nos tooltips ne sont pas accessibles via la navigation au clavier (tab) https://gitlab.donnees.incubateur.anct.gouv.fr/infrastructure/indicateurs/-/issues/552

Basculer vers le composant tooltip du DSFR devrait résoudre le problème et par la même occasion améliorer notre compatibilité au DSFR (le composant Tooltip n'existait pas encore lorsque ce site avait été conçu à l'origine).

Au passage, cela devrait également résoudre le problème de hover sur mobile et rendre l'action associée aux dates plus explicite.

La contrepartie est que nous avons moins d'options de customisation visuelles pour le contenu de nos tooltips, si nous voulons rester compoatibles DSFR.

Contenu

  • On met à jour react-dsfr à la dernière version (pour avoir la dernière version du DSFR)
  • On bascule le composant Tooltip vers une version utilisant le tooltip DSFR
  • On crée un composant "CustomTooltip" nécessaire si on veut pouvoir garder la main sur le délai d'affichage du tooltip (notamment pour le bouton "copier l'email")
Edited by Sylvain Boulade

Merge request reports