github-pr-screenshot-embedlisted
Install: claude install-skill damson/hard-won-skills
# Embed screenshots in a GitHub PR (private repos)
Private-repo image embeds break in one specific, silent way: the image host you
pick decides whether the browser can authenticate. Get the host wrong and every
reviewer sees a broken-image icon while the link looks correct to you (your
browser is already authenticated).
The rule: **use `github.com/<owner>/<repo>/raw/<sha>/<path>`, pinned to a commit
SHA.** GitHub authenticates that host with the reader's browser cookies, so
anyone with repo access renders it.
## Procedure
### 1. Commit the image into the PR branch
Commit the screenshot into the repo (e.g. under `docs/screenshots/`) on the PR
branch and push. You need its path and the **commit SHA** that contains it:
```bash
git rev-parse HEAD # the SHA to pin
```
### 2. Build the embed URL
```
https://github.com/<owner>/<repo>/raw/<sha>/<path-to-image>
```
Use it in standard markdown in the PR description or comment:
```markdown
| Before | After |
|---|---|
|  |  |
```
**Never use `raw.githubusercontent.com`** for a private repo. That host is
token-authenticated only and never receives browser cookies, so the embed is a
broken image for every reader even though it resolves for you via a token.
### 3. Pin the SHA, never the branch
Use the commit SHA in the path, not the branch name. A squash-merge deletes the
b