skills.rest
kagenti
kagentiOFFICIAL
Explore all skills by this author →
GitHub

playwright-research

Analyze UI code changes to plan and maintain Playwright demo videos.

292|103|Updated Mar 27, 2025
Search Tags:#testing#code analysis#playwright#ui automation#video generation#demo creation
One-click install
npx skills add https://github.com/kagenti/kagenti --skill playwright-research
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playwright-research
Source: https://github.com/kagenti/kagenti/tree/main/.claude/skills/playwright-research
Command: npx skills add https://github.com/kagenti/kagenti --skill playwright-research

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the process of analyzing UI code changes to plan, create, and maintain Playwright demo videos, ensuring your documentation stays up-to-date with minimal manual effort.

Core Features & Use Cases

  • UI Code Analysis: Detects changes in UI code to identify which demo videos need updates or regeneration.
  • Automated Test Writing: Generates Playwright test specifications based on UI source code analysis.
  • Video Lifecycle Management: Orchestrates the recording, validation, and narration of demo videos.
  • Use Case: When a new feature is added to the UI, this Skill can automatically determine if a new demo video is required, write the test script for it, and manage the recording process.

Quick Start

Use the playwright-research skill to analyze UI code changes and update the TODO_VIDEOS.md file.

Frequently Asked Questions about playwright-research

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate Playwright demo video generation for new UI features?▼

Automate Playwright demo video generation by analyzing UI code changes to detect new features, automatically writing the required test specifications, and orchestrating the full video recording lifecycle with minimal manual intervention.

What is the best way to keep UI demo videos updated when source code changes?▼

Keep UI demo videos updated by detecting code modifications, identifying which existing demos require regeneration, and automatically validating the new recordings to ensure your documentation stays current with the latest UI state.

How does automated test writing work for Playwright video recording?▼

Automated test writing for Playwright video recording works by analyzing your UI source code to generate the necessary Playwright test specifications, which then serve as the foundation for planning and executing the demo video capture.

Can I manage and track demo video coverage across my UI codebase?▼

You can manage and track demo video coverage by utilizing a TODO_VIDEOS.md file to record required videos, identify missing demos for new features, and maintain an organized log of your overall video documentation status.

Do I need to manually write Playwright test scripts before creating demo videos?▼

You do not need to manually write Playwright test scripts before creating demo videos, as the system analyzes your UI code changes and automatically generates the required test specifications needed for the video recording lifecycle.

Related Skills

Explore More Software Engineering Skills→
mthinesmthines
7

e2e-testing

Plan, generate, and heal Playwright end-to-end tests for web applications.

Community
Advanced
ai-ecoverseai-ecoverse
28

demo-recording

Record web UI demo videos with playwright-cli and ffmpeg processing into GitHub-ready MP4s.

Official
Intermediate
phoenicisfphoenicisf

ui-demo

Record polished UI demo videos of web applications using Playwright.

Community
Advanced
TrainLCDTrainLCD
71

argent-screen-recording

Record iOS simulators and Android devices to h264 mp4 files.

Official
Advanced