# 178: Percy rileva i cambiamenti visivi in ​​qualsiasi flusso di lavoro - Trucchi CSS

Anonim

Volevo assicurarmi che tu capissi esattamente cosa può fare Percy per te, da cui il titolo. Quando effettui una modifica al repository Git dei tuoi siti Web, come in un flusso di lavoro di richiesta pull in cui vive la maggior parte di noi, Percy ti farà sapere se tale modifica causa modifiche visive al tuo sito. Ti mostrerà esattamente quali sono queste modifiche: quali pagine, quale punto di interruzione della query multimediale, quale browser, ecc.

È piuttosto sorprendente.

Ecco uno screenshot della dashboard di Percy quando ho apportato una modifica aumentando la dimensione di un pulsante:

Si spera che intendessi quel cambiamento. Se non l'ho fatto, questo è il momento in cui Percy mi sta salvando il sedere. Posso facilmente apportare accidentalmente modifiche visive cambiando CSS che ha un impatto più ampio di quanto pensassi inizialmente.

Una volta che Percy è impostato, farà parte dei controlli della richiesta pull che avvengono automaticamente:

Mettere questo tipo di test nel tuo CI (integrazione continua) è il potente potente.

Percy ha tutti i tipi di potenti configurazioni, ma può anche essere abbastanza semplice. Percy! Vai a questo URL e fai uno screenshot di esso! Percy! Vai a questo URL, fai clic su questo pulsante, quindi fai uno screenshot di quello! Se hai familiarità con il linguaggio di automazione del browser incredibilmente semplice Puppeteer, questo è ciò che utilizza PercyScript.