Visual regression
Coverli photographs the states other tools can't reach.
Every visual testing tool can photograph a button. We photograph the button, the menu it opens, the dialog behind it, and the focus ring a keyboard user depends on — automatically, on every commit, with no test code to write.
Differentiator 01
State screenshots, automatically.
Our engine already walks every component the way an assistive-technology user does: it focuses, activates, toggles and arrows through options. Visual capture rides that same walk, so the states other tools make you script by hand are ones we are already performing.
Every captured state diffs against its own approved baseline. New states appear for approval; removed states are flagged — a menu that stopped opening is a removed state, not a silent pass.
state filmstrip · Select.stories.jsx
4 frames capturedSelect, closed
Trigger holds keyboard focus
- Newest first
- Oldest first
Listbox open, option 1 active
- Newest first
- Oldest first
Option committed
No interaction test code. The engine already opens, focuses and toggles every component to test what it announces — the shutter simply opens at the peak of each state.
focus capture · Button.stories.jsx
WCAG 2.4.7- :focus-visible { outline: 2px solid; }+ *:focus { outline: none; }
The focus indicator is gone. Invisible to your users' eyes, invisible to a resting-state screenshot — captured here because we photograph the element while it holds focus.
Differentiator 02
Focus states, photographed.
Focus indicators are the most commonly destroyed accessibility feature on the web. One global reset, one outline: none in a refactor, and keyboard users are navigating blind.
Enable focus capture and every interactive element is photographed at the moment it holds keyboard focus. Each frame diffs like any other capture, so “the focus ring got fainter” is a reviewable change with a before and after, tied to the exact commit.
Differentiator 03
Zero-flake by construction.
No threshold tuning. No “ignore anti-aliasing” checkbox. Unchanged code produces byte-identical captures — that isn't a goal, it's how the capture works.
- Frozen clock
- Time does not advance during capture, so nothing animates between runs.
- Parked animations
- Every transition is held at a fixed frame before the shutter opens.
- Hidden caret
- The text cursor never blinks its way into a diff.
- Settled fonts
- Capture waits until every face has loaded and laid out.
- Pinned rendering
- Viewport and pixel density are fixed, in one controlled environment.
- The flake guard
- When a difference is found we recapture and compare our own two captures first. If the story disagrees with itself, it is flagged unstable — a distinct signal pointing at the story, never a fake red diff.
Whitespace never pollutes review: components are auto-trimmed for display without altering the stored evidence, and a component that changed size is reported as exactly that — “grew 12px taller” — not as a smear of ten thousand changed pixels.
Differentiator 04
The rejection arrives with the pixels circled.
Reviewers annotate in two gestures: click to drop a numbered marker, drag to flag a region — on the resting capture or any interaction-state frame.
When a reviewer rejects with flagged regions, we compose the evidence image and embed it directly in the pull request comment, numbered to match the written reasons. The comment lists every rejected story, so the full set of blockers is one read.
pull request comment · coverli
rejected · 2 storiesConfirm deletion
This removes the component and its baselines.
- 1
Focus ring missing on the primary action.
- 2
Dialog header shifted 2px — heading no longer aligns to the grid.
The engineer who broke it sees exactly what the reviewer saw — in the pull request, with no login and no tab-switch.
Included, not invoiced
One pipeline. One review. One price.
Visual regression runs inside the tier you already pay for. Unchanged stories are skipped by change detection and cost nothing; the comparison itself adds nothing to your bill.