---
title: "Diff Viewing"
id: "1908"
type: "page"
slug: "diff"
published_at: "2026-09-30T22:03:58+00:00"
modified_at: "2026-10-01T00:11:02+00:00"
url: "https://xedant.com/agents/test/docs/diff"
markdown_url: "https://xedant.com/agents/test/docs/diff.md"
excerpt: "A snapshot changed — what do you do with it? The diff viewer shows the…"
---

# Diff Viewing

[https://xedant.com/agents/test/docs/diff.md](https://xedant.com/agents/test/docs/diff.md)

A snapshot changed — what do you do with it? The diff viewer shows the old and the new side by side, outlines the changed places, and explains in words what exactly changed. This is also where each difference gets its decision.

## Four Ways to Compare

The same difference can be viewed four ways:

- **Side-by-side** — the baseline on the left, the new snapshot on the right.
- **Overlay** — both snapshots are superimposed, the differing part highlighted.
- **Slider** — a human drags the dividing line: old on the left, new on the right.
- **Toggle** — old and new alternate quickly, and the change gives itself away by flickering.

Zoom is at hand too: zoom in and out, fit the picture to the pane, or turn on actual pixels (one picture pixel equals one screen pixel). A double-click toggles between actual size and fit.

## Change Boxes and the Explanation

The changed places are outlined with boxes, and under the picture there is a legend:

- **above the allowed threshold** — the change is bigger than permitted;
- **masked region** — what a mask forbids comparing;
- **ignored region** — what the rules excluded;
- **significant change** — what matters and needs a decision.

Every box carries an explanation in words: “Layout shift”, “Spacing change”, “Color change”, “Typography”, “Element removed”, “Element added”, “Text change”, “Overflow”, and others. If it could not be understood, it says so — “Explanation unavailable”.

## Who Decided

Next to a difference it says who determined its importance. There are four kinds of signature: **strict comparison** (the built-in engine or your compare script), the **script classifier**, the **AI**, and a **human**. There are also four classes: insignificant, significant, noise, and unclassified. For the AI, its confidence in percent is shown beside it.

A script’s decision is labeled “Decided by the deterministic compare script”. Such a decision may only raise the importance of a difference or close an ambiguous case — it cannot lower importance, so a real breakage cannot be hidden behind it. The same rule governs the AI: raising importance — yes, lowering — never. And a human verdict still outranks any classification: beside an AI decision it says so directly — “Classified by the AI cascade — a human verdict still outranks it”.

A useful detail: a script’s answer costs nothing — the AI is called only for the differences the script could not resolve. How to wire scripts — in [Visual Testing Settings](/agents/test/docs/visual-settings)
.

## Evidence and History

Under the picture the facts are collected: which method compared, with which threshold and tolerance, and whether the comparison was skipped because of a fingerprint match. The capture’s frame stability is shown there too — “Stable across N frames” or “Unstable across N frames”. Instability means the page flickered during the capture, and such a difference deserves a separate check.

Beside it is this snapshot’s history: how it looked in past builds and who approved each version and when. An old version can be made the baseline again — the current one stays in history, and the transfer is written to the audit log.

## Verdicts and Discussion

Each difference can be decided:

- **Approve** — the difference is accepted, the baseline moves to this snapshot;
- **Request changes** — send it back to the author for rework;
- **Reject** — declare the change unnecessary or wrong;
- **Fix — create a todo** — hand the difference over for fixing: the evidence attaches itself;
- **Unapprove** — return the previous version as the baseline.

Recording verdicts requires the reviewer role or higher; a viewer only looks. If the difference touches a shared component, approving it requires the design-approver mark. Any difference can be commented on and discussed with colleagues, including @mentioning a person.

## Text Snapshots

Text snapshots — the page’s structure, styles, the accessibility tree, and the sequence of addresses — show a text diff instead of an image: line by line you see what was removed and what was added. Decisions are made exactly the same way: look, understand the cause, approve or send back.

Next: where the samples everything is compared against live — in [Baselines](/agents/test/docs/baselines)
.

[← Back to the documentation index](/agents/test/docs)