Skip to content
Pages

Approve and check

A map on its own compares each run with the previous one. Once you approve it, every run compares with what you approved instead, and bin/ezu check fails when a screen moves.

After reading this page, you will know:

  • What approving stores, and where.
  • What makes check fail, and how to review it.
  • How to approve some states and not others.

Approve the first map

bin/ezu map
bin/ezu approve --all

Approving writes ezu/approved.json: for each state, the SHA-256 of each screenshot, keyed <viewport>-<theme>-<locale>:

{
  "accounts#show/Account": {
    "desktop-dark-en": "82ed3683…",
    "desktop-light-en": "c16f08e7…",
    "mobile-light-ja": "eae27beb…"
  }
}

Commit it. Runs repeat byte for byte (see Repeatable runs), so a fingerprint is enough to say a screen moved, and the repo never grows by a screenshot per approval. WariWari's 188 states take about 20 KB.

The approved PNGs themselves stay in your app's tmp/ezu-approved/, so the viewer can show the approved image and a diff on the machine that approved them. On another machine, check still fails on a change, just without the picture.

Check

bin/ezu check

check runs a full map, then lists:

  • Differs from approved: a screenshot whose fingerprint changed, with the shots that changed.
  • Not approved yet: a state, or a screenshot of one, with no approval. Adding a step means approving it in the same change.
  • Approved but no flow reaches it: an approval with no state any more.
Exit status Meaning
0 Every screen matches its approval.
1 Something differs, is new, or is gone; or nothing is approved yet.
2 The run broke: a step failed, the app didn't boot, or the config is wrong.

A screenshot whose fingerprint differs gets a pixel diff against the approved image when that image is on this machine. A difference below anti-aliasing noise (32 pixels, each within 24 levels per channel) still passes.

Review differences

Open tmp/ezu/index.html and use the needs review filter. A changed state shows Approved, New and Diff, with the moved pixels in pink. Each state has a button that copies its approve command.

Approve some states

bin/ezu approve --changed                 # every difference, new state and removal
bin/ezu approve 'groups#show/*'           # states matching a glob
bin/ezu approve 'groups#show/Balance graph'

--all approves every state in the last map and removes approvals for states it didn't reach. Approvals only cover the locales the map ran, so --locales en followed by approve leaves the Japanese approvals alone.

Same pixels on every machine

Fonts and anti-aliasing differ between macOS and Linux, so a screenshot approved on one fails on the other. For now, approve and check on the same kind of machine. Running the browser in Playwright's Docker image is the planned way to make every machine draw the same pixels.