Skip to main content
F-LOG-GE

CSS testen mit PhantomCSS

Eine Sache, die ich schon länger vor mir her schiebe, ist die Integration von Tests in meinen Workflow. Ich programmiere nicht, also ist mir der Gedanke von Tests nicht besonders geläufig. Meine bisherigen Tests sind visuelle, mit meinen Augen.

Sehr hilfreich ist für mich mein aktuelles Vorgehen, nicht mehr Seiten zu bauen, sondern Modulübersichten. So habe ich bspw. alle Formulare auf einer Seite und kann Seiteneffekte relativ schnell erfassen. Allerdings muss ich dafür immer kontrollieren und übersehen kann ich auch das eine oder andere Detail.

Da kommt nun PhantomCSS ins Spiel, das ich als Grunt-Task einrichten kann. Micah Godboldt hat seinem Vorgehen einen langen, sehr interessanten Artikel gewidmet. Ausserdem widmete er dieser Technik die Sass-Bites-Folgen 62 und 63. Alles in allem sehr interessante Einblicke.

Ich hatte auch schon mit PhantomCSS experimentiert, habe es aber nie in einem Projekt ernsthaft genutzt. In seinem Artikel empfiehlt Micah erst, das Repo von Anselm Hannemann zu nutzen, nicht das Original. Später schreibt er, dass er wegen eines Details sein eigenes Repo forken musste. Ich muss mal analysieren, ob sein Ansatz mit meiner Art zu arbeiten kompatibel ist.

Bei aller Begeisterung für solche Tests müssen wir aber einsehen, dass sie kein Ersatz für echte Tests im Browser sind. Sie können erste Warnungen für Fehlentwicklungen geben, mehr nicht. Basis der Tests ist immer PhantomJS, also im Kern ein uralter Chrome. Wir haben damit keine anderen Browserengines abgedeckt und vor allem keine aktuellen. Aber wir können uns zumindest warnen lassen, wenn eine Änderung Seiteneffekte hatte. Nicht mehr und nicht weniger schaffen visuelle Regressionstests. Vielleicht bin ich deshalb immer so wenig engagiert in diese Richtung.

Dies ist ein Archiv meines alten Weblogs, das von Oktober 2006 bis Dezember 2022 als Wordpress-Instanz existierte.