pr-screencast_skill

Overview

This skill records a visual demonstration of the key feature in a pull request by taking screenshots, uploading them to an assets branch, and posting a new GitHub PR comment with the visual walkthrough. It runs autonomously where possible, builds the app, runs a Playwright screencast script, and reports results. The skill uses the TodoWrite tool to track each step of the workflow.

How this skill works

The skill identifies the target PR (argument or current branch), inspects changed files and labels to decide if the PR is user-facing, and skips non-user-facing PRs with a brief comment. For user-facing PRs it creates a Playwright e2e test that captures 2–4 screenshots showing initial state, user actions, and final result, then builds the app, runs the test (with retries), verifies screenshots, uploads them to an assets branch, and posts a new PR comment. All progress steps must be recorded via TodoWrite and each step transitions from in_progress to completed.

When to use it

• You want a quick visual proof of a UI feature introduced by a PR
• The PR contains visible UI changes or user-facing behavior
• You need reproducible screenshots for reviewers or documentation
• You prefer an automated, repeatable workflow to create demonstrations

Best practices

• Only run this skill for PRs that change UI or user-facing behavior; it skips docs/config/test-only PRs
• Use stable selectors (data-testid, role, visible text) when customizing the Playwright script
• Add short waits (500–1000ms) between actions to ensure clear screenshots
• Retry the screencast up to three times on transient failures and capture test logs for troubleshooting
• Keep temporary screencast files isolated and remove them after uploading assets

Example use cases

• Demonstrate a new settings panel introduced in a PR with before/after screenshots
• Show a new form flow or wizard step that requires sequential screenshots
• Capture and share a UI bug fix by recording the broken state and the corrected result
• Provide a visual acceptance artifact for a feature when a maintainer requests a demo