Das perfekte Testautomatisierungstool für Ihre Software zu finden, ist keine leichte Aufgabe.
Zunächst müssen wir akzeptieren, dass jede Software einzigartig ist und auf ihre eigene Weise bereitgestellt wird. Welche Art von Automatisierungstools benötigt wird, um sich an den Lebenszyklus der Softwaretests anzupassen, hängt stark von den Ressourcen, dem Team und der Strategie ab. Es gibt also nicht das eine „beste“ Testautomatisierungstool.
Es gibt jedoch eine Reihe beliebter Tools, die derzeit im Trend liegen und so konzipiert sind, dass sie sich problemlos an Ihr Projekt anpassen lassen. Beispiele für beliebte Automatisierungstools, die sowohl in einfachen als auch in komplexen Systemen eingesetzt werden und eine zuverlässige und präzise Testqualität gewährleisten, sind Selenium, Appium, Katalon Studio, Cypress und Playwright.
Heute wollen wir eines der neuesten Automatisierungstools, das sich bereits als Erfolg erwiesen hat, ins Rampenlicht rücken: Playwright.
Wie jeder Tester stand auch ich in meinen früheren Projekten vor einigen Herausforderungen, die den Frontend-Automatisierungsprozess verlangsamten. Das Schreiben von übermäßigem Boilerplate-Code zur Einrichtung der Browser, langsame Testausführungen, unzuverlässige Wartezeiten, Schwierigkeiten beim Auffinden der Selektoren und instabile Tests, um nur einige zu nennen. Erst als mir ein großartiger Kollege Playwright vorstellte, hat sich meine Welt der Automatisierung aufgehellt.
Playwright ist ein Open-Source-Framework für die End-to-End-Testautomatisierung, das aus Puppeteer hervorgegangen ist, auf Node.js basiert und von Microsoft gepflegt wird.
In der herkömmlichen Selenium-Architektur wird jede HTTP-Anfrage separat gesendet und erhält eine JSON-Antwort, was zu einem Hin- und Her-Kommunikationsfluss führt, der den gesamten Prozess verlangsamt. Playwright hingegen nutzt eine einzige API.
Es nutzt einen einzigen WebSocket für die Kommunikation mit allen Treibern. Aus diesem Grund erweist sich Playwright als eines der schnellsten und benutzerfreundlichsten Automatisierungs-Frameworks in der Welt des Softwaretestens. Schnell und einfach = Playwright. Doch wie genau ist es? Nach der Lektüre dieses Artikels werden Sie ein Gefühl dafür bekommen, ob dieses Framework zuverlässig genug ist, um es für die Software einzusetzen, an der Sie gerade arbeiten.
Ehrlich gesagt war dies für mich das am einfachsten einzurichtende Framework. Ein einziger Befehl richtet Ihre Automatisierungsumgebung ein, und schon können Sie mit der Automatisierung beginnen.
Einige der Gründe, warum Softwareteams ihr Automatisierungs-Framework auf Playwright umgestellt haben, sind die Unterstützung mehrerer Sprachen wieJavaScript, Java, Python und .NET C# sowie die Unterstützung einer Vielzahl von Test-Runner: Mocha, Jest, Jasmine, Cucumber. Das Tolle an der Ausführung von Playwright-Tests ist, dass sie Headless-Browser mit einer ereignisgesteuerten Architektur nutzen.
Playwright ist mit allen modernen Betriebssystemen (Windows, Mac und Linux) kompatibel und stellt folgende Anforderungen:
Erstellen Sie in Ihrem Betriebssystem einen Ordner, zum Beispiel „LEARN-PLAYWRIGHT“, und öffnen Sie den Ordner in VS Code. Führen Sie das Stammverzeichnis des Projekts mit dem folgenden Befehl aus:
npm init playwright@latest
So sieht die Ordnerstruktur eines typischen Playwright-Projekts aus. Es wird eine Beispielstruktur für ein Testprojekt bereitgestellt, die alle Voraussetzungen enthält, bevor eine Testspezifikation erstellt wird. Im folgenden Beispiel habe ich TypeScript als Sprache gewählt, daher enden die Dateinamen auf „.ts“.
Die Datei `playwright.config.ts` enthält den Abschnitt „projects“, in dem der zu testende Prozess festgelegt wird. Hier können Sie den Browser, den Kontext und die Seiten-Fixtures konfigurieren. Sie können Optionen global oder lokal festlegen und die Aufzeichnung oder Testerfassung aktivieren.
Hier sind die Browser, die standardmäßig ausgeführt werden. Die Tests laufen unter Chromium, Firefox und WebKit (Safari).
// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';
export default defineConfig({
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
Verwendung: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
],
});
Die Beispieltests, die ausgeführt werden sollen, befinden sich in der Datei „example.spec.ts“.
Playwright stellt Ihnen eine JSON-Datei zur Verfügung, die „test“ als Skript zum Ausführen von Tests verwendet.
So sieht eine Standard-JSON-Datei aus.
{
"name": "LEARN-PLAYWRIGHT",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Fehler: kein Test angegeben\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@playwright/test": "^1.16.3"
}
}
Ein wesentliches Merkmal von Playwright ist, dass es standardmäßig alle Tests im Headless-Modus ausführt. Um dieses Verhalten zu ändern, verwenden Sie „headless: false“ als Startoption in der Konfigurationsdatei.
import { defineConfig } from '@playwright/test';
export default defineConfig({
use: {
headless: false,
viewport: { width: 1280, height: 720 },
ignoreHTTPSErrors: true,
video: 'on-first-retry',
},
});
Playwright ist mit allen modernen Browsern kompatibel, darunter Microsoft Edge (Chromium), Apple Safari (mit WebKit), Mozilla Firefox und Chrome. Standardmäßig ist die parallele Ausführung mehrerer Tests aktiviert. Dies ist ein weiterer Faktor, der die Ausführungszeit verkürzt.
Führen Sie Ihren ersten Beispieltest mit dem folgenden Befehl aus.
npx playwright test
Der Befehl zum Ausführen von Tests lautet
npx playwright test --headed
Wenn Sie den Headed-Browser mit dem npm-Benutzer ausführen möchten:
npm run test -- --headed.
Wenn du ein einzelnes Projekt ausführen möchtest, beispielsweise Chromium, dann kannst du folgenden Befehl verwenden:
npx playwright test --project=chromium
Dann wird der Test ausschließlich in Chromium ausgeführt.
Während der Ausführung warten die Testsautomatisch, bisdie Steuerelemente verfügbar sind, sodass keine zusätzliche Warte- oder Pausenzeit für eine Aktion eingefügt werden muss.
Da wir drei verschiedene Browser testen, teilt Playwright die Tests automatisch auf drei separate Worker auf. Sobald der Testlauf abgeschlossen ist, werden die Ergebnisse in diesem Ordner namens „playwright report“ gespeichert.
Wie ich bereits erwähnt habe, dauert es nur wenig Zeit, mit dem Schreiben von Testskripten in Playwright zu beginnen, da die Beispieltestdatei bereits ein übersichtliches, strukturiertes Format bietet. Sie können einfach Ihre eigenen Skripte einfügen, um loszulegen. Später können Sie die Struktur Ihres Codes verbessern, um ihn übersichtlicher und objektorientierter zu gestalten.
test.describe('Zur Website navigieren', () => {
test('Zur Website navigieren', async ({ page }) => {
// Zur Basis-URL navigieren
await page.goto('https://qestit.com/');
})
});
Verwenden Sie die Methode „page.waitForSelector()“, um darauf zu warten, dass ein Element auf der Seite erscheint. Diese Methode nimmt einen Selektor als Argument entgegen und gibt ein Promise zurück, das aufgelöst wird, sobald das Element gefunden wurde. Sobald Sie den Selektor für das Element identifiziert haben, mit dem Sie interagieren möchten, können Sie die Methode „page.click()“ verwenden, um mit dem Element zu interagieren.
Wenn Sie das Skript in einem Browser mit Kopfzeile ausführen, rufen Sie die Methode„page.pause()“ aus Ihrem Skript auf. Die Verwendung der Methode„page.pause()“ist eine einfache Möglichkeit, die Ausführung des Playwright-Skripts anzuhalten und die Seite in den Entwicklertools zu untersuchen. Außerdem wird der Playwright Inspector geöffnet, der Ihnen beim Debuggen hilft.
Playwright ist zudem bekannt für die Handhabung der Navigation zwischen verschiedenen Seiten, beispielsweise zwischen Iframes und verschiedenen Registerkarten. Dies ist eine zuverlässige Methode, um zu überprüfen, ob an der aktuellen Position der richtige Inhalt angezeigt wird, wodurch Fehlalarme vermieden werden.
Es geht darum, das Ganze aufzuschlüsseln. Die Fehlersuche wird durch die visuelle Aufschlüsselung der Zeilen mit dem Debugger von Playwright benutzerfreundlicher gestaltet. Fügen Sie Haltepunkte hinzu, führen Sie den Test im Debug-Modus aus, und der laufende Test hält am Haltepunkt an und zeigt Ihnen die Situation an. Playwright verfügt über einen strengen Modus – wenn also ähnliche Selektoren vorhanden sind, bricht der Test ab und schlägt bereits einige Schritte vor dem eigentlichen Fehler fehl.
Codegen ist für Tester das, was GitHub Copilot für Entwickler ist. Es wandelt Ihre Benutzerinteraktionen in Code um. Codegen ist ein Codegenerator, mit dem Sie Ihre Testskripte sofort und präzise erstellen können, während Sie die Aktionen in Ihrem Browser ausführen.
Wenn Sie beispielsweise einen Testfall auf einer Seite automatisieren möchten, führen Sie folgenden Befehl aus:
npx playwright codegen qestit.com
Dadurch verkürzt sich Ihre Programmierzeit im Grunde genommen vom Schreiben von Skripten auf bloßes Klicken. Sobald Ihr Code fertig ist, kopieren Sie ihn und fügen ihn in Ihre Testklasse ein. Das beschleunigt die Implementierung und Ausführung!
Mit der Erweiterung „Playwright Test for VS Code“ musst du nicht einmal Befehle eingeben. Diese Erweiterung vereinfacht die Identifizierung von Selektoren, indem du einfach mit der Maus über das Element fährst und der Locator automatisch für dich geschrieben wird. Du musst lediglich klicken, die Eingabetaste drücken, kopieren und einfügen.
2. Wechseln Sie im Test-Explorer zum Testfall
3. Klicken Sie auf „Pick Locator“
4. Aktivieren Sie „Browser anzeigen“
5. Bewegen Sie den Mauszeiger über das Element, das Sie nicht finden können, klicken Sie darauf, und der Locator wird in Ihrem Editor angezeigt.
Playwright verfügt standardmäßig über viele hervorragende Reporter wie List, Dot, Line, JSON, JUnit und HTML Reporters.
Der Befehl zum Abrufen von Testberichten lautet „npx playwright show-report“. Er zeigt einen übersichtlichen Bericht im Browser an, in dem Sie jeden Schritt ein- oder ausklappen können, um zu sehen, wo der Fehler aufgetreten ist, falls ein Test fehlschlägt.
Playwright erstellt außerdem Trace-Dateien. Dabei handelt es sich um ZIP-Dateien, die dir die Zeitachse und die für den Test durchgeführten Aktionen anzeigen. Es ist im Grunde ein DOM-Snapshot (mit dem du interagieren kannst). Wenn du nun den Befehl zum Anzeigen des Berichts ausführst, erhältst du deinen interaktiven Bericht.
Traces werden normalerweise in einer CI-Umgebung ausgeführt, aber du kannst einen Trace sogar lokal ausführen, indem du
folgenden Befehl ausführen:
npx playwright test --trace on
Um den Bericht zu öffnen, führen Sie folgenden Befehl aus:
npx playwright show-report
Da Continuous-Integration-Methoden weit verbreitet sind, lässt sich Playwright problemlos in CI/CD-Pipelines von CI-Tools integrieren. Playwright lässt sich zudem in die Docker-Umgebung und in Selenium Grid integrieren.
Playwright hat noch eine relativ kleine Community. Es ist nicht so komplex wie andere Testautomatisierungs-Frameworks, was bedeutet, dass es möglicherweise noch unbekannte Probleme gibt, die bisher noch nicht aufgetreten sind. Mit der Zeit wird sich die Dokumentation von Lösungen und Abhilfemaßnahmen jedoch weiterentwickeln.
Ein weiterer Nachteil ist, dass es im Gegensatz zu beispielsweise Cypress keine echten Geräte für Tests mit mobilen Browsern unterstützt, wohl aber Emulatoren.
Playwright verfügt über eine Funktion zum Testen von Komponenten, die noch nicht vollständig stabil ist. Hier wird noch daran gearbeitet. Das Framework hat jedoch eine aktive und engagierte Community, die daran arbeitet, die bestmöglichen Verbesserungen zu erzielen.
Mehrere IT-Fachleute weltweit haben zum Ausdruck gebracht, dass die Testautomatisierung zu einer „lebendigen Dokumentation“ wird, die sowohl für Tester als auch für wichtige technische Stakeholder lesbar ist. Sie bietet die Möglichkeit, aktuellen und neuen Teammitgliedern einen interaktiven Einblick hinter die Kulissen eines Systems zu gewähren. Mit anderen Worten: Testskripte und -strukturen sollen leicht verständlich und nicht personenabhängig sein. Aspekte wie Wartbarkeit und Einfachheit können angesichts der Vielzahl automatisierter Tests eine Herausforderung darstellen.
Playwright spielt eine wichtige Rolle dabei, die Vorgänge während der Testausführung besser zu visualisieren, wodurch es für Tester und sogar Entwickler interaktiv und nützlich wird. Playwright kann ein hervorragendes Automatisierungstool sein, das sich für Ihre Projekte lohnt, da es eine übersichtliche Darstellung der Testskripte bietet und Ihnen mithilfe einiger der oben genannten hilfreichen Erweiterungen Minuten oder sogar Stunden an Testzeit einsparen kann.
Probieren Sie es aus:https://playwright.dev/docs/intro