Step Types

Flowguard bietet verschiedene Step Types, um unterschiedliche Benutzeraktionen zu simulieren. Jeder Step Type führt eine bestimmte Aktion auf Ihrer Website aus.

Übersicht

Flowguard unterstützt 10 Step Types in Kategorien organisiert:

Kategorie	Step Types	Zweck
Navigation	Navigieren	Zwischen Seiten wechseln
Interaktion	Klicken, Ausfüllen, Auswählen, Checkbox, Radio	Benutzereingabe-Aktionen
Überprüfung	Prüfen	Erwartete Ergebnisse bestätigen
Timing	Warten, Scrollen, Hover	Flow-Steuerung und Sichtbarkeit

Schnellreferenz

• Die meisten Flows beginnen mit: Navigieren → (Interaktionen) → Prüfen
• Immer enden mit: Einem Prüfen-Step, um zu verifizieren, dass die Aktion funktioniert hat

1. Navigieren (Seite öffnen)

Öffnet eine bestimmte URL im Browser.

Anwendungsfälle

• Test-Flow starten
• Zu anderen Seiten wechseln
• Navigation testen
• Bestimmten Inhalt laden

Konfiguration

URL (erforderlich)

• Die vollständige URL zum Besuchen
• Muss Protokoll enthalten (http:// oder https://)
• Kann jede Seite auf Ihrer Website sein

Beschreibung (optional)

• Notiz, wohin Sie navigieren

Beispiele

URL: https://ihreseite.de/kontakt
Beschreibung: Kontaktformular-Seite öffnen

2. Klicken

Klickt auf ein Element (Button, Link, etc.).

Anwendungsfälle

• Formulare absenden
• Links folgen
• Modals/Popups öffnen
• UI-Elemente umschalten
• Menüs navigieren

Konfiguration

Selektor (erforderlich)

• CSS-Selektor für das Zielelement
• Verwenden Sie das Picker-Tool oder geben Sie manuell ein

Beschreibung (optional)

• Was Sie klicken und warum

Nach Klick warten (optional)

• Millisekunden zum Warten nach dem Klick

3. Ausfüllen (Text eingeben)

Gibt Text in Eingabefelder, Textbereiche oder contenteditable-Elemente ein.

Anwendungsfälle

• Formularfelder ausfüllen
• Suchanfragen eingeben
• In Texteditoren tippen
• Benutzernamen/Passwörter eingeben

Konfiguration

Selektor (erforderlich)

• CSS-Selektor für das Eingabefeld

Text (erforderlich)

• Der einzugebende Text

Beschreibung (optional)

• Welches Feld Sie ausfüllen

Erst leeren (optional)

• Vorhandenen Text vor dem Tippen löschen

4. Prüfen (Check)

Kritischer Step Type

Prüfen ist der wichtigste Step Type! Ohne Assertions führen Ihre Flows nur Aktionen aus, ohne zu verifizieren, dass sie funktioniert haben. Fügen Sie immer Prüfen-Steps nach wichtigen Aktionen hinzu.

Überprüft, ob Inhalt oder Zustände den Erwartungen entsprechen.

Anwendungsfälle

• Login-Erfolg verifizieren
• Fehlermeldungen prüfen
• Elementvisibilität bestätigen
• Inhalt validieren
• Weiterleitungen testen

Assertion-Typen

Typ	Beschreibung
Element ist sichtbar	Prüft, ob ein Element auf der Seite angezeigt wird
Element existiert	Prüft, ob ein Element im DOM ist
Element enthält Text	Prüft, ob der Text des Elements bestimmten Inhalt enthält
Element hat Attribut	Prüft, ob Element einen bestimmten Attributwert hat
Seiten-URL enthält	Prüft, ob aktuelle URL bestimmten Text enthält
Seiten-URL ist	Prüft, ob aktuelle URL exakt übereinstimmt
Seitentitel enthält	Prüft, ob Seitentitel bestimmten Text enthält

5. Warten

Pausiert die Ausführung für eine bestimmte Dauer.

Wann Warten verwenden

Warten-Steps sind nützlich, sollten aber sparsam verwendet werden:

• Warten auf langsam ladende Elemente
• Zeit für Animationen geben
• Warten auf AJAX-Anfragen
• Zeit für Weiterleitungen geben

Konfiguration

Dauer (erforderlich)

• Wartezeit in Millisekunden
• 1000ms = 1 Sekunde

Warten-Übernutzung vermeiden

• Verwenden Sie Warten sparsam (sie verlangsamen Tests)
• Verlassen Sie sich nicht auf Warten, um instabile Tests zu beheben
• Besser die Ursache beheben als längere Wartezeiten hinzufügen

6. Scrollen

Scrollt die Seite, um ein Element in Sicht zu bringen.

Anwendungsfälle

• Elemente unterhalb des sichtbaren Bereichs zeigen
• Lazy-Loading auslösen
• Zu Formularabschnitten scrollen
• Footer-Inhalt erreichen

7. Hover

Bewegt die Maus über ein Element, um Hover-Effekte auszulösen.

Anwendungsfälle

• Dropdown-Menüs zeigen
• Tooltips anzeigen
• Hover-Animationen auslösen
• :hover CSS-Zustände testen
• Mega-Menüs aktivieren

8. Auswählen (Option)

Wählt eine Option aus einem Dropdown (select-Element).

Anwendungsfälle

• Aus Dropdown-Menüs wählen
• Land/Bundesland auswählen
• Mengen wählen
• Kategorien auswählen

9. Checkbox

Aktiviert oder deaktiviert eine Checkbox.

Anwendungsfälle

• AGB akzeptieren
• Optionen aktivieren
• Mehrere Elemente auswählen
• Einstellungen umschalten

10. Radio

Wählt einen Radio-Button aus einer Gruppe.

Anwendungsfälle

• Zahlungsmethoden wählen
• Optionen auswählen
• Quiz-Fragen beantworten
• Versandmethoden wählen

Best Practices

Den richtigen Step Type verwenden

Aktion	✅ Verwenden	❌ Vermeiden
Seite öffnen	Navigieren-Step	Klick auf Link
Text eingeben	Ausfüllen-Step	Klicken + Tippen
Dropdown auswählen	Auswählen-Step	Klicken + Klicken

Beschreibungen hinzufügen

Jeder Step verdient eine Beschreibung

✅ Gut	❌ Schlecht
"Submit-Button im Kontaktformular klicken"	Keine Beschreibung
"E-Mail im Rechnungsfeld eingeben"	"Tippen"

Aktionen verifizieren

Goldene Regel: Nach jeder wichtigen Aktion einen Prüfen-Step hinzufügen.

Nach dieser Aktion	Dies prüfen
Login	Dashboard sichtbar
Formular absenden	Erfolgsmeldung erscheint
Suche	Ergebnisse werden angezeigt
In Warenkorb	Warenkorbzähler erhöht

Nächste Schritte

• Flows ausführen - Ausführung und Überwachung lernen
• Flow-Editor - Die Editor-Oberfläche beherrschen
• Einstellungen - Standardverhalten konfigurieren