Recording of the visual regression run on lonecto.com · Lonecto — bio card builder walkthrough.

In this video· click a step to jump to it

L
Passed

Test recording

Lonecto — bio card builder walkthrough

121,099 ms · 582,245 pixels changed

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

Take this test with you

This is a real Playwright test, recorded against lonecto.com. 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, s) => screenshotPath.replace('.png', '-' + n + '-' + s + '.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' });
  await page.route('**/cdn-cgi/scripts/**', function (r) { r.abort(); }).catch(function () {});
  await page.route('**/connect.facebook.net/**', function (r) { r.abort(); }).catch(function () {});

  // ---------- PUBLIC: context frame ----------
  stepLogger.log('Public: Lonecto home page');
  await page.goto(baseUrl + '/', { waitUntil: 'domcontentloaded' });
  await page.locator('h1, main').first().waitFor({ state: 'visible', timeout: 10000 }).catch(function () {});
+105 more lines claim the test to get the full code.

Checks run

Run
Visual
83.42%
Text
DOM
Network
+351 −338
Console
A11y
A
Perf
234 over
URL
182 diverged
Variables
Full report
Log in →
582,245
Diff px
2m 01s
Duration
A
Accessible
WCAG 2.2 · 93
Review
Fast
Web Vitals

Notes from the demo run

AI-generated

We signed up, confirmed the email, and then drove 11 post-login actions through Lonecto: the dashboard, the card editor (template gallery, profile, style, sections), a template switch to Minimal Grid, a font and theme change with the phone preview updating live, a save, the tool suite, the QR Design Studio, account details, and finally the published card at lonecto.com/@lastestdemo as a visitor sees it. The card editor is the strongest part. Switching template, changing the tagline and picking a font all repaint the phone preview immediately, and the header tells you the state of things at a glance (Live, the public URL, Saved, Unsaved changes). Sixty-odd templates on a free tier is more than most paid link-in-bio tools ship.

Highlights
  • The preview is genuinely live
    Template, font, colour theme and button shape all repaint the phone mock without a save or a reload. We changed the tagline and watched it land in the preview in the same frame.
  • State is legible in the header
    Live / Draft, the public URL with a copy button, Saved vs Unsaved changes and Publish / Unpublish all sit in one strip. You never have to wonder whether what you are looking at is what visitors see.
  • A real tool suite inside the dashboard
    QR generator, image compressor and converter, watermark maker, video-to-MP3 and GIF, PDF merger, invoice and rate-card generators — all client-side, none of it uploading files. For the creator audience that is a genuine reason to keep the tab open.
  • The QR studio is a design tool, not a checkbox
    Module and corner-dot patterns, gradients, error-correction level and a logo slot that auto-raises error correction. That is more thought than most standalone QR tools.
Friction points
  • Signup does not tell you to check your inbox
    Submitting the signup form dropped us straight onto /login?next=/dashboard with no message. We entered the same credentials we had just created and only then got 'Email not confirmed'. A 'Check your inbox' screen after signup would stop people assuming the account failed to create and trying again.
  • The dashboard routes are query-params, not paths
    /dashboard/analytics, /dashboard/card and /dashboard/links all hit your 404 page; the real routes are /dashboard?section=tools and friends. Deep links people guess or bookmark from the sidebar labels will dead-end. Redirecting the obvious path forms would cost one route file.
Couldn't reach
  • Pro template library·Most of the glass and shop templates are Pro-gated and open the pricing page; we stayed on the free set

11 visual changes

Step 1199,435 px changed
Before
Before
After
After
Diff
Diff
Step 2829 px changed
Before
Before
After
After
Diff
Diff
Step 476,048 px changed
Before
Before
After
After
Diff
Diff
Step 551,638 px changed
Before
Before
After
After
Diff
Diff
Step 663,706 px changed
Before
Before
After
After
Diff
Diff
Step 763,805 px changed
Before
Before
After
After
Diff
Diff
Step 853,143 px changed
Before
Before
After
After
Diff
Diff
Step 952,897 px changed
Before
Before
After
After
Diff
Diff
Step 10829 px changed
Before
Before
After
After
Diff
Diff
Step 12829 px changed
Before
Before
After
After
Diff
Diff
Step 1319,086 px changed
Before
Before
After
After
Diff
Diff

Share this run

Earned · Lastest awards

Proof your app is not AI slop

LASTEST
starter
regressions
0
Badges stay live, ratchet upward, only downgrade on confirmed regression.
56,846 test runs recorded · 1,040 products tested with Lastest

This test was built for lonecto.com — 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.