Fähigkeiten webapp-testing
📦

webapp-testing

Niedriges Risiko ⚙️ Externe Befehle📁 Dateisystemzugriff

Webanwendungen mit Playwright-Automatisierung testen

Auch verfügbar von: 7Spade,DYAI2025,davila7,ArtemisAI,7Spade,Azeem-2,anthropics,ComposioHQ,Cam10001110101,AutumnsGrove

Lokale Webanwendungstests erfordern zuverlässige Browser-Automatisierung ohne manuelle Einrichtung. Dieses Toolkit bietet Playwright-Skripte und Server-Verwaltungsdienste zur Optimierung von Frontend-Test-Workflows.

Unterstützt: Claude Codex Code(CC)
🥉 73 Bronze
1

Die Skill-ZIP herunterladen

2

In Claude hochladen

Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen

3

Einschalten und loslegen

Teste es

Verwendung von "webapp-testing". Discover all interactive elements on localhost:5173

Erwartetes Ergebnis:

  • Found 12 buttons: [0] Submit, [1] Cancel, [2] Login...
  • Found 8 links: - Dashboard -> /dashboard, - Profile -> /profile...
  • Found 5 input fields: - email (email), - password (password)...
  • Screenshot saved to /tmp/page_discovery.png

Verwendung von "webapp-testing". Capture console logs during user flow

Erwartetes Ergebnis:

  • Console: [log] App initialized
  • Console: [warning] Deprecated API usage
  • Console: [error] Failed to load resource: net::ERR_CONNECTION_REFUSED
  • Captured 15 console messages. Logs saved to outputs/console.log

Sicherheitsaudit

Niedriges Risiko
v1 • 2/24/2026

Static analysis flagged 38 patterns, but manual review confirms all HIGH-severity findings are false positives. The 'weak cryptographic algorithm' detections are scanner errors on argparse code. Shell backtick findings are Markdown documentation formatting. Subprocess usage in with_server.py is intentional server management functionality requiring explicit CLI invocation. Hardcoded localhost URLs and temp file writes are expected for local testing toolkit.

5
Gescannte Dateien
310
Analysierte Zeilen
3
befunde
1
Gesamtzahl Audits
Probleme mit niedrigem Risiko (1)
scripts/with_server.py:69-74
Subprocess with shell=True
with_server.py uses subprocess.Popen with shell=True to start development servers. This is intentional functionality for a server management helper script. Commands are passed via CLI arguments, requiring explicit user invocation. Risk is mitigated by design - users explicitly provide the server commands.

Risikofaktoren

⚙️ Externe Befehle (2)
scripts/with_server.py:69-74 scripts/with_server.py:88-89
📁 Dateisystemzugriff (2)
examples/console_logging.py:31-32 examples/element_discovery.py:37-38
Auditiert von: claude

Qualitätsbewertung

45
Architektur
100
Wartbarkeit
87
Inhalt
50
Community
88
Sicherheit
83
Spezifikationskonformität

Was du bauen kannst

Frontend-Regressionstests

Automatisierte Verifizierung von UI-Komponenten nach Codeänderungen, um Breaking Changes vor dem Deployment zu erkennen.

Entwicklungsserver-Validierung

Backend- und Frontend-Server automatisch starten, Integrationstests ausführen und anschließend Ressourcen bereinigen.

Konsolen-Log-Debugging

Browser-Konsolenausgaben erfassen und analysieren, um JavaScript-Fehler und Warnungen während Nutzer-Flows zu identifizieren.

Probiere diese Prompts

Einfache Seitennavigation 
Navigate to my local React app at localhost:3000, wait for the page to fully load, and take a screenshot of the homepage.
Element-Entdeckung 
Visit my web application and list all buttons, links, and form inputs on the current page with their text content and attributes.
Konsolen-Log-Erfassung 
Run my automation script while capturing all browser console messages. Save the logs to a file and report any errors or warnings found.
Vollständiger Integrationstest 
Start my backend server on port 8000 and frontend on port 5173, then run my Playwright test script that logs in, navigates to the dashboard, and verifies key elements are present. Clean up servers after tests complete.

Bewährte Verfahren

  • Immer auf networkidle-Zustand warten, bevor mit dynamischen Seiten interagiert wird, um sicherzustellen, dass JavaScript vollständig ausgeführt wurde
  • Das with_server.py-Helfer-Skript zur Verwaltung des Server-Lebenszyklus verwenden, anstatt Server manuell zu starten und zu stoppen
  • Skripte zunächst mit dem --help-Flag ausführen, um verfügbare Optionen zu verstehen, bevor die Automatisierungslogik angepasst wird

Vermeiden

  • Nicht das DOM inspizieren oder Screenshots machen, bevor bei dynamischen Anwendungen auf networkidle gewartet wurde
  • Vermeiden, Skript-Quellcode in das Kontextfenster zu lesen – --help-Dokumentation verwenden und als Black-Box-Tools aufrufen
  • Keine festen Timeouts wie wait_for_timeout verwenden, wenn spezifische Selektoren mit wait_for_selector abgewartet werden können

Häufig gestellte Fragen

Wie teste ich eine Anwendung, die Authentifizierung erfordert?
Fügen Sie Login-Schritte in Ihrem Playwright-Skript ein, bevor Sie zu geschützten Seiten navigieren. Sie können Anmeldeinformationen in Umgebungsvariablen speichern oder Playwrights Storage-State-Funktion zur Wiederverwendung authentifizierter Sitzungen nutzen.
Kann ich mehrere Server gleichzeitig testen?
Ja, with_server.py unterstützt mehrere --server und --port-Paare. Jeder Server startet sequenziell, wartet auf Bereitschaft und führt dann Ihren Testbefehl aus, nachdem alle Server bereit sind.
Warum schlagen meine Tests fehl, wenn die Seite dynamische Inhalte hat?
Stellen Sie sicher, dass Sie page.wait_for_load_state('networkidle') nach der Navigation aufrufen. Für spezifische Elemente verwenden Sie page.wait_for_selector(), um auf das Erscheinen von Elementen vor der Interaktion zu warten.
Wie erfasse ich Browser-Screenshots für visuelles Debugging?
Verwenden Sie page.screenshot(path='filename.png', full_page=True), um die gesamte Seite zu erfassen. Screenshots werden im angegebenen Pfad gespeichert und können nach der Testausführung angezeigt werden.
Welche Browser werden für Tests unterstützt?
Playwright unterstützt Chromium, Firefox und WebKit. Dieser Skill verwendet standardmäßig Chromium im Headless-Modus für Zuverlässigkeit. Sie können Skripte bei Bedarf für andere Browser anpassen.
Wie installiere ich die erforderlichen Abhängigkeiten?
Installieren Sie Playwright mit pip install playwright und führen Sie anschließend playwright install aus, um Browser-Binärdateien herunterzuladen. Stellen Sie sicher, dass Python 3.7 oder höher in Ihrer Umgebung verfügbar ist.

Entwicklerdetails

Lizenz

Complete terms in LICENSE.txt

Repository

https://github.com/ZhanlinCui/Ultimate-Agent-Skills-Collection/tree/main/webapp-testing

Ref

main

Dateistruktur

📁 examples/

📄 console_logging.py

📄 element_discovery.py

📄 static_html_automation.py

📁 scripts/

📄 with_server.py

📄 SKILL.md