Testing

Wer Alpine.js-Komponenten in Hyvä-Themes ausschließlich über vollständige End-to-End-Läufe testet, wartet bei jeder kleinen Änderung minutenlang auf Feedback und baut Tests, die von Netzwerk, Datenbank und Session-Zustand abhängen. Cypress Component Testing mountet einzelne Komponenten isoliert im echten Browser, ohne Magento-Backend und ohne kompletten Seitenaufbau, und liefert Ergebnisse in Sekunden statt Minuten.

Die meisten flaky E2E-Tests scheitern nicht an falschen Selektoren, sondern an schlecht verwalteten Testdaten. Wer Fixtures, Factories, Ownership-Modelle und Cleanup-Strategien konsequent trennt, gewinnt reproduzierbare, parallelisierbare Testläufe, die auch bei wachsenden Suiten und häufigen Schema-Änderungen zuverlässig bleiben.

Wer Magento-Checkout-Flows nur gegen die echte API testet, bekommt langsame und flackernde End-to-End-Tests, die bei jedem Backend-Hickup rot werden. Mit cy.intercept() stubbt und beobachtet ihr Netzwerk-Requests gezielt, ladet Fixtures für realistische Antworten und testet Fehler- und Ladezustände deterministisch, ganz ohne den echten Server dafür anzufassen. So bleiben eure Tests schnell, reproduzierbar und unabhängig vom aktuellen Datenbankzustand.

Wer Zahlungs- und Versanddienstleister in jedem Testlauf live anspricht, riskiert Kosten, Rate Limits und zufällige Fehlschläge durch fremde Infrastruktur. Dieser Artikel zeigt, wie Mock-Server wie MSW und WireMock, aufgezeichnete Fixtures und gezielt simulierte Fehler und Timeouts eine E2E-Suite unabhängig von der Verfügbarkeit externer Dienste und trotzdem realistisch machen.

Der Checkout ist die wertvollste Strecke in jedem Magento-Shop und gleichzeitig die fragilste, weil hier Frontend-State, asynchrone AJAX-Aufrufe und externe Zahlungs-APIs zusammentreffen. Dieser Artikel zeigt, wie ihr Warenkorb, Versandarten, Zahlungsarten und die Bestellbestaetigung mit Cypress und Playwright end-to-end testet, Payment-Gateways im Sandbox-Modus zuverlässig simuliert und Gast- sowie Login-Pfade sauber voneinander trennt.

Playwright hat sich neben Cypress als zweite zentrale Lösung für End to End Tests etabliert und bringt Multi Browser Support, einen eingebauten Trace Viewer und ein kostenloses Worker Modell direkt aus der Box mit. Dieser Artikel zeigt Installation, Konfigurationsdatei und einen ersten echten Test gegen einen Magento und Hyvä Storefront, damit Teams die Wahl zwischen Cypress und Playwright fundiert treffen können.

Wer API-Tests in einem separaten Tool pflegt und E2E-Tests in Cypress oder Playwright, verdoppelt Wartungsaufwand und verliert Kontext zwischen beiden Welten. Mit cy.request() und der Playwright APIRequestContext lassen sich Testdaten in Millisekunden statt über Formulare aufbauen, Auth-Sessions zwischen API und Browser teilen und ganze Testsuiten spürbar beschleunigen, ohne die Zuverlässigkeit zu verlieren.

Playwright zeichnet bei jedem fehlgeschlagenen Testlauf eine vollständige Aufzeichnung aus Screenshots, DOM-Snapshots, Netzwerkanfragen und Konsolenausgaben auf. Der Trace Viewer macht diese Aufzeichnung durchsuchbar und zeigt exakt, welcher Klick, welche Anfrage oder welcher Zustand einen Test scheitern ließ. So wird stundenlanges Rätselraten bei flaky Tests durch gezielte Fehlersuche ersetzt.

Tests, die einzeln zuverlässig bestehen, aber in der vollen Suite oder bei paralleler Ausführung plötzlich fehlschlagen, deuten fast immer auf geteilten Zustand zwischen Browser Storage, Datenbank und Testdaten hin. Dieser Artikel zeigt konkrete Isolationsstrategien für Cypress und Playwright, von eindeutigen Testdaten pro Worker bis zu sauberem Cleanup, damit E2E Suiten stabil, parallel sicher und reproduzierbar bleiben.

Cypress-Tests, die lokal zuverlässig grün sind, scheitern in der CI oft unerwartet an Ressourcenlimits, abweichenden Viewports und Timing-Unterschieden auf geteilten Runnern. Dieser Artikel zeigt, wie ihr Cypress in GitLab CI und GitHub Actions headless ausführt, Video- und Screenshot-Artefakte bei Fehlschlägen sichert, node_modules und die Cypress-Binary cacht und Testläufe über mehrere Jobs hinweg parallelisiert.