Technology & Testing More detail B · Official guidance Platform: Web

Visual Regression Test

A visual regression test compares today's rendered image with an approved reference image under the same browser conditions.

See how it works
You might call it Visual Regression Test

See how it works

Original worked exampleVisual Regression Test

Another example

A checkout screenshot is compared with its approved reference in a fixed browser setup. A cut-off keyboard focus ring appears as a pixel difference for review. Approving every changed image without checking is not regression testing.

Main parts

  1. 01controlled renderer
  2. 02approved baseline
  3. 03reviewable diff

Use it when

Use this term for visible changes that are hard to check from DOM values alone.

Do not use it when

Do not hide unstable images with a wide pixel limit or replace meaning and behavior checks with screenshots.

Name used in code

current screenshot Δ approved baseline

Before you ship

Check the environment and prepared test data (fixture). Define a result you can observe, failure and edge cases, isolation, stable inputs, useful error details, and cleanup. Set a time budget, owner, and flaky-test rule.

Request you can copy

Outcome: Use Visual Regression Test to gather repeatable evidence about this behavior or quality risk. User context: A checkout screenshot is compared with its approved reference in a fixed browser setup. A cut-off keyboard focus ring appears as a pixel difference for review. Approving every changed image without checking is not regression testing. Validation approach: Visual Regression Test. Why it fits: Use this term for visible changes that are hard to check from DOM values alone. Do not use it when: Do not hide unstable images with a wide pixel limit or replace meaning and behavior checks with screenshots. Test requirements: Name the system and test environment. Define prepared test data, other inputs, and the result you can observe. Include failure and edge cases, allowed error, isolation, and cleanup. Test operations: Make failures easy to diagnose. Control random or changing inputs. Name an owner. Keep the test fast and simple enough for its release gate. Acceptance criteria: The test fails for the known bug and passes after the fix. It repeats in the target environment, gives useful evidence, and does not expose or change unrelated data. Evidence and limits (evidence boundary): It is official for that source. Other platforms or teams may use the term in another way. Unknowns to confirm: Release gate, environment, prepared test data, allowed error, time budget, owner, and flaky-test rule.

Check this request

Review the current use of Visual Regression Test. Definition: A visual regression test compares today's rendered image with an approved reference image under the same browser conditions. Release checks: Check the environment and prepared test data (fixture). Define a result you can observe, failure and edge cases, isolation, stable inputs, useful error details, and cleanup. Set a time budget, owner, and flaky-test rule. Before changing code, report the evidence you found, gaps, severity, and the smallest safe fix.

B
How official is this term?

Official guidance

The named platform, framework, project, or expert group has an official guide for this term.

It is official for that source. Other platforms or teams may use the term in another way.

Scope
Playwright visual comparisons
Document status
stable
Checked on
2026-07-30

Evidence sources & scope

Authority source + Term reference · Microsoft · stable Visual comparisons Scope: Playwright screenshot comparison testing Role here: Direct term reference Source covers: canonical name, definition, platform API, implementation, usage guidance

Copy it yourself

The browser could not copy this. Select the request below and copy it yourself.