Switch to job summary for diff images (base64 data URIs)

This commit is contained in:
Ullrich Schäfer 2026-05-10 21:47:13 +02:00
parent de21ca4779
commit 53663ff59f
No known key found for this signature in database
GPG key ID: A32FF691A0F752D9

View file

@ -144,38 +144,43 @@ jobs:
id: visual-tests
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 }}
VISUAL_DIFF_TOKEN: ${{ secrets.VISUAL_DIFF_TOKEN }}
- name: Write diff images to job summary
if: failure() && steps.visual-tests.outcome == 'failure'
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'
echo "## Visual regression failures" >> $GITHUB_STEP_SUMMARY
echo "" >> $GITHUB_STEP_SUMMARY
for diff in $diffs; do
name=$(basename "$diff" | sed 's/-diff-chromium-[a-z]*\.png//' | sed 's/-/ /g')
response=$(curl -s -w "\n%{http_code}" -X POST \
-H "Authorization: Bearer $VISUAL_DIFF_TOKEN" \
-H "Accept: application/json" \
-F "file=@$diff;type=image/png" \
"https://uploads.github.com/repos/${{ github.repository }}/issues/${{ github.event.pull_request.number }}/assets?name=$(basename $diff)")
http_code=$(echo "$response" | tail -1)
body_resp=$(echo "$response" | head -1)
echo "Upload HTTP $http_code: $body_resp"
url=$(echo "$body_resp" | jq -r '.url // empty')
if [ -n "$url" ]; then
body+="| \`$name\` | ![$name]($url) |"$'\n'
else
body+="| \`$name\` | *(upload failed)* |"$'\n'
fi
b64=$(base64 -w 0 "$diff")
echo "### \`$name\`" >> $GITHUB_STEP_SUMMARY
echo "<img src=\"data:image/png;base64,$b64\" alt=\"$name diff\" style=\"max-width:100%\">" >> $GITHUB_STEP_SUMMARY
echo "" >> $GITHUB_STEP_SUMMARY
done
echo "To update snapshots if the change is intentional:" >> $GITHUB_STEP_SUMMARY
echo '```' >> $GITHUB_STEP_SUMMARY
echo "pnpm --filter @trails-cool/planner test:visual:update" >> $GITHUB_STEP_SUMMARY
echo '```' >> $GITHUB_STEP_SUMMARY
body+=$'\n'"To update snapshots if the change is intentional:"$'\n'
- 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
run_url="https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }}"
body="## Visual regression failures"$'\n\n'
body+="The following tests produced screenshot diffs:"$'\n\n'
for diff in $diffs; do
name=$(basename "$diff" | sed 's/-diff-chromium-[a-z]*\.png//' | sed 's/-/ /g')
body+="- \`$name\`"$'\n'
done
body+=$'\n'"**[View diff images in the job summary]($run_url)**"$'\n\n'
body+="To update snapshots if the change is intentional:"$'\n'
body+="\`\`\`"$'\n'
body+="pnpm --filter @trails-cool/planner test:visual:update"$'\n'
body+="\`\`\`"