snapshot-approval

Guides owner approval workflow for changed UI snapshot test baselines.

Updated Jun 12, 2026
One-click install
npx skills add https://github.com/missingbulb/GoogleCalendarEventCreator --skill snapshot-approval-missingbulb
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: snapshot-approval
Source: https://github.com/missingbulb/GoogleCalendarEventCreator/tree/main/.claudinite/local/packs/gcec/skills/snapshot-approval
Command: npx skills add https://github.com/missingbulb/GoogleCalendarEventCreator --skill snapshot-approval-missingbulb

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When a change to a requirements case makes UI snapshot tests fail, teams risk silently regenerating golden baselines without review. This Skill enforces a process where moved pixels get explicit owner approval before the baseline is updated. ## Core Features & Use Cases - Visual Diff Surfacing: Reverts the baseline, reruns the failing snapshot test, and presents expected, actual, and diff images for review, including side-by-side stitching when PNG dimensions change. - Structured Approval Flow: Uses an interactive question prompt with Approve and Reject options so the owner is notified and decides explicitly. - Honest Pending State: Commits the reverted expected baseline while waiting so the branch shows the snapshot test red and pending approval, never a silently updated baseline. - Use Case: A fixture change shrinks a rendered component and the snapshot suite fails. Use this Skill to present the visual diff to the owner, get approval, then regenerate the baseline with the refresh command and push a green suite. ## Quick Start Ask the assistant to run the snapshot-approval process for the failing UI snapshot test and get owner sign-off on the new baseline.

Frequently Asked Questions about snapshot-approval

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

FAQPage Schema
How do I handle a failing UI snapshot test after a rendering change?

Revert the baseline to the committed expected PNG, rerun the snapshot test so it fails and writes actual and diff artifacts, then present expected, actual, and diff images to the owner for an explicit approve or reject decision before regenerating.

What is the right way to update a golden snapshot baseline?

Update the baseline only after owner approval. On approval, regenerate with the refresh command (npm run refresh:ui), confirm the suite is green, and push. Never commit a new baseline silently before review.

Why is there no diff image when snapshot dimensions change?

Pixelmatch cannot diff images of unequal sizes, so the harness writes only the actual image. In that case, stitch the expected and actual PNGs side-by-side into one image for the owner review.

Should I commit the new snapshot baseline while waiting for approval?

No. If the working tree must be committed while pending, commit the reverted expected baseline so the branch honestly shows the snapshot test red and pending approval, rather than masking the change.

What happens if the owner rejects the snapshot change?

Do not roll back automatically. Leave the rendering change in place and discuss how to proceed with the owner, since rejection means the visual change itself needs reconsideration.