Skip to content

Commit 1faadc6

Browse files
pftgclaude
andcommitted
fix: action report filename mismatch + README round 2 improvements
Bug fix: - Composite action checked for `index.html` but gem generates `snap_diff_report.html` — report was never found in CI README improvements (from 3-reviewer round 2): - Add prerequisites note (Capybara + browser driver required) - Add non-Rails setup section (Hugo/Jekyll/static sites) - Convert Quick Start to numbered steps with directory tree output - Reformat FAQ with collapsible details for scannability - Add "Will this slow down my tests?" FAQ entry - Rename "Advanced Topics" to "Docs" (Framework Setup isn't advanced) - Remove Docker Testing from docs list (internal dev concern) - Fix Requirements to show non-Rails is supported Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent f9ae0cf commit 1faadc6

2 files changed

Lines changed: 69 additions & 22 deletions

File tree

.github/actions/upload-screenshots/action.yml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ runs:
4141
id: check-report
4242
shell: bash
4343
run: |
44-
if [ -f "${{ inputs.report-path }}/index.html" ]; then
44+
if [ -f "${{ inputs.report-path }}/snap_diff_report.html" ]; then
4545
echo "exists=true" >> "$GITHUB_OUTPUT"
4646
else
4747
echo "exists=false" >> "$GITHUB_OUTPUT"
@@ -50,7 +50,7 @@ runs:
5050
- name: Prepare HTML report for inline preview
5151
if: steps.check-report.outputs.exists == 'true'
5252
shell: bash
53-
run: cp "${{ inputs.report-path }}/index.html" "${{ inputs.report-path }}/${{ inputs.name }}-snap_diff-report.html"
53+
run: cp "${{ inputs.report-path }}/snap_diff_report.html" "${{ inputs.report-path }}/${{ inputs.name }}-snap_diff-report.html"
5454

5555
- name: Upload HTML report (inline preview)
5656
id: upload-report

README.md

Lines changed: 67 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,14 @@
44

55
# Capybara::Screenshot::Diff
66

7-
Stop shipping UI bugs. Take screenshots in your Rails tests, commit baselines to git, and let CI catch visual regressions in pull requests — no cloud service, no subscription, runs entirely in your test suite.
7+
Stop shipping UI bugs. Take screenshots in your Capybara tests, commit baselines to git, and let CI catch visual regressions in pull requests — no cloud service, no subscription, runs entirely in your test suite.
88

9-
**Why this gem?** Percy and Chromatic cost money and send your screenshots to a third party. BackstopJS requires Node. This gem integrates directly into your Capybara tests, stores baselines in git, and works offline.
9+
**Why this gem?** Baselines live in git alongside your code — no external service, no account to sign up for, works offline. Unlike Percy/Chromatic (paid SaaS), this runs locally. Unlike BackstopJS, no Node required.
1010

1111
## Quick Start
1212

13+
> **Prerequisites:** A working Capybara setup with a browser driver (e.g., selenium-webdriver + Chrome). See [Rails System Testing guide](https://guides.rubyonrails.org/testing.html#system-testing) if you don't have one yet.
14+
1315
```ruby
1416
# Gemfile
1517
gem 'capybara-screenshot-diff'
@@ -38,19 +40,39 @@ class HomepageTest < ApplicationSystemTestCase
3840
end
3941
```
4042

43+
Then run these steps in order:
44+
4145
```bash
42-
bundle exec rake test # First run always passes — saves baselines
46+
# Step 1: Save baselines (first run always passes)
47+
bundle exec rake test
48+
49+
# Step 2: Commit baselines to git
4350
git add doc/screenshots/
4451
git commit -m "chore: add screenshot baselines"
45-
bundle exec rake test # Second run compares against committed baselines
52+
53+
# Step 3: Now comparisons work — change your UI and re-run
54+
bundle exec rake test
4655
```
4756

48-
First run saves baseline screenshots to `doc/screenshots/` (always passes). Commit them to git. Subsequent runs compare against committed baselines — if the UI changed, the test fails.
57+
After Step 1, you'll see:
58+
```
59+
doc/screenshots/
60+
homepage.png <- your baseline (commit this)
61+
```
4962

50-
> **CI note:** `fail_if_new` is `true` by default in CI — new screenshots without a committed baseline will fail. Always commit baselines before pushing.
63+
If you skip Step 2 and push to CI, the build will fail — `fail_if_new` is `true` by default in CI.
5164

5265
For RSpec, Cucumber, or non-Rails setup, see [Framework Setup](docs/framework-setup.md).
5366

67+
### For Non-Rails Projects (Hugo, Jekyll, Static Sites)
68+
69+
```ruby
70+
require 'capybara_screenshot_diff/static'
71+
CapybaraScreenshotDiff.serve("_site") # or "public", "build", "dist"
72+
```
73+
74+
Then commit baselines to git just like Rails. [Full setup](docs/ci-integration.md#non-rails-projects-hugo-jekyll-static-sites).
75+
5476
## What Happens When a Screenshot Changes
5577

5678
The test fails with a clear message and generates diff files:
@@ -116,39 +138,64 @@ If screenshots differ between CI and local, set a comparison threshold:
116138

117139
```ruby
118140
Capybara::Screenshot::Diff.configure do |screenshot, diff|
119-
screenshot.window_size = [1280, 1024]
120-
diff.perceptual_threshold = 2.0 # Recommended for VIPS — ignores anti-aliasing
121-
# or: diff.tolerance = 0.001 # Default for VIPS, percentage-based
141+
screenshot.window_size = [1280, 1024] # consistent viewport
142+
diff.perceptual_threshold = 2.0 # ignore anti-aliasing (VIPS only)
143+
# or: diff.tolerance = 0.001 # percentage-based (default for VIPS)
122144
end
123145
```
124146

125147
See [Choosing the Right Method](docs/configuration.md#choosing-the-right-color-comparison-method) for detailed comparison options.
126148

127-
## Common Questions
149+
## FAQ
150+
151+
<details>
152+
<summary><strong>The test passed on first run. Did it work?</strong></summary>
153+
154+
Yes. First run saves baselines and always passes. Run tests again to compare against committed baselines.
155+
</details>
156+
157+
<details>
158+
<summary><strong>How do I update baselines after intentional UI changes?</strong></summary>
159+
160+
Delete the baseline file and re-run tests: `rm doc/screenshots/homepage.png && bundle exec rake test`. Or update all: `rm -rf doc/screenshots/ && bundle exec rake test`.
161+
</details>
128162

129-
**Why did my test pass on the first run?** First run always passes and saves baselines. Run again to compare.
163+
<details>
164+
<summary><strong>CSS animations make my screenshots flaky</strong></summary>
130165

131-
**How do I update baselines?** Delete the baseline file and re-run tests. Or delete all: `rm -rf doc/screenshots/ && bundle exec rake test`.
166+
Enable `Capybara::Screenshot.disable_animations = true` to freeze CSS animations/transitions before each capture. Or use `stability_time_limit: 1` to wait for animations to finish.
167+
</details>
132168

133-
**Animations make screenshots flaky**`Capybara::Screenshot.disable_animations = true` freezes CSS animations/transitions before each capture.
169+
<details>
170+
<summary><strong>CI screenshots differ from local</strong></summary>
134171

135-
**CI screenshots differ from local** — Set `window_size` for consistent dimensions and use `perceptual_threshold: 2.0` to ignore rendering differences.
172+
Set `window_size` for consistent dimensions and use `perceptual_threshold: 2.0` to ignore anti-aliasing differences across environments.
173+
</details>
136174

137-
**Debug mode**`DEBUG=1 bundle exec rake test` keeps `.diff.png` files for inspection.
175+
<details>
176+
<summary><strong>Will this slow down my tests?</strong></summary>
177+
178+
Comparisons add ~50ms per image with VIPS. Without `ruby-vips`, ChunkyPNG is used (slower but no system dependency). `stability_time_limit` adds wait time — keep it low (0.1-0.5s) or use `disable_animations` instead.
179+
</details>
180+
181+
<details>
182+
<summary><strong>Debug mode</strong></summary>
183+
184+
`DEBUG=1 bundle exec rake test` keeps `.diff.png` files for inspection.
185+
</details>
138186

139187
## Installation
140188

141-
**Requirements:** Ruby 3.2+, Rails 7.1+. For the `:vips` driver: [libvips 8.9+](https://libvips.github.io/libvips/install.html).
189+
**Requirements:** Ruby 3.2+. Rails 7.1+ for Rails integration; non-Rails projects supported via `CapybaraScreenshotDiff.serve()`. For the `:vips` driver: [libvips 8.9+](https://libvips.github.io/libvips/install.html).
142190

143-
## Advanced Topics
191+
## Docs
144192

145193
- [Framework Setup](docs/framework-setup.md) — Minitest, RSpec, Cucumber
194+
- [CI & Non-Rails Integration](docs/ci-integration.md) — GitHub Actions, reusable action, static sites, baseline updates
195+
- [Configuration Reference](docs/configuration.md) — all options explained
146196
- [Image Processing Drivers](docs/drivers.md) — VIPS, ChunkyPNG, perceptual threshold
147197
- [Screenshot Organization](docs/organization.md) — groups, sections, cropping, multi-browser
148-
- [Configuration Reference](docs/configuration.md) — all options explained
149198
- [Web UI & Custom Reporters](docs/reporters.md) — interactive report, custom reporters
150-
- [CI & Non-Rails Integration](docs/ci-integration.md) — GitHub Actions, reusable action, baseline updates
151-
- [Docker Testing](docs/docker-testing.md) — bin/dtest, recording baselines
152199

153200
## Development
154201

0 commit comments

Comments
 (0)