chore(inputs): update aria labels and description #782
Conversation
| .map(({ id }) => id!) | ||
| .join(' ') || undefined; | ||
|
|
||
| export const useAriaLabels = ({ |
There was a problem hiding this comment.
Le nom n'est pas bon, ca suggere un usage generalise, mais il n'est fait que pour etre utilise avec un control qui est dans un FieldContainer (ex: hint et invalid ids qui sont hardcode dedans).
There was a problem hiding this comment.
Ouais, je suis à la recherche d'une suggestion concrète mais à première vue, je pense qu'on devrait gérer les labels et les descriptions séparément.
Il pourrait y avoir une interface pour les props liés aux labels et une autre spécifique aux props destinées au FieldContainer.
| * Aria label for the input (used when no visual label is present) | ||
| */ | ||
| ariaLabel?: string; | ||
| interface ComboboxProps extends AriaLabelsProps { |
There was a problem hiding this comment.
AriaLabelsProps ajoute des props dans le components qu'on ne veut pas (ex: hasHint, inputId, isValid).
| @@ -259,6 +259,8 @@ input + .c2 { | |||
| aria-controls="uuid1_listbox" | |||
| aria-expanded="true" | |||
| aria-invalid="false" | |||
| aria-label="Select an option" | |||
| aria-labelledby="uuid1_label" | |||
There was a problem hiding this comment.
Ici c'est contradictoire, on peut pas avoir les 2 attributs en même temps
| if (label && !ariaLabel) { | ||
| processedAriaLabel = processedLabel; | ||
| } else if (ariaLabel && !label) { | ||
| processedLabel = processedAriaLabelledBy; |
There was a problem hiding this comment.
Pourquoi? C'est pourtant un cas valide d'avoir juste aria-label et que le label reste undefined. Genre on ne veut pas afficher de label et qu'on n'a pas de id pour le labelledBy, dans ce cas on lui fourni explicitement un aria-label.
| fieldId={id} | ||
| label={label} | ||
| fieldId={fieldId} | ||
| label={processedLabels.label} |
There was a problem hiding this comment.
Suite a l'autre commentaire, c'est un probleme que le hook fait en sorte que ariaLabel pourrait aboutir ici meme lorsque le prop label est undefined. Alors que le comportement expected du prop "label" c'est que si le dev ne met rien, c'est qu'il ne veut pas afficher de Label du tout.
DS-924
Description
Ici on vient mettre à jour le processus de définition des labels et descriptions pour les composantes d'inputs.
J'ai tenté de respecter le plus possible les contraintes dans le ticket.
Vraiment pas certain de celle-là!
Tests fonctionnels