In this video· click a step to jump to it
Test recording
Nibbleful — app walkthrough
75,695 ms · 18 pixels changed
We built this regression test for nibbleful.com — it's yours to keep, free.
Take this test with you
This is a real Playwright test, recorded against nibbleful.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, slug) => screenshotPath.replace('.png', `-${n}-${slug}.png`);
const COL = '/collections/01a0d193-fad5-7b25-99ee-3f903617d4ce';
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/**', '**/cdn.segment.com/**', '**/connect.facebook.net/**', '**/www.googletagmanager.com/**']) {
await page.route(pattern, function (r) { return r.abort(); }).catch(function () {});
}
// ---------- Public context: home ----------
stepLogger.log('Public: Nibbleful home');Checks run
Notes from the demo run
AI-generatedWe created a Nibbleful account and drove the whole org workspace signed in: the dashboard, collections, a real collection's three tabs (Settings, Records, Quick Start) in both private and public-ingest flavours, the new-collection form, the API key list and its per-collection scoping form, the request log and prepaid billing. Signup to a usable dashboard was one form with no verification step, and an organization was created for us automatically. The product's whole pitch - 'just send the JSON' - survives contact with the dashboard: a collection is a name, a key is a set of per-collection checkboxes, and the Quick Start hands you the exact curl for the collection you are looking at.
- Quick Start is collection-specific, not genericThe curl and browser-fetch snippets are pre-filled with this collection's real UUID rather than a placeholder path. Copy, paste, done. Most usage-based APIs make you assemble the URL yourself from three doc pages.
- Key scoping is explained at the point of decisionThe new-key form says per-collection read/write is the default, that WRITE is required to POST, and that a key with no permissions returns collection_not_found. That is the failure mode a new user would otherwise debug blind, documented inline on the form that causes it.
- nib_pk_ versus nib_sk_ is spelled out where it mattersThe Public Ingest tab states plainly that the pk token is write-only, is not a secret, and that sk keys must never reach frontend code. Putting that on the snippet rather than in a security doc is how you actually prevent leaked keys.
- The getting-started list is ordered and priced'Prepaid funds, a Collection, a write-scoped API key, then one Quick Start request' plus 'accepted operations cost $0.001, dashboard browsing is free'. A new user knows the sequence and the cost before spending anything.
- The org name is derived from the raw email local-partSigning up as [email protected] produced an organization called "Lastestcloud+Nibbleful's Organization", plus-sign and all, and it renders truncated in the sidebar. Anyone using a plus-alias or a dotted address gets a slightly broken-looking workspace name on their very first screen. Either strip non-alpha characters or prompt for an org name during signup.
- Public ingest is off by default with the enable link one level awayThe Quick Start's Public Ingest tab renders the full snippet and then warns 'Public ingest is disabled for this Collection. Enable it on Settings.' The snippet on screen cannot work yet. An inline toggle right there, or greying the snippet until it is enabled, would stop people copying a request that is guaranteed to fail.
Visual change
Share this run
Proof your app is not AI slop
This test was built for nibbleful.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.


