Vergleich: Delta-QA oder Chromatic — ganze Seiten testen oder Komponenten?
Chromatic ist das Referenztool für visuelles Testing von UI-Komponenten über Storybook. Delta-QA testet vollständige Webseiten mit echten Benutzerabläufen. Es sind keine direkten Konkurrenten — es sind zwei verschiedene Testebenen. Und den Unterschied zu verstehen, verhindert, dass man sich geschützt glaubt, wenn man es nur zur Hälfte ist.
Was Chromatic testet
Chromatic erfasst jede Storybook-Story und vergleicht sie mit ihrer vorherigen Version. Einen Button in seinen 5 Zuständen (default, hover, active, disabled, loading). Eine Card mit kurzem und langem Titel. Ein leeres und ein vorausgefülltes Formular.
Das ist leistungsstark zum Schutz einer Komponentenbibliothek. Jede Änderung an einer geteilten Komponente wird sofort erkannt. Die Review-Oberfläche eignet sich hervorragend für die Zusammenarbeit zwischen Designern und Entwicklern.
Das Problem ist, dass Chromatic Komponenten in Isolation testet. Eine einzelne Komponente, in einem neutralen Container, ohne Seitenkontext. Und genau dort verstecken sich die Bugs.
Was Delta-QA testet
Delta-QA testet vollständige Seiten. Keine isolierten Komponenten — echte Seiten mit einem echten Layout, echtem Inhalt, echten Komponenten, die miteinander interagieren.
Eine perfekte Card-Komponente in Storybook kann kaputtgehen, wenn sie in einem 3-Spalten-Grid mit einer Sidebar ist. Ein isoliert validierter Button kann hinter einem Footer verschwinden, wenn er im realen Kontext steht. Ein in der Story einwandfreies Formular kann aus seinem Container herauslaufen, wenn es in ein Modal integriert wird.
Diese Bugs sieht Chromatic nicht. Delta-QA sieht sie, weil es testet, was der Benutzer tatsächlich sieht — die vollständige Seite, in einem echten Browser, mit dem echten Inhalt.
Die Storybook-Voraussetzung
Chromatic erfordert Storybook. Wenn Ihr Projekt kein Storybook verwendet, ergibt Chromatic keinen Sinn. Und Storybook ausschließlich für visuelles Testing einzurichten, ist eine erhebliche Investition: Stories für jede Komponente schreiben, diese Stories aktuell halten, Demo-Daten verwalten.
Delta-QA erfordert nichts. Kein Storybook, kein spezifisches Framework, keinen Code. Sie haben eine Website? Sie können sie testen.
Cloud vs. lokal
Chromatic ist ausschließlich Cloud-basiert. Ihre Aufnahmen werden in der Chromatic-Infrastruktur gesendet und gespeichert. Keine Self-Hosted-Option, selbst mit einem selbst gehosteten GitLab.
Delta-QA ist standardmäßig lokal. Alles bleibt auf Ihrem Rechner. Keine Daten, die nach außen gehen.
Die Preisgestaltung
Chromatic bietet 5.000 kostenlose Snapshots pro Monat, aber nur für Chrome. Multi-Browser beginnt ab 179$/Monat. Und die Snapshots summieren sich schnell: 180 Stories × 3 Viewports = 540 Snapshots pro Build, also ~9 Builds bevor das kostenlose Limit erreicht ist.
Delta-QA Desktop ist kostenlos ohne Einschränkung. Multi-Browser inklusive.
Die eigentliche Frage
Die Frage ist nicht "Chromatic oder Delta-QA?". Sie lautet "Testen Sie Ihre Komponenten, Ihre Seiten, oder beides?"
Wenn Sie Storybook und ein Design System haben, schützt Chromatic Ihre Komponentenbibliothek. Das ist ein erstes Sicherheitsnetz.
Aber Sie brauchen auch ein zweites Netz für die vollständigen Seiten. Hier kommt Delta-QA ins Spiel. Beide Tools ergänzen sich — das eine ersetzt nicht das andere.
Und wenn Sie kein Storybook verwenden, ist Delta-QA die einzige notwendige Option.
FAQ
Funktioniert Chromatic ohne Storybook?
Chromatic öffnet sich seit 2025 für Playwright und Cypress, aber diese Integrationen sind noch jung. Historisch und in der Praxis bleibt Storybook die Hauptvoraussetzung.
Kann eine in Storybook perfekte Komponente auf der Seite kaputtgehen?
Ja. Die Isolation von Storybook verbirgt die Interaktionen mit dem übergeordneten Layout, den benachbarten Komponenten, dem realen Inhalt und den Bildschirmbeschränkungen. Das ist die Hauptfalle des isolierten Komponententests.
Kann man Chromatic und Delta-QA zusammen nutzen?
Ja, und das ist der empfohlene Ansatz. Chromatic für die Komponenten, Delta-QA für die Seiten. Jedes Tool deckt eine andere Ebene ab.
Welches ist schneller einzurichten?
Delta-QA: wenige Minuten. Chromatic: mehrere Stunden bis einige Tage (Storybook-Setup + Story-Erstellung + CI-Konfiguration).
Chromatic testet isolierte UI-Komponenten über Storybook. Delta-QA testet vollständige Webseiten und reale Benutzerabläufe — ohne Storybook, ohne Code, ohne technische Vorkenntnisse.
Vorheriger Artikel: Delta-QA vs Percy