Éradiquer les régressions visuelles grâce à BackstopJS
- Atelier (1 h 30) :
Le sujet
Les régressions visuelles sont certainement l'une des choses les plus pénibles à éviter lorsque l'on intègre ou maintient un site : il est souvent difficile d'être sûr à 100% qu'une modification CSS n'a pas d'effet de bord indésirable sur une page ou un composant annexe, même en vérifiant visuellement sur les différentes résolutions cible.
Couplés à un styleguide, les outils de test de régressions visuelles sont d'une aide précieuse car ils permettent de déléguer cette tâche ingrate à un programme. Ce dernier génère automatiquement les captures d'écran et les compare entre elles pour voir si les modifications de code ont entraîné des changements visuels sur les différentes résolutions cible.
Durant cet atelier, je vous propose de découvrir et d'apprendre à utiliser BackstopJS, un outil de test open source qui fonctionne avec Chrome Headless, Phantom et Slimer. Facile à installer, à configurer et à prendre en main, il y a de fortes chances qu'il s'intègre parfaitement à votre chaîne de développement.
Présenté par
Corinne est une intégratrice qui jongle avec HTML, CSS, JavaScript et leurs petits copains depuis plus de 10 ans.
Toujours partante pour relever de nouveaux défis, elle est devenue Experte AccessiWeb et a publié « Intégration web - les bonnes pratiques » aux éditions Eyrolles.
Quand elle ne se plonge pas dans les specs pour monter en compétences, elle pratique le softball, passe de bons moments entre amis et essaye de terminer le panneau de dextérité de son fils avant qu'il n'atteigne sa majorité.