Echte Komponenten

Reale UI-Komponenten — Produktkarten, Admin-Tabellen, Navigationsleisten, Dropdowns, Modals, Karussells, Preisraster, Kanban-Boards — kombinieren mehrere CSS-Eigenschaften in dichten und voneinander abhängigen visuellen Systemen. Eine Komponente isoliert mit einem Storybook-Referenz-Screenshot zu testen reicht nicht, weil eine Regression nur dann auftauchen kann, wenn die Komponente in ihren echten Kontext integriert ist: ein Dropdown, das sich hinter einer Tabelle öffnet, weil ein overflow: hidden zur Lösung eines anderen Bugs hinzugefügt wurde, eine dezentrierte Modal, weil die Body-Positionierung wegen einer Sticky-Komponente verändert wurde, oder ein Karussell, das zwei Slides statt einem zeigt, weil der übergeordnete Container die Breite gewechselt hat. Auf Business-Oberflächen betreffen diese Regressionen oft kritische Funktionen — versteckte Archivierungs-Buttons in einer Tabelle, unsichtbare Validierungsoptionen in einer Modal — und ihr operativer Impact reicht weit über bloßen visuellen Diskomfort hinaus. Die Konsistenz eines Design Systems hängt gerade von der Stabilität dieser in ihre echten Seiten integrierten Komponenten Sprint für Sprint ab. Delta-QA erfasst die vollständigen Seiten mit diesen Komponenten in ihren verschiedenen interaktiven Zuständen (geöffnetes Menü, angezeigte Modal, ausgewählte Zeile) und vergleicht die Snapshots mit der visuellen Baseline. Der Diff hebt Komponenten hervor, deren Dimensionen, Positionierung, sichtbarer Inhalt oder Stapeltiefe sich zwischen Versionen geändert haben. Dieser Ansatz erlaubt zu validieren, dass eine Änderung an einem Teil des Systems keine entfernte Komponente gebrochen hat, und gibt QA-Teams einen Seitenvergleich auf vollständigen UI-Patterns, den isolierte Komponenten-Unit-Tests konstruktionsbedingt nicht abdecken können.