In dieser Episode sprechen wir mit Stefan Judis über Playwright. Stefan ist Entwickler, Blogger, Autor des „Web Weekly“-Newsletters und Speaker mit einer Leidenschaft für Web-Technologien, insbesondere für Web-Performance, neue Features in modernen Browsern und Barrierefreiheit.

Am 13. Juni 2025 lädt mittwald zum Head in the Cloud Summit ein – ein Tag voller Inspiration und Austausch auf dem mittwald Campus. Hier treffen sich Webworker, Developer und Digitalagenturen, um voneinander zu lernen.

Freu dich auf spannende Talks und Sessions zu Cloud & DevOps, Technology und Culture & Creativity. Von den Herausforderungen der digitalen Arbeitswelt bis hin zu den Trends von morgen – hier bekommst du Einblicke von den klügsten Köpfen der Branche.

Die Tickets sind begrenzt, also schnell buchen auf mittwald.de/hitc.

Ein zentrales Feature ist die Fähigkeit, Tests parallel auszuführen, was die Laufzeit von Test-Suites erheblich reduziert und die Continuous-Integration-Pipelines beschleunigt. Besonders für Teams, die viele Tests automatisieren, bietet Playwright hier große Vorteile.

Ein wichtiger Aspekt, über den wir sprechen, ist die Art und Weise, wie Playwright UI-Tests durchführt. Die Auswahl von Elementen ist dabei besonders robust gelöst: Playwright nutzt sogenannte „Auto-Waits“, das heißt, es wartet automatisch, bis ein Element im DOM vorhanden, sichtbar und interaktiv ist, bevor eine Interaktion stattfindet. Das reduziert eine der größten Frustquellen beim End-to-End-Testing – nämlich Tests, die aufgrund von Timing-Problemen fehlschlagen.

Zusätzlich erlaubt Playwright komplexe Selektoren, darunter CSS-, XPath- und Text-Selektoren, aber auch speziellere Methoden wie getByRole, um barrierefreie Elemente gezielt zu testen. Besonders praktisch ist auch, dass Playwright Shadow DOM und iFrames unterstützt, womit es sich besonders gut für moderne Webanwendungen eignet, die diese Techniken intensiv nutzen.

Ein weiteres Thema sind Race Conditions. Da Playwright nicht nur die UI testet, sondern auch Interaktionen mit dem DOM und asynchrone Prozesse genau beobachten kann, hilft es, Probleme aufzudecken, die durch nicht deterministisches Verhalten entstehen. Gerade bei Single-Page-Applications oder Anwendungen mit vielen dynamischen Inhalten kann Playwright dazu beitragen, Bugs zu finden, die sonst nur schwer zu reproduzieren sind.

Wir sprechen außerdem über die Möglichkeiten von visuellem Regressiontesting mit Playwright. Theoretisch lassen sich Screenshots und sogar Videoaufnahmen von Testläufen erstellen, um Änderungen in der Benutzeroberfläche zu erkennen und zu überprüfen. Allerdings haben wir selbst diese Funktionalität noch nicht ausprobiert – deshalb interessiert uns: Nutzt ihr visuelles Regressiontesting mit Playwright? Welche Erfahrungen habt ihr damit gemacht?

Stefan gibt außerdem Tipps, wie sich Playwright in bestehende Continuous-Integration/Continuous-Deployment-Pipelines einbinden lässt. Besonders für Teams, die bereits mit CI/CD arbeiten, ist es wichtig, dass Test-Frameworks sich reibungslos in bestehende Workflows einfügen. Playwright bietet hier viele Optionen, darunter die Integration mit GitHub Actions, Jenkins und anderen CI-Systemen.

Ein weiteres Highlight ist die Playwright Trace Viewer-Funktion. Damit lassen sich Tests detailliert analysieren, indem sämtliche Interaktionen, DOM-Änderungen und Konsolen-Ausgaben einer Testausführung gespeichert und später Schritt für Schritt durchgegangen werden können. Das erleichtert die Fehlersuche nach einem gescheiterten Pipeline-Durchlauf erheblich.