Spring GDS 25 Aniversario
Una empresa de logística que envía a 190 países construyó algo para enviarse a sí misma.
Visual regression testing
¿Qué es el visual regression testing?
El visual regression testing detecta los cambios que un test funcional nunca ve. Toma una captura de una página o un componente, la guarda como referencia y compara cada build posterior contra esa imagen píxel a píxel. Cuando algo se mueve, se solapa o cambia de color, el diff lo señala. Un botón que sigue funcionando pero que ahora queda medio fuera de la pantalla pasa un test funcional y falla uno visual.
La razón de que exista: la mayoría de las roturas de UI son silenciosas. Un retoque de CSS pensado para un componente se filtra a otros tres. Un cambio de fuente desalinea un layout en móvil. La lógica sigue intacta, así que las pruebas unitarias y de testing end to end siguen en verde, y la regresión sale igualmente. Herramientas como Percy, Chromatic y la comparación de snapshots integrada en Playwright cubren ese hueco, renderizando la interfaz y mostrando qué cambió para que una persona lo apruebe o lo rechace.
La parte difícil es el ruido. El antialiasing, el contenido dinámico y las animaciones pueden disparar falsos diffs que entierran los reales, así que los equipos ajustan umbrales, enmascaran regiones volátiles y congelan temporizadores para mantener limpia la señal. Bien hecho, es como un design system con cientos de componentes se mantiene consistente en cada release sin que nadie revise cada pantalla a ojo.
Visual regression testing en Dallonses
Conectamos las comprobaciones visuales al mismo pipeline que todo lo demás. En un design system o un front end con muchos componentes, una pasada de snapshots en cada pull request detecta la filtración antes de que llegue a una página real, y el diff acaba delante de un revisor en vez de un cliente.
El trabajo está en el ajuste. Enmascaramos las regiones que cambian por razones legítimas, fijamos umbrales que señalan cambios reales sin dar la voz de alarma en falso, y mantenemos las referencias bajo revisión para que no deriven en silencio. Nuestro testing automatizado cubre el comportamiento, la regresión visual cubre la apariencia, y juntos hacen que un cambio de estilo seguro no se convierta en un ticket de soporte. Mantenemos la suite honesta retirando los snapshots que ya no se ganan su sitio.
¿Publicas cambios de UI y quieres saber que nada se rompe en pantalla? Vamos a montarlo.
Servicios relacionados
Trabajos relacionados
Vizitio
Convertir una marca en un negocio que funciona.
Access Ticket
Medio millón de personas. Una app. Cero caos.
¿Listo para trabajar juntos?
Reservar una reunión
