Post visual diff images as PR comment on failure
When visual tests fail on a PR, upload each diff PNG to GitHub's CDN via the issue assets endpoint and post a comment with the images embedded inline. Also fixes the artifact upload path to point at .vitest-attachments/ where the actual/diff files live. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
2829ec2137
commit
7c74626464
1 changed files with 35 additions and 1 deletions
36
.github/workflows/ci.yml
vendored
36
.github/workflows/ci.yml
vendored
|
|
@ -138,14 +138,48 @@ jobs:
|
||||||
run: pnpm exec playwright install-deps chromium
|
run: pnpm exec playwright install-deps chromium
|
||||||
|
|
||||||
- name: Run visual regression tests
|
- name: Run visual regression tests
|
||||||
|
id: visual-tests
|
||||||
run: pnpm --filter @trails-cool/planner test:visual
|
run: pnpm --filter @trails-cool/planner test:visual
|
||||||
|
|
||||||
|
- name: Post diff comment on PR
|
||||||
|
if: failure() && steps.visual-tests.outcome == 'failure' && github.event_name == 'pull_request'
|
||||||
|
env:
|
||||||
|
GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
run: |
|
||||||
|
diffs=$(find apps/planner/.vitest-attachments -name "*-diff-*.png" 2>/dev/null | sort)
|
||||||
|
if [ -z "$diffs" ]; then exit 0; fi
|
||||||
|
|
||||||
|
body="## Visual regression failures"$'\n\n'
|
||||||
|
body+="| Test | Diff (reference → actual) |"$'\n'
|
||||||
|
body+="|------|--------------------------|"$'\n'
|
||||||
|
|
||||||
|
for diff in $diffs; do
|
||||||
|
# Upload image to GitHub's CDN via the issue assets endpoint
|
||||||
|
response=$(curl -sf -X POST \
|
||||||
|
-H "Authorization: Bearer $GH_TOKEN" \
|
||||||
|
-H "Content-Type: image/png" \
|
||||||
|
-H "Accept: application/json" \
|
||||||
|
--data-binary @"$diff" \
|
||||||
|
"https://uploads.github.com/repos/${{ github.repository }}/issues/${{ github.event.pull_request.number }}/assets?name=$(basename $diff)")
|
||||||
|
url=$(echo "$response" | jq -r '.url // empty')
|
||||||
|
name=$(basename "$diff" | sed 's/-diff-chromium-linux\.png//' | sed 's/-/ /g')
|
||||||
|
if [ -n "$url" ]; then
|
||||||
|
body+="| \`$name\` |  |"$'\n'
|
||||||
|
else
|
||||||
|
body+="| \`$name\` | *(upload failed)* |"$'\n'
|
||||||
|
fi
|
||||||
|
done
|
||||||
|
|
||||||
|
body+=$'\n'"Run \`pnpm --filter @trails-cool/planner test:visual:update\` to regenerate snapshots if the change is intentional."
|
||||||
|
|
||||||
|
gh pr comment ${{ github.event.pull_request.number }} --body "$body"
|
||||||
|
|
||||||
- name: Upload screenshots on failure
|
- name: Upload screenshots on failure
|
||||||
if: failure()
|
if: failure()
|
||||||
uses: actions/upload-artifact@v7
|
uses: actions/upload-artifact@v7
|
||||||
with:
|
with:
|
||||||
name: visual-snapshots-diff
|
name: visual-snapshots-diff
|
||||||
path: apps/planner/app/**/__screenshots__/
|
path: apps/planner/.vitest-attachments/
|
||||||
retention-days: 7
|
retention-days: 7
|
||||||
|
|
||||||
e2e:
|
e2e:
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue