What happens if a test step fails during recording?

The skill includes error handling that identifies failed specs and provides resolutions, such as checking file paths or verifying that the Playwright config has video recording enabled.

Does this skill require Playwright to be installed locally?

Yes, the skill validates your Playwright installation and will guide you through running 'npm install' and 'npx playwright install' if dependencies are missing.

Can I customize the output GIF settings?

Yes, you can adjust parameters like FPS and width during the conversion step to ensure the final GIF is optimized for your specific documentation platform.

How does this differ from Claude's native browser integration?

While native integration is ideal for interactive debugging, this skill uses Playwright specs for automated, repeatable recordings that are better suited for formal documentation and tutorials.

Browser Recording & Tutorial Generator

Name: Browser Recording & Tutorial Generator
Author: athola

byathola

•

123

Aprendizaje y Documentación

Automates high-quality browser session recordings and GIF conversions for web tutorials and documentation.

Acerca de

This skill streamlines the creation of visual documentation by automating browser interactions through Playwright and converting the captured sessions into optimized GIFs. It handles environment validation, spec execution, and post-processing, making it ideal for developers and technical writers who need to produce consistent, repeatable web UI demonstrations or visual bug reports. While Claude Code offers native browser control for interactive tasks, this skill provides a robust framework for automated, cross-browser, and CI/CD-compatible recording workflows.

Características Principales

Automated Playwright session recording to WebM format
Support for cross-browser recording (Chromium, Firefox, WebKit)
123 GitHub stars
Configurable 'slow-mo' execution for clear visual demonstrations
Pre-execution environment and dependency validation
High-quality GIF conversion with optimized FPS and scaling

Casos de Uso

Automating the creation of step-by-step web UI tutorials
Capturing visual evidence for bug reports in automated testing pipelines
Generating animated GIFs for GitHub READMEs and technical documentation

Acerca de

Características Principales

Automated Playwright session recording to WebM format
Support for cross-browser recording (Chromium, Firefox, WebKit)
123 GitHub stars
Configurable 'slow-mo' execution for clear visual demonstrations
Pre-execution environment and dependency validation
High-quality GIF conversion with optimized FPS and scaling

Casos de Uso

Automating the creation of step-by-step web UI tutorials
Capturing visual evidence for bug reports in automated testing pipelines
Generating animated GIFs for GitHub READMEs and technical documentation