Recording of the visual regression run on hatcher.host · Hatcher — app walkthrough.

In this video· click a step to jump to it

H
Passed ✓

Test recording

Hatcher — app walkthrough

104,743 ms · 304,380 pixels changed

We built this regression test for hatcher.host — it's yours to keep, free.

Take this test with you

This is a real Playwright test, recorded against hatcher.host. Claim it into your own workspace and re-run it on every deploy — free.

export async function test(page, baseUrl, screenshotPath, stepLogger) {
  const shot = (n, slug) => screenshotPath.replace('.png', `-${n}-${slug}.png`);
  const SCROLL_THROUGH = "(async () => { const ease = t => 1 - Math.pow(1 - t, 3); const max = Math.max(0, document.body.scrollHeight - window.innerHeight); if (max < 40) return; const anim = (a, b, ms) => new Promise(res => { const t0 = performance.now(); const step = now => { const p = Math.min(1, (now - t0) / ms); window.scrollTo(0, a + (b - a) * ease(p)); p < 1 ? requestAnimationFrame(step) : res(); }; requestAnimationFrame(step); }); await anim(0, max, 1400); await new Promise(r => setTimeout(r, 350)); await anim(max, 0, 800); })()";

  await page.context().setExtraHTTPHeaders({ 'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36' });
  for (const pattern of ['**/cdn-cgi/scripts/**/email-decode.min.js', '**/sentry-cdn.com/**', '**/*posthog*/**', '**/connect.facebook.net/**']) {
    await page.route(pattern, r => r.abort()).catch(function () {});
  }

  // ── Scenario 1: Public homepage ──
  stepLogger.log('Scenario 1: Homepage');
  await page.goto(baseUrl, { waitUntil: 'domcontentloaded' });
+69 more lines — claim the test to get the full code.

Checks run

Run
✓
Visual
91.26%
Text
—
DOM
✓
Network
+180 −81
Console
9 new
A11y
A
Perf
126 over
URL
✓
Variables
—
Full report
Log in →
304,380
Diff px
1m 45s
Duration
A
Accessible
WCAG 2.2 · 100
C
Fast
Web Vitals · 70

Notes from the demo run

AI-generated

We registered, verified via the email link, logged in, and drove Hatcher's signed-in agent-infra dashboard. The standout is the natural-language agent builder ('Describe it. Hatch it.'): we typed one sentence — an agent that runs Playwright visual-regression tests on each deploy and posts a summary to #eng on Slack — and Hatcher generated a complete, editable agent config (Hermes runtime, DeepSeek route, a 3D avatar 'Lab Analyst', name/description, Slack + deploy-webhook integrations, a SOUL.md system prompt, and a Deploy button). We also walked My Agents, Explore (public agents), Settings, and API keys.

Highlights
  • One-sentence → full agent config
    The NL builder turned a single sentence into a deployable spec with runtime, model route, integrations, personality and a SOUL.md — the most convincing 'deploy an agent in 60s' demo we've driven. This is the moment that sells the product; put it front-and-center.
  • Editable, not magic-black-box
    Every generated field (name, model, palette, integrations, system prompt) is an editable input, so a developer can trust and tune the output rather than accept a sealed result.
  • Clean dev-tool shell
    My Agents / Explore / Settings / API keys are coherent and fast; the empty-state on My Agents points straight at Create Agent.
Friction points
  • Verify link doesn't log you in
    After clicking the email verification link you see 'Email Verified — start creating agents', but visiting /dashboard shows 'Sign In Required' until you log in again. Auto-establishing the session on verify would remove that dead-end for brand-new users.
  • Generation has no progress signal
    The agent builder shows only a 'Thinking…' chip for ~15-20s while it generates — a streaming/token or step indicator would reassure users it hasn't stalled.

9 visual changes

Step 123,350 px changed
Before
Before
After
After
Diff
Diff
Step 24,794 px changed
Before
Before
After
After
Diff
Diff
Step 317,503 px changed
Before
Before
After
After
Diff
Diff
Step 4180,288 px changed
Before
Before
After
After
Diff
Diff
Step 537,370 px changed
Before
Before
After
After
Diff
Diff
Step 620,605 px changed
Before
Before
After
After
Diff
Diff
Step 720,366 px changed
Before
Before
After
After
Diff
Diff
Step 852 px changed
Before
Before
After
After
Diff
Diff
Step 952 px changed
Before
Before
After
After
Diff
Diff

Share this run

Earned · Lastest awards

Proof your app is not AI slop

LASTEST
starter
a11y
WCAG AA
regressions
0
Badges stay live, ratchet upward, only downgrade on confirmed regression.
57,410 test runs recorded · 1,174 products tested with Lastest

This test was built for hatcher.host — claim it free

One click copies the test and baseline screenshots into your own Lastest workspace. Re-run on every deploy and catch regressions before your users do — free, no card required.