capture-screenshots

Captures before/after UI screenshots across Android, iOS, and Web for PR visual comparison.

Updated Apr 21, 2026
One-click install
npx skills add https://github.com/Zeyad-37/tech-agency --skill capture-screenshots-zeyad-37
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: capture-screenshots
Source: https://github.com/Zeyad-37/tech-agency/tree/main/.claude/skills/capture-screenshots
Command: npx skills add https://github.com/Zeyad-37/tech-agency --skill capture-screenshots-zeyad-37

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? UI changes in pull requests often lack visual evidence, forcing reviewers to manually run the app to verify appearance. This Skill automates before/after screenshot capture against the base branch and feature branch, producing a markdown comparison table for PR review. ## Core Features & Use Cases - Multi-platform capture: Runs Paparazzi for Android (Compose), swift-snapshot-testing for iOS (SwiftUI), and Playwright for Web (React/Next.js), detecting affected platforms from changed files. - Safe base-branch capture: Uses a detached git worktree pinned to origin/<base> instead of stash/checkout, so the current worktree is never mutated. - Explicit outcome tokens: Emits SCREENSHOTS_CAPTURED, SCREENSHOTS_TOOLING_MISSING, or SCREENSHOTS_NO_UI_DETECTED so callers like /create-pr can branch reliably. - Use Case: A developer opens a PR that changes a Compose screen and a Next.js page; the skill captures golden images on both branches and generates a Visual Changes table with light, dark, and mobile variants. ## Quick Start Ask the assistant to capture before and after screenshots for the current UI changes against the main branch and generate a visual comparison table for the PR.

Frequently Asked Questions about capture-screenshots

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

FAQPage Schema
How do I capture before and after screenshots for a UI pull request?▼

Run the capture flow against your feature branch: it detects affected platforms from changed files, checks out the base branch in a detached git worktree, runs the platform screenshot tooling in both trees, and generates a markdown Visual Changes comparison table.

What screenshot testing tools work for Android, iOS, and Web?▼

Paparazzi handles JVM-only screenshot testing for Jetpack Compose without an emulator, swift-snapshot-testing captures SwiftUI previews via xcodebuild, and Playwright takes headless browser screenshots of React or Next.js pages including dark mode and mobile viewports.

Can I diff screenshots against a branch other than main?▼

Yes, pass --base <branch> to diff against any base such as an epic integration branch. Without the flag, the base defaults to the remote HEAD branch, and all captures run against origin/<base> rather than a local ref.

Why use a git worktree instead of stash and checkout for before screenshots?▼

git stash pop on a clean tree can pop someone else's stash since the stash stack is shared across worktrees, and checkout of the default branch fails when it is already checked out elsewhere. A detached worktree avoids both problems and never mutates the current tree.

What happens if Paparazzi or Playwright is not configured in my project?▼

The skill detects missing tooling by grepping build files and package.json, then emits the SCREENSHOTS_TOOLING_MISSING token and prints manual capture instructions. It never reports success for platforms where no screenshots exist on disk.