Warum Cucumber und Gherkin?

Cucumber ist ein Test-Framework, das die Sprache Gherkin nutzt. Der Vorteil:

• Lesbarkeit für alle – auch Fachbereiche ohne Programmierkenntnisse können die Szenarien verstehen.
• Klare Trennung von Fachbeschreibung (Feature-Dateien) und technischer Umsetzung (Step Definitions).

Mit Gherkin beschreibt man Tests in natürlicher Sprache – z. B. „Given … When … Then …“. Du kannst Dir einen ausführlichen Beitrag zu Gherkin hier durchlesen.

Projektstruktur

Ein typisches Projekt mit Cucumber und WebdriverIO ist so aufgebaut:

• features/wettercheck.feature → enthält die Test-Szenarien in Gherkin
• features/step-definitions/wettercheck.steps.js → enthält die technische Umsetzung

Feature-Datei: Wetter-Suche

Die Feature-Datei beschreibt die Testfälle in Gherkin. Hier ein Beispiel:

Hier sieht man nun zwei Dinge:

1. Positive Tests: Suche nach echten Städten → es soll eine Wetterübersicht erscheinen.
2. Negative Tests: Suche nach ungültigen Eingaben → es soll eine Fehlermeldung erscheinen.

Step Definitions: Technische Umsetzung

Die Step Definitions verbinden die Gherkin-Sätze mit echtem JavaScript-Code.

Hier passiert Folgendes:

• Given: Öffnet die Startseite und akzeptiert ggf. den Cookie-Banner.
• When: Gibt den Ort ins Suchfeld ein und klickt auf die Suchschaltfläche.
• Then: Überprüft, ob das Ergebnis entweder die richtige Stadt oder eine „keine Treffer“-Meldung anzeigt.

Besonders interessant ist der Then-Schritt, da hier die eigentliche Überprüfung (Assertion) passiert. Ein Beispiel für die Überprüfung einer gültigen Suche:

Hier passiert folgendes:

• Das Testskript wartet auf die Überschrift (h1) mit dem aktuellen Wetter.

• Der Text wird bereinigt (z. B. „Das Wetter heute in …“ entfernt).

• Mit expect(...).toBe(ort) wird überprüft, ob die Überschrift wirklich den gesuchten Ort enthält.

Für eine ungültige Eingabe sieht der Then-Schritt so aus:

Hier prüft der Test, ob die Seite die passende Fehlermeldung anzeigt, wenn der Benutzer einen nicht existierenden Ort eingibt.

Tests ausführen

Um die Tests zu starten, reicht im Terminal:

npx wdio run wdio.conf.js

Die Tests öffnen den Browser, geben die Orte ein und prüfen die Ergebnisse. Wie wir sehen können, sind die Tests mit insgesamt 24 Schritten nach ca. 1.30 Minuten erfolgreich durchgelaufen.

Fazit

Mit Cucumber und WebdriverIO lassen sich Tests in verständlicher Sprache beschreiben und trotzdem technisch präzise umsetzen.
Dieses kleine Projekt mit der Wettersuche zeigt:

• Positive und negative Testszenarien lassen sich leicht abbilden.
• Step Definitions sorgen für die Verbindung zwischen Fachsprache und Automatisierung.

Das Beispiel kann als Basis dienen, um eigene Tests zu entwickeln – egal ob für E-Commerce, Login-Prozesse oder Formularprüfungen.

Weiterführende Links

• • https://cucumber.io/