Visual testing glossary
Plain definitions for the vocabulary of visual regression testing — baseline, checkpoint, snapshot, threshold, masking, TurboSnap, perceptual diff, flake, and the rest.
Vendors use different words for the same thing and the same word for different things — "snapshot" and "checkpoint" are billed units at one company and technical concepts at another. These are the definitions as the field actually uses them.
Core concepts
| Term | Definition |
|---|---|
| Visual regression testing | Capturing images of an interface, storing approved ones as baselines, and comparing every later build to detect unintended visual change. See the full guide. |
| Baseline | The approved reference image a new capture is compared against. Everything a visual suite reports is relative to it. See managing baselines. |
| Snapshot | One captured image. Also the billing unit at Chromatic and Percy. Not the same as a Jest snapshot test, which serialises markup to text. |
| Checkpoint | Applitools' term for one comparison. Priced differently for pages and components, which is the main thing to understand about their pricing. |
| Diff | The computed difference between a capture and its baseline, usually rendered as a highlighted overlay. |
| Approval | Promoting a changed capture to become the new baseline. The moment a visual change — intended or not — becomes permanent. |
| Drift | Baselines becoming stale because they are not recaptured as the product changes, until every comparison reports legitimate differences and reviewers approve in bulk. |
Comparison
| Term | Definition |
|---|---|
| Pixel diffing | Comparing images pixel by pixel. Simple and noisy — browsers are not deterministic enough for exact matching. |
| Perceptual diffing | Comparing what a human would notice rather than raw pixel values, so antialiasing differences are ignored. Applitools' "Visual AI" is the best-known implementation. See AI visual testing tools. |
| Threshold | How different a pixel must be before it counts as changed. Playwright's threshold is a per-pixel colour tolerance from 0 to 1. |
| maxDiffPixels / maxDiffPixelRatio | How many changed pixels are allowed before the test fails. The ratio form is better — it scales sensibly across viewport sizes. |
| Anti-aliasing detection | Ignoring the smoothed edge pixels around text and shapes, which vary between runs. On by default in pixelmatch. |
| Masking / ignore region | Excluding an area from comparison because it legitimately changes — a timestamp, avatar, or ad slot. Every mask is coverage given up. |
| False positive | A reported difference that is not a real regression. The main reason visual suites get abandoned. |
Capture
| Term | Definition |
|---|---|
| Viewport | The browser window dimensions a capture is taken at. See choosing viewports. |
| Device scale factor | The pixel density multiplier. At 2, images are twice the dimensions — pin it explicitly or retina laptops and CI runners disagree. |
| Full-page vs viewport capture | Whether the screenshot includes content below the fold. Full-page images are larger and diff on any change above the fold. |
| Element capture | Screenshotting one component rather than the page. Smaller, more stable, and blind to how the component sits in context. |
| DOM snapshotting | Capturing the DOM and CSS and re-rendering server-side rather than shipping pixels. Percy's approach; allows re-rendering at several widths from one capture. |
| Page readiness | Whether the page has finished becoming itself — fonts loaded, data arrived, animation settled — before capture. The root cause of most flake. |
| Stabilisation | The work of making a page render identically every run: disabling animation, freezing clocks, seeding randomness, stubbing data. |
Workflow
| Term | Definition |
|---|---|
| Flake | A test reporting a difference when nothing changed. Almost always non-determinism in the page, not imprecision in the comparison. See fixing flaky visual tests. |
| Change impact analysis | Working out which routes a code change can affect so only those are recaptured. The largest available saving in a visual pipeline. |
| TurboSnap | Chromatic's implementation of the above for Storybook: unchanged stories are copied rather than recaptured, typically cutting billed snapshots by 70–90%. |
| Sharding | Splitting a suite across parallel CI runners. Use fail-fast: false or one failing shard cancels the rest. |
| Blocking vs non-blocking | Whether a visual difference fails the build. Run non-blocking for the first few weeks while removing noise. See visual testing in CI/CD. |
| Coverage authoring | Who creates the list of what gets tested — you, your Storybook stories, or the tool. The question that best predicts whether a suite survives its first year. |
Easily confused
Snapshot testing vs visual regression testing
Snapshot testing serialises a component's rendered markup to text and diffs the text. No browser, no CSS, no layout. It passes even when a stylesheet fails to load entirely. Visual regression testing compares rendered images. They catch completely different classes of bug — full comparison in screenshot testing vs visual regression testing.
Screenshot testing vs visual regression testing
Screenshot testing is the capture mechanism. Visual regression testing is the practice built around it: baselines, comparison, triage, approval, and coverage management. Taking the picture is the easy half.
Cross-browser vs cross-platform
Cross-browser means different engines — Chromium, Gecko, WebKit. Cross-platform means different operating systems, which changes font rendering even within the same browser. The second is why a baseline recorded on macOS fails on a Linux runner.
Component-level vs page-level
Component-level captures a component in isolation, usually from a Storybook story — stable, cheap, and blind to composition. Page-level opens a real route with real data — closer to what customers see, harder to keep deterministic.
Frequently asked questions
What is a baseline image in visual testing?
The approved reference screenshot that later captures are compared against. Everything a visual suite reports is relative to it, so a stale baseline makes the whole suite unreliable — recapture it on every merge to the default branch.
What is the difference between a snapshot and a checkpoint?
They usually mean the same thing — one captured image compared against a baseline — but they are different vendors' billing units. Chromatic and Percy count snapshots; Applitools counts checkpoints and prices page checkpoints very differently from component checkpoints.
What does masking mean in visual testing?
Excluding a region from comparison because it legitimately changes between runs, such as a timestamp, avatar, or embedded third-party widget. It is a last resort, because every masked region is coverage you have given up.