Vérification visuelle par capture d'écran
Après toute modification touchant l'interface (nouvelle page, changement de mise en page, ajustement de composant), je génère une capture d'écran automatisée du rendu réel avec Playwright, plutôt que de me fier à la seule lecture du code. C'est ce qui permet de repérer un décalage visuel, une image manquante ou un espacement cassé avant qu'il n'atteigne un visiteur du site.
Commande
playwright: page.goto(url) puis page.screenshot(path=..., full_page=True)Déclencheur
Après toute modification touchant le rendu visuel d'une page.
Portes de feedback
- Build local ou déploiement preview du changement
- Capture d'écran Playwright de la page concernée, desktop et parfois mobile
- Contrôle visuel du rendu avant de considérer la tâche terminée
Conditions de sortie
- La capture confirme un rendu conforme, ou une nouvelle itération corrige l'écart constaté
Avantages
- Détecte des régressions visuelles qu'une simple lecture de code ne révèle pas (image cassée, superposition, contraste)
- Donne une preuve concrète du rendu final, utile pour la revue humaine d'un changement piloté par agent
Comment démarrer
- 1Installer Playwright et un script minimal de capture réutilisable
- 2Systématiser la capture après tout changement visuel, pas seulement pour les refontes importantes
- 3Comparer visuellement avant/après quand le changement modifie une page existante
Points de vigilance
- Ne remplace pas un test d'accessibilité ou de compatibilité multi-navigateur
- Une capture sur un seul viewport peut manquer un problème qui n'apparaît qu'à une autre taille d'écran
Questions fréquentes
Pourquoi ne pas se contenter d'un test automatisé de non-régression visuelle ?
Un tel test détecte un écart de pixels, pas s'il est acceptable ou non. Le contrôle visuel humain reste plus fiable pour juger si un changement de rendu est intentionnel ou problématique.
Loops similaires
À explorer aussi
Vérification croisée d'une source de veille
Un lien partagé pour publication (X, LinkedIn, article) n'est jamais relayé tel quel : ses chiffres sont recherchés indépendamment avant décision.
Revalidation avant publication programmée
Un article programmé pour une date future avec des faits volatils (prix, tarifs API) déclenche une tâche de revérification avant sa mise en ligne.
Vérification post-déploiement
Après un déploiement, interroge à intervalle régulier les endpoints de santé et de fumée jusqu'à ce que tous répondent correctement.