YAS PR screenshots
SkillDocs & knowledgeLets your agent create before/after screenshot images of terminal UI changes and add them to a pull request.
Available today. Use it from your connected AI after setup.
No other account needed.
Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.
Then ask your AI: use the YAS PR screenshots skill
About this skill
Generate before/after PNG screenshots for a YAS branch's rendering changes, push them to the yas-pr-screenshots repo, and hand back a markdown before/after table for the PR description. Use when the user wants real image screenshots (not ANSI-stripped text) attached to a YAS pull request, or asks to
What this skill tells your AI
The instructions your AI receives, as published by tmck-code/yet-another-statusline in .claude/skills/yas-pr-screenshots/SKILL.md and read by ahel’s review.
Render the statusline on main ("before") and on the current branch ("after") as
deterministic PNGs, publish them to the public tmck-code/yas-pr-screenshots repo,
and emit a markdown table that another worker (e.g. the yas-pr skill or a
gh pr edit) drops into the PR body. PNGs come from DEMO_ONLY=<scenario> make demo/img (via ops/ansi_png.py — needs ImageMagick magick + a Mono Nerd Font).
Steps
-
Resolve
<pr_id>. If the current branch already has a PR, use its number (gh pr view --json number -q .number). Otherwise predict the next one:gh pr list --state all --limit 1 --json number -q '.[0].number'+ 1. -
Locate the screenshots checkout. Use
$YAS_PR_SCREENSHOTS_DIRif set, else a sibling../yas-pr-screenshots, else clonegit@github.com:tmck-code/yas-pr-screenshots.git. Ensure it's onmainand clean (git -C <dir> pull --ff-only).*.pngis LFS-tracked there. -
Pick variants. Always shoot
kitchen-sink. Then readgit diff --stat main...HEAD(and the diff) and add the variants most relevant to what changed — map area → variant:Branch touches Add variant LABEL:SCENARIO:ENVsubagents / openspec / tasks / workflows subagents:subagents:·openspec:openspec:·tasks:tasks:·workflows:workflows:context fill / soft limit / token window full-context:full-context:(orYAS_SOFT_LIMIT=)config parsing / errors config-error:config-error:narrow width / truncation narrow:kitchen-sink:YAS_MAX_WIDTH=40full width full-width:kitchen-sink:YAS_FULL_WIDTH=1justify / labels justify:kitchen-sink:YAS_JUSTIFY=1·labels:kitchen-sink:YAS_LABELS=1theme / gradient / colour theme-<name>:kitchen-sink:YAS_THEME=<name>glyph mode github:kitchen-sink:YAS_GLYPH_MODE=githubmodel / thinking opus-thinking:opus-thinking:·sonnet-thinking:sonnet-thinking:Use the same ENV on both sides so the diff is purely the content change. Scenario names:
ops/demo.pySCENARIOS(kitchen-sink, tasks, openspec, subagents, workflows, full-context, config-error, sonnet-thinking, opus-thinking, …). -
Render + stage. From the YAS repo root run the helper with the chosen variants:
.claude/skills/yas-pr-screenshots/scripts/shoot.sh <pr_id> <screenshots_dir> \ 'kitchen-sink:kitchen-sink:' 'narrow:kitchen-sink:YAS_MAX_WIDTH=40' 'subagents:subagents:'For each variant it renders after (current tree) and before (a throwaway
mainworktree), then combines the pair into ONE wide PNG — before and after side by side, each half topped by a small "before" / "after" heading, joined by a visible vertical separator strip (ImageMagickmagick, deterministic). The combined image lands atscreenshots/<pr_id>/<label>.png(the raw halves are also kept underscreenshots/<pr_id>/{before,after}/for reference, but the table embeds only the combined image). It prints the markdown table to stdout: a blank-headed left column holding the variant label, one row per variant. A before render that fails (scenario new to the branch) yields a "(not on main)" placeholder left half instead of aborting.| | before / after | |--|----------------| | <label> |  |When the change is theme-wide, use the same scenario (usually
kitchen-sink) across all rows and vary onlyYAS_THEME, labelling each row with the theme name. -
Commit + push (outward-facing — confirm with the user first):
git -C <dir> add screenshots/<pr_id> git -C <dir> commit -m "screenshots: PR #<pr_id> before/after (<branch>)" git -C <dir> push origin main -
Hand off the table. Output the table from step 4 verbatim as the final result so the PR-authoring worker can paste it into the Screenshots / recording section. Do not edit the PR body yourself — that's the next worker's job.
Notes
- Images render only after the push lands (GitHub's LFS/image proxy may lag a few seconds).
- The embed URL is
.../blob/main/screenshots/<pr_id>/<label>.png?raw=true— the?raw=trueblob form resolves LFS pointers correctly whereraw.githubusercontent.comdoesn't. - Prerequisite:
magickon PATH (also used for the combine step) and a Mono Nerd Font installed (seeops/ansi_png.pyenv knobs).
Signals
- GitHub stars
- 242
- Forks
- 24
- Last commit
- Sep 2026
Advanced
- Item type
- skill
- Key
yas-pr-screenshots- Source
- github.com/tmck-code/yet-another-statusline