Implémenter correctement
Construis Reflet de chargement sans casser son comportement
# Implémenter Reflet de chargement dans ton agent ## Objectif Implémente Reflet de chargement pour ce comportement vérifié : Le shimmer ajoute un reflet mobile à un espace réservé pendant l’attente du contenu. Il ne donne ni pourcentage ni promesse sur le temps restant. ## Prérequis - Inspecte d’abord le dépôt, le design system et les tests existants. - Préserve les changements sans rapport et borne les fichiers modifiés. - Confirme que Reflet de chargement répond au besoin avant de coder. ## Comportement requis - Une région live annonce un nouvel état seulement si la mise à jour est importante et n’a pas déjà le focus. - L’activation au pointeur, avec Entrée ou Espace, exécute une action nommée une seule fois. ## États à couvrir - Prêt — État initial statique - En cours — L’effet facultatif est en cours - En pause — La lecture est figée - Résultat — Résultat persistant sans mouvement nécessaire ## Accessibilité - Rôle ARIA : button + select + checkbox + status - Le contrôle principal ou la région nommée pour Reflet de chargement possède un nom accessible stable issu d’un texte visible ou d’un libellé programmatique explicite ; le placeholder et l’infobulle ne servent pas de nom. - Le focus reste sur le contrôle activé. Recommencer rend le focus à son bouton. - Pause fige la lecture ; le repli statique l’annule. Quitter le spécimen annule son animation et retire les écouteurs. - Annonce les changements d’état par un texte concis, jamais les images de l’animation. Le visuel décoratif reste masqué aux technologies d’assistance. - Tab atteint chaque contrôle - Entrée ou Espace active les boutons ; les flèches changent le sélecteur natif ; Espace bascule la case du repli statique ## Quand ne pas utiliser - Évite le shimmer continu sur de grandes surfaces, les attentes longues sans récupération et les faux pourcentages. ## Critères d’acceptation - Le résultat reste lisible sans animation - Pause, réduction système et repli fonctionnent pendant la lecture - Le démontage annule effets et écouteurs - Seuls transform ou opacity changent ; le coût sur appareil reste non mesuré ## Garde-fous - Montre d’abord les changements envisagés avant toute action externe. - Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite. - Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu. ## Format de sortie - Résultat obtenu ou verdict. - Fichiers ou actions concernés. - Vérifications exécutées et preuves observables. - Blocages ou limites restantes.
- Web platform
- Prérequis · Accès au dépôt, au design system et aux tests
Pourquoi ça marche
- Le besoin est relié au comportement canonique avant toute décision technique.
- Les états, l’accessibilité et les non-objectifs empêchent une implémentation seulement visuelle.
- Les critères d’acceptation et le format de sortie rendent la vérification observable.
À essayer ensuite
Vérifie Reflet de chargement sur un parcours réel
# Vérifier Reflet de chargement après l’implémentation ## Objectif Audite l’implémentation de Reflet de chargement au regard de son comportement, de ses états et de ses exigences d’accessibilité sans la modifier automatiquement. ## Contrôles - Rejoue le plus petit parcours représentatif. - Contrôle le clavier, le focus, le nom accessible et les annonces. - Relie chaque écart à un critère d’acceptation précis. ## Garde-fous - Montre d’abord les changements envisagés avant toute action externe. - Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite. - Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu. ## Format de sortie - Résultat obtenu ou verdict. - Fichiers ou actions concernés. - Vérifications exécutées et preuves observables. - Blocages ou limites restantes.
sha256:ed483e4112412ad30d19c9773529f93d15781029d720efcc92f8a1a657c0e45d