CSS Regression-Tool? [geschlossen]

Question

Ich suche nach einem visuellen Regressionstest-Tool für CSS Refactoring und sehen, ob oder nicht, es gibt ein unbeabsichtigte Kaskadierung Verhalten in einer Website.

Im Idealfall, das Werkzeug, das eine Website (auch vor Ort) und greifen Schnappschüsse von jeder Seite und speichert sie in einem einzigen Repository kriechen können.

Wenn zum zweiten Mal ausführen, wird es die Seiten zeigen, dass seit dem letzten Mal visuell unterschiedlich sind es ausgeführt wurde.

Noch besser:

1. , wenn es die overlapper XOR Ansicht der 2-Version der Seite zeigen.
2. vergleichen Sie die Ergebnisse von verschiedenen Browsern Rendering (fast wie eine automatisierte Microsoft Expression Web vergleichen Funktion).

Answer 1

Schauen Sie sich Lackmus .

Es wird Ihre Website crawlen und Screenshots nehmen hat verdammt in der Nähe von jedem Browser man sich wünschen kann.

Neben der Kernfunktionalität Lackmus auch ermöglicht es Ihnen, Fehler zu verfolgen, melden Sie sich an private Websites und Damit können Sie die Kompatibilität Berichte aus Ihren Tests veröffentlichen.

Answer 2

Mein aktueller Favorit ist WebDriverCSS in Kombination mit BrowserStack Automate API. Dieses Paar von Werkzeugen ermöglicht Multi-Plattform, Multi-Browser-Regressionstests für die sehr breite Palette von Geräten, dass BrowserStack unterstützt. Es erfordert das Schreiben von Code ist aber viel umfassender als jede Lösung gebunden Phantom oder Slimer.

Wenn Sie in Ordnung sind mit einem alten WebKit Ihres einziger Test UA ist, ist hier ein großes Zuschreibung auf CSS Regressionstests mit PhantomCSS . Ihr Grund Beispiel liefert genau das, was die ursprüngliche Frage gewünscht. Visual Diffs zwischen zwei Commits

Für ein einfacheres Werkzeug, das keine Codierung (nur YAML config) erfordert, verweise ich Menschen gegenüber Wraith häufiger als PhantomCSS. Geben Sie @ ericcraio Antwort eine Abstimmung, wenn Sie wie Wraith und wollen nicht Casper Code schreiben.

Answer 3

Ich weiß, diese Frage für eine Weile bekannt gegeben worden ist, aber ich wollte über ein neues CSS-Regression-Tool erwähnen genannt Wraith von bbc-news.

http://github.com/bbc-news/wraith

Es nutzt Tools wie PhantomJS und ImageMagick.

http://responsivenews.co.uk/post/56884056177/wraith

Answer 4

Schauen Sie sich Browser Shots . Dies ist ein kostenloser Service.

Es gibt einige Einschränkungen, wie viele Tests, die Sie jeden Tag als kostenlosen Benutzer ausgeführt werden können. Aber im Gegensatz zu Lackmus ; Sie Tests auf allen unterstützten Browsern laufen können -. Lackmus nur kostenlos ermöglicht es Benutzern, ihre Websites auf Internet Explorer 7 und Mozilla Firefox 2 zu testen

Answer 5

Ich bin ein CSS-Regression-Test-Tool zu entwickeln, die SUCCSS genannt wird, ist es ein npm global, Open-Source-: https: //github.com/B2F/Succss . Atm, können Sie die vollständige Dokumentation dort lesen: http://succss.ifzenelse.net

Answer 6

Was Sie beschrieben haben, ist genau das, was Mogotest tut. Wir können in Ihre Website einzuloggen, nehmen Screenshots für alle Seiten, die Sie konfiguriert haben, und tun automatisierten Abgleich mit den Prinzipien der Web Konsistenzprüfung .

Wir halten auch eine vollständige Übersicht über die Geschichte, so dass wir Ihnen genau sagen können, wenn etwas gebrochen (und was Ihre Website zu dieser Zeit sieht) und noch cooler, können wir erkennen, wenn Sie etwas behoben haben. Und schließlich Schnappschuss wir bei jedem Testlauf Ihren Code, so dass wir Ihnen genau zeigen, was für jede Ausgabe geändert.

Sorry für die Selbstfördernden Charakter dieser Antwort. Ich wollte nur, gründlich sein bei der Bewältigung was Sie suchen.