Zum Hauptinhalt springen

Playwright Recording

Skill Verifiziert Aktiv

Zeichnen Sie Browser-Interaktionen als Video mit Playwright auf. Verwenden Sie dies zum Erfassen von Demovideos, App-Walkthroughs und UI-Flows für Remotion-Videos. Auslöser sind die Aufzeichnung einer Demo, die Erfassung eines Browser-Videos, die Bildschirmaufnahme einer Website oder die Erstellung von Walkthrough-Aufnahmen.

Zweck

Benutzern die einfache Aufzeichnung von Browser-Interaktionen als Video für die Erstellung von Demovideos, App-Walkthroughs und anderen visuellen Inhalten durch Bereitstellung einer robusten, Playwright-basierten Lösung zu ermöglichen.

Funktionen

  • Browser-Interaktionen als Video mit Playwright aufzeichnen
  • Ansichtsfenstergrößen und Videoqualitätseinstellungen konfigurieren
  • Erweiterte Aufzeichnungsmuster implementieren (Formulare, Navigation, Scrollen, Anmelden)
  • Cursorhervorhebung und Klick-Ripple-Effekte hinzufügen
  • Cookie-Banner und andere gängige Web-Elemente behandeln
  • Detaillierte Beispiele für verschiedene Aufnahmeszenarien bereitstellen

Anwendungsfälle

  • Erfassung von Demovideos für Softwarefunktionen
  • Erstellung von Schritt-für-Schritt-App-Walkthroughs für Tutorials
  • Aufzeichnung von UI-Flows für Benutzertests oder Feedback
  • Generierung visueller Assets für Remotion-Videokompositionen

Nicht-Ziele

  • Durchführung komplexer Web-Scraping- oder Datenextraktionsaufgaben
  • Automatisierung von Backend-Prozessen, die nicht mit der Browser-Interaktion zusammenhängen
  • Bereitstellung einer voll funktionsfähigen Videobearbeitungssoftware
  • Aufzeichnung des Desktop-Bildschirms außerhalb eines Browserfensters

Installation

npx skills add digitalsamba/claude-code-video-toolkit

Führt das Vercel skills CLI (skills.sh) via npx aus — benötigt Node.js lokal und mindestens einen installierten skills-kompatiblen Agent (Claude Code, Cursor, Codex, …). Setzt voraus, dass das Repo dem agentskills.io-Format folgt.

Qualitätspunktzahl

Verifiziert
99 /100
Analysiert 2 days ago

Vertrauenssignale

Letzter Commit4 days ago
Sterne1.1k
LizenzMIT
Status
Quellcode ansehen

Ähnliche Erweiterungen

Agent Browser

100

Browser-automatisierungs-CLI für KI-Agenten. Verwenden Sie diese, wenn der Benutzer mit Websites interagieren muss, einschließlich der Navigation auf Seiten, dem Ausfüllen von Formularen, dem Klicken auf Schaltflächen, dem Aufnehmen von Screenshots, dem Extrahieren von Daten, dem Testen von Webanwendungen oder der Automatisierung beliebiger Browseraufgaben. Auslöser sind Anfragen wie "öffne eine Website", "fülle ein Formular aus", "klicke auf eine Schaltfläche", "mache einen Screenshot", "scrappe Daten von einer Seite", "teste diese Web-App", "melde dich bei einer Seite an", "automatisiere Browser-Aktionen" oder jede Aufgabe, die eine programmatische Webinteraktion erfordert.

Skill
shanraisshan

AutoBrowse

100

Self-improving browser automation via the auto-research loop. Iteratively runs a browsing task, reads the trace, and improves the navigation skill (strategy.md) until it reliably passes. Supports parallel runs across multiple tasks using sub-agents. Use when you want to build or improve browser automation skills for specific website tasks.

Skill
browserbase

Vue Testing Best Practices

100

Use for Vue.js testing. Covers Vitest, Vue Test Utils, component testing, mocking, testing patterns, and Playwright for E2E testing.

Skill
hyf0

Develop Web Game

100

Use when Codex is building or iterating on a web game (HTML/JS) and needs a reliable development + testing loop: implement small changes, run a Playwright-based test script with short input bursts and intentional pauses, inspect screenshots/text, and review console errors with render_game_to_text.

Skill
davila7

Playwright Best Practices

100

Verwenden Sie dies beim Schreiben von Playwright-Tests, Beheben von flackernden Tests, Debuggen von Fehlern, Implementieren des Page Object Model, Konfigurieren von CI/CD, Optimieren der Leistung, Mocken von APIs, Verwalten von Authentifizierung oder OAuth, Testen der Barrierefreiheit (axe-core), Hoch- und Herunterladen von Dateien, Mocken von Datums-/Uhrzeitangaben, WebSockets, Geolokalisierung, Berechtigungen, Multi-Tab-/Popup-Flows, mobilen/responsiven Layouts, Touch-Gesten, GraphQL, Fehlerbehandlung, Offline-Modus, Multi-User-Kollaboration, Drittanbieterdiensten (Zahlungen, E-Mail-Verifizierung), Überwachung von Konsolenfehlern, globalem Setup/Teardown, Testannotationen (skip, fixme, slow), Test-Tags (@smoke, @fast, @critical, Filterung mit --grep), Projekt­abhängigkeiten, Sicherheitstests (XSS, CSRF, Auth), Leistungsbudgets (Web Vitals, Lighthouse), iFrames, Komponententests, Canvas/WebGL, Service Workers/PWA, Testabdeckung, i18n/Lokalisierung, Electron-Apps oder Tests für Browser­erweiterungen. Deckt E2E-, Komponenten-, API-, visuelle, Barrierefreiheits-, Sicherheits-, Electron- und Erweiterungstests ab.

Skill
currents-dev

Playwright CLI

99

Automatisiert Browser-Interaktionen zum Testen und Validieren Ihrer eigenen Webanwendungen mit playwright-cli. Verwenden Sie es, wenn Sie terminalbasierte Browsersteuerung für Navigation, Formularfüllung, Screenshots, Tracing, gebundene Browser-Sitzungen, Debugging oder die Generierung von Playwright-Testcode benötigen. Verwenden Sie es nur gegen Anwendungen, die Ihnen gehören oder für deren Testung Sie ausdrücklich autorisiert sind.

Skill
testdino-hq