Verify, and reading a verdict

“Saved” is not “shows”. A text format can clean up what was stored, a template can add words around a field, and a cache can hold the old page. Once an edit is made real, the page without the layer should look exactly like the page with it. Verify checks that, the same way every time, as Wanigan’s own check.

1. 1

   Make it real first

   Words are verified once they are In the site, not verified. A style or a token is put in the theme outside Wanigan, by an agent from its brief or by you, so Verify on its draft is how Wanigan finds it there. Verify needs the site helper. See Make real.

2. 2

   Choose Verify

   Choose Verify on the edit in Edits, or Make real › Verify … on this page in the toolbar for every edit there that is in the site or handed to an agent. Verify on one card checks every edit on that element together. It renders in hidden windows, so your own view does not move while it runs.

   Picture: to come

   A screenshot of the real app, with the demo’s data, of what the title above says.

3. 3

   Read the headline

   A pass says Verified at 390 and 1440 px: the site renders it as designed, and the edit becomes Verified. A failure says Not verified, names the step that failed and lists each difference; the edit stays In the site, as made. A style or token draft that is not in the theme yet says Not in the site yet on its own card, which step failed and at what widths, and its first two differences, such as “At 1440 px, the title: font-size is 52px in the site, 63px in the design.”; it stays a draft.

   

4. 4

   Open the pictures

   Each width has The page before (when one was kept), The design, The site and Difference. Each opens larger. In Difference, the site’s page is faded to grey, pixels that differ beyond the noise floor are magenta, and parts left out of the comparison are pale green.

   Picture: to come

   A screenshot of the real app, with the demo’s data, of what the title above says.

5. 5

   Retire it

   A verified edit has Retire, which archives it and takes it off the list.

At a phone’s width (390 px) and a desktop’s (1440 px), Wanigan renders the page in hidden windows that share the live view’s session: twice without the layer, which is the result, and twice with it, which is the design. The two renders of each version show how much the page differs from itself, the noise floor. Parts the site says change from one render to the next are left out. Then three steps run in order, and the first that fails decides the verdict.

Each hidden window stays one screen tall, as a person’s screen is. Wanigan scrolls through the page a screen at a time, so whatever loads once it is in view loads, goes back to the top, reads the page’s height once, and pictures the whole page beyond the screen. The window is never grown to the page’s height: a page built to fill at least a screen would grow with it and never settle, and two renders would differ for no reason.

An element can carry more than one edit: new words made real, and a style for it handed to an agent. Verify on any of their cards checks every edit on that element together, in the same renders, and each card gets the verdict. A style counts once it has been handed to an agent, which is when Make it real kept the page from before for it; a style nobody has handed over yet is left out unless it is the card you pressed, so verifying words never waits on a style. A style made while the element’s words were still a draft is found after those words are saved, because Verify knows every word edit in the layer.

1. The styles and boxes of the edited elements. Every value the layer can set, the element’s words and its box must be the same in the site as in the design; the verdict names the exact property. A token is checked as its custom property on the page’s root.
2. The pixels around them. Inside each edited element and 8 px around it (a shadow, an outline, the soft edge of text), within the noise floor.
3. The rest of the page. Away from every edited element, the site must match the design; and, when Wanigan kept the page as it was just before the save, it is compared with that too, element by element.

A verdict is said in sentences, not scores. These are the sentences it uses, with made-up values.

Nothing passes for want of a comparison. An edited element not found on the page, one that vanished before it was measured, a token whose value could not be read, and an edit for a named breakpoint all fail, each saying so.

• Only this page, at 390 and 1440 px. Other pages that use the same template, or a token every page reads, are not checked.
• Hover, focus, other breakpoints, dark mode and other lengths of text are not checked in this build.
• Below 6,000 px down the page nothing is compared, and the verdict says so.
• A change the save made beyond your edit is caught only when Wanigan kept the page from before. See the page from before.
• A text format may change what was saved. Verify shows that difference; it does not hide it.

A save that gives the page a new address, such as a new title with Pathauto, takes the live view to the new address. The edit keeps the address it was made on, and Verify renders that one. If the site sends the old address on to the new one, the hidden window follows, since it stops only what would leave the site. If the old address no longer shows the page, the element is not found there and step 1 fails, saying so. The toolbar’s Verify covers edits made on the page you are looking at, so after a move, use Verify on the edit in Edits.