Conclusión
Los desarrolladores dedican el 21% de su tiempo a corregir errores. Depurar la apariencia de la interfaz de usuario puede resultar especialmente frustrante. Las reproducciones requieren que inicie diferentes navegadores, coloque su aplicación en el estado correcto y avance penosamente por el DOM. Lo que está en juego también es mayor; los errores no detectados cuestan 5-10x más tiempo para corregirlos en producción que en QA.
Es de sentido común que miles de equipos de frontend realicen pruebas visuales con Storybook. Storybook te ayuda a construir componentes y escribir pruebas visuales. La ejecución de pruebas a nivel de componente te permite identificar la causa raíz de un error. Tomar instantáneas te ayuda a detectar regresiones automáticamente. Eso significa que la gente puede enviar interfaces de usuario sin preocuparse por los errores polizones.
Esta guía te presentó los conceptos básicos de las pruebas visuales. Tom y yo esperamos que puedan aprovechar estos aprendizajes en sus propios proyectos. Únase a la lista de correo de Storybook para recibir notificaciones sobre más artículos y guías útiles como este.
Código de muestra para este tutorial
Si lo ha estado siguiendo, su repositorio y Storybook implementado deberían verse así:
Más recursos
¿Quieres sumergirte más profundo? A continuación, se incluyen algunos recursos útiles adicionales:
-
Documentación oficial de Storybook tiene documentación de API, ejemplos y la galería de complementos.
-
Cómo probar realmente las IU es un resumen de las estrategias prácticas de prueba de interfaz de usuario de Shopify, Adobe, Twilio y más.
-
Discord de Storybook te pone en contacto con la comunidad y los mantenedores de Storybook.
-
Blog de Storybook muestra las últimas versiones y funciones para optimizar el flujo de trabajo de desarrollo de la interfaz de usuario.