Spring GDS 25è Aniversari
Una empresa de logística que envia a 190 països va construir alguna cosa per enviar-se a si mateixa.
Visual regression testing
Què és el visual regression testing?
El visual regression testing detecta els canvis que un test funcional no veu mai. Pren una captura d'una pàgina o un component, la desa com a referència i compara cada build posterior contra aquesta imatge píxel a píxel. Quan alguna cosa es mou, se solapa o canvia de color, el diff ho assenyala. Un botó que continua funcionant però que ara queda mig fora de la pantalla passa un test funcional i en falla un de visual.
La raó que existeixi: la majoria de les ruptures d'UI són silencioses. Un retoc de CSS pensat per a un component es filtra a tres més. Un canvi de tipografia desalinea un layout al mòbil. La lògica continua intacta, així que les proves unitàries i de testing end to end continuen en verd, i la regressió surt igualment. Eines com Percy, Chromatic i la comparació de snapshots integrada a Playwright cobreixen aquest buit, renderitzant la interfície i mostrant què ha canviat perquè una persona ho aprovi o ho rebutgi.
La part difícil és el soroll. L'antialiasing, el contingut dinàmic i les animacions poden disparar falsos diffs que enterren els reals, així que els equips ajusten llindars, emmascaren regions volàtils i congelen temporitzadors per mantenir neta el senyal. Ben fet, és com un design system amb centenars de components es manté consistent a cada release sense que ningú revisi cada pantalla a ull.
Visual regression testing a Dallonses
Connectem les comprovacions visuals al mateix pipeline que tota la resta. En un design system o un front end amb molts components, una passada de snapshots a cada pull request detecta la filtració abans que arribi a una pàgina real, i el diff acaba davant d'un revisor en lloc d'un client.
La feina és en l'ajust. Emmascarem les regions que canvien per raons legítimes, fixem llindars que assenyalen canvis reals sense donar el crit d'alarma en fals, i mantenim les referències sota revisió perquè no derivin en silenci. El nostre testing automatitzat cobreix el comportament, la regressió visual cobreix l'aparença, i junts fan que un canvi d'estil segur no es converteixi en un tiquet de suport. Mantenim la suite honesta retirant els snapshots que ja no es guanyen el seu lloc.
Publiques canvis d'UI i vols saber que res es trenca en pantalla? Anem a muntar-ho.
Serveis relacionats
Treballs relacionats
Vizitio
Convertir una marca en un negoci que funciona.
Access Ticket
Mig milió de persones. Una app. Zero caos.
Preparat per a traballar junts?
Reserva una reunió
