/record-browser | scry | ClaudePluginHub

Back to Commands

Slash Command

Community

/record-browser

82

Description

Record browser sessions using Playwright

AI Summary

Records automated browser sessions using Playwright specs for creating web UI tutorials and demos. Use this for CI/CD workflows or when you need scripted, repeatable recordings rather than interactive capture.

Install

1

Add the repository(one-time)

$

/plugin marketplace add athola/claude-night-market

2

Install the plugin

$

/plugin install scry@claude-night-market

Command Content

/record-browser

Record browser sessions using Playwright specs for web UI tutorials.

💡 Claude Code 2.0.72+: For interactive browser control, consider using native Chrome integration. This command is optimized for automated recording workflows and CI/CD. Both approaches can be combined - test interactively with Chrome, record programmatically with Playwright.

Usage

/record-browser <spec-file>            # Record from Playwright spec
/record-browser --init <name>          # Create new spec template
/record-browser --config               # Show Playwright config

Workflow

Invoke skill: Skill(scry:browser-recording)
Follow the skill's workflow to:
- Validate Playwright installation
- Check spec file exists
- Execute recording with video
- Convert to GIF using gif-generation

Examples

# Record from existing spec
/record-browser specs/dashboard-demo.spec.ts

# Create new spec template
/record-browser --init login-flow

# Check Playwright config
/record-browser --config

Requirements

Node.js and npm
Playwright: npm install -D @playwright/test
Browsers: npx playwright install chromium

See Also

Skill(scry:browser-recording) - Core recording skill
Skill(scry:gif-generation) - Video to GIF conversion
Playwright docs: https://playwright.dev/

Links

GitHub Stats

11 forks

Updated 7 days ago