update-screenshots

Updates committed blocks-ci screenshot hash baselines from CI job output.

Updated Apr 14, 2026
One-click install
npx skills add https://github.com/jimeh/hucode --skill update-screenshots-jimeh
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: update-screenshots
Source: https://github.com/jimeh/hucode/tree/main/.github/skills/update-screenshots
Command: npx skills add https://github.com/jimeh/hucode --skill update-screenshots-jimeh

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When the "Screenshots & Tests" CI check fails because component screenshot hashes changed, developers must manually locate the new hashes, verify the visual change is intentional, and update the committed baseline file. This Skill guides that entire workflow without regenerating hashes locally, which would produce incorrect values. ## Core Features & Use Cases - Hash retrieval from CI: Pulls updated screenshot hashes from the PR comment, job summary, or job log using the GitHub CLI. - Visual verification: Fetches old and new images by hash from the screenshot service and computes a pixel-diff bounding box with Python and Pillow to confirm the change is intentional. - Baseline update: Edits only the changed lines in test/componentFixtures/blocks-ci-screenshots.md while preserving its auto-generated format, then commits so the check passes. - Use Case: A PR fails the "Screenshots & Tests" check with a blocks-ci hash mismatch. Run this Skill to extract the new hashes from the CI job, diff the images to confirm the shift matches the PR's intent, and commit the corrected baseline file. ## Quick Start Update the blocks-ci screenshot hashes for my PR after the Screenshots & Tests check failed, verifying the image diffs before committing the new baseline.

Frequently Asked Questions about update-screenshots

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

FAQPage Schema
How do I update screenshot baselines after a CI failure?▼

Copy the updated hashes from the CI job summary, PR comment, or job log into the committed baseline file, then commit and push. Never regenerate hashes locally, since rendering on macOS or Windows produces different bytes than the ubuntu-latest CI runner.

How do I get the failed CI job log with the GitHub CLI?▼

Find the job id with `gh pr checks <PR> --json name,link,bucket`, then download the log with `gh api repos/<owner>/<repo>/actions/jobs/<JOB_ID>/logs`. Grep for `##[error]` lines to locate the hash mismatch details.

Why do locally generated screenshot hashes fail CI?▼

The hashes are computed from rendered PNG bytes produced on ubuntu-latest. Rendering the same fixture on macOS or Windows yields different pixel bytes and therefore different hashes, so locally generated values will always mismatch in CI.

How can I compare two screenshot images for differences?▼

Download both images by hash from the screenshot service with curl, then use Python with Pillow's ImageChops.difference to compute a bounding box of changed pixels. This localizes the delta instead of eyeballing full screenshots.

When should I not accept new screenshot hashes?▼

Do not accept new hashes when the changed fixture is unrelated to the PR or the visual shift is larger than expected, since that indicates a layout regression. Also, hash updates cannot fix fixtures that failed to render or Playwright test failures.