Come fare al meglio i test di regressione visiva CSS cross-platform cross-browser? [chiuso]

A dicembre 2014, le migliori opzioni per i test di regressione CSS cross-browser sembrano essere:

• CrossBrowserTesting.com
  • Servizio cloud proprietario; Costa denaro
  • Sembra che possa fare per te la gestione della diff-it e dell'approvazione e il tracciamento norm / reference / baseline? In realtà non ho provato questo servizio.
• WebdriverCSS
  • Uno strumento basato sul selenio che offre un'interfaccia utente web per tracciare, esaminare e approvare le differenze
  • Sembra essere supportato da Sauce Labs alquanto
• Wraith-Selenium
  • Un fork di Wraith che aggiunge il supporto al selenio. L'originale Wraith è limitato a CasperJS (cioè solo Firefox / Gecko e WebKit).
  • Lato negativo: non sono sicuro che questo progetto sia sufficientemente consolidato per sopravvivere a lungo termine.
• Bloccato-dpxdt
  • Non supporta direttamente i test cross-browser, ma offre un'opzione "Diff My Images" per importare schermate prese da altri strumenti (ad esempio Selenium). (L'impostazione predefinita utilizza solo PhantomJS.)
  • Offre un'interfaccia utente web per tracciare, esaminare e approvare le differenze

Per i test cross-OS per le opzioni basate su Selenium, è necessario configurare il proprio cluster di macchine di prova o utilizzare un'opzione cloud for-pay come Sauce Labs, Browserstack e così via.
Attualmente Sauce Labs e Browserstack offrono account gratuiti per progetti open-source.

Puoi scrivere un piccolo script di shell (~ 5 linee) per avviare un browser e catturare la finestra con import di imagemagick. Lo uso per Firefox:

firefox -no-remote "$1" &
sleep 10
window_id=$(xwininfo -tree -root | grep Navigator | awk '{print $1}')
import -window $window_id "$1.png"
wmctrl -c Firefox

L'unica cosa insolita qui è usare wmctrl invece di kill per chiudere Firefox, quindi non andrà in modalità recupero la prossima volta che verrà eseguito. Dovrebbe essere abbastanza ovvio come puoi modificarlo per Chrome o altri browser (potresti dover giocare con xwininfo per capire come trovare la finestra principale del browser).

Puoi aggiungere una o due linee per confrontare la nuova immagine con quella precedente usando compare di imagemagick.

Sto interpretando questa domanda come chiedendo a come fare questo piuttosto che chiedere risorse fuori sito, dal momento che sarebbe fuori tema. Ci sono un certo numero di script che circolano sul web che fanno più o meno la stessa cosa.