playwright
Technical notes on web development, DevOps, and AI integration.
19 articles
- 06:00testing
Catching leaked E2E rows with test.afterAll
An afterAll safety net for E2E rows left behind when a test times out: identity unique per worker, a sweep limited to owned and stale rows, idempotent delete.
TL;DR: A timed-out test skipped its DELETE step, leaving a stale row in the admin grid despite a passing spec. The fix adds an afterAll hook that cleans up rows even when tests fail or time out. It targets only this run's rows to avoid deleting data from other workers.
#playwright#testing#e2e - 01:05testing
Token AI Leaked from Browser Snapshots, Not from My Tests
I thought my tests were expensive. Every browser action was returning a fresh accessibility snapshot into the agent's context instead.
TL;DR: The agent was using too many tokens due to taking accessibility-tree snapshots on every action. This was fixed by changing how the agent watched tests run. The solution involved limiting the agent's access to test results.
#playwright#vitest#mcp - 23:05testing
Writing E2E Tests for a Page That Postpones Its Fetch
A 52-line E2E spec for a listing page that debounces 350 ms: zero waitForTimeout, assertions that retry on their own, and five data-testid hooks.
TL;DR: The listing page debounces client fetch by 350 milliseconds. Playwright's automatic retry replaces waitForTimeout. The test uses a 10-second assertion timeout.
#playwright#testing#typescript - 19:06security
The Masked Public Roster: Ship Names, Not Phone Numbers
Hiding sensitive columns in the UI is not protection. The real mask lives in the API layer, proven by negative E2E assertions.
TL;DR: The article describes a common flaw where the UI hides sensitive fields but the API still sends full records to the client, violating OWASP API3:2023 and Indonesia's data minimization rules. The fix strips fields server-side via a projection DTO containing only public data. A Playwright test enforces negative assertions, ensuring PII never reaches the DOM.
#privacy#security#playwright - 19:56testing
The Confirmation That Disappears: Wisata Admin QA
A QA session hit a delete click that vanished without deleting anything. The Playwright dialog contract explains why.
TL;DR: The disappearing confirm dialog wasn't an app bug; Playwright auto-dismisses native dialogs when no handler is registered, so destructive actions must go through the MCP browser_handle_dialog tool. Testing also found phone validation missing in two modules, folded into one cross-module ticket instead of two. Lesson: verify against tool contracts and database artifacts, not impressions.
#playwright#testing#mcp - 18:56testing
A 192-Page Crawl, One 404, One Wrong Citation
An internal link-audit crawler in Playwright: static seeds, dynamic discovery, and a wrong citation in the commit message replaced by verified sources.
TL;DR: A Playwright-based crawler hit one dynamic 404: a slug containing an apostrophe got double-encoded, breaking the URL before it reached the router. The cited Next.js issue was a false reference, so MDN docs and issue #89879 became the real evidence. Final tally: 192 pages, zero hard-broken links, fix scheduled separately.
#playwright#e2e#nextjs - 17:57testing
Why My Login Assertion Never Failed
A URL assertion in the admin login fixture looked safe and could never fail: the route is identical before and after login. Swap it for a post-login marker.
TL;DR: The login helper asserted the URL was /admincms, but that route shows both before and after login so the check always passed. Playwright's auto-retry couldn't save it since the condition was true from the start. Replacing it with a check for the admin-user-chip, visible only after a valid session, lets the test correctly fail on bad credentials.
#playwright#e2e#testing - 16:46testing
Fixture First: Writing the Login Helper Before Any Spec
One login helper and one evidence helper written before the first spec that needs them, and why getByLabel needs exact: true on this admin form.
TL;DR: Task 0 required building reusable Playwright helpers before any specs, enforcing short behavior-focused tests. loginAsAdmin uses real user-facing selectors like getByLabel with exact true and getByRole instead of test ids to avoid mismatches. A simple screenshot helper centralizes evidence and the team deferred faster storageState auth to keep tests isolated for now.
#playwright#e2e#testing - 13:27testing
The Test That Counts Requests, Not Pixels
A Playwright test that intercepts network traffic to prove a form blocks submission client-side, plus a date-filter edge case that almost slipped through.
TL;DR: The test checks that submitting without a service pillar shows an inline error and sends no network request, verified via Playwright route interception. It fills all other fields and handles dev-only login plus a required phone setup wizard beforehand. It also adds coverage for a date filter edge case, ensuring today-to-today includes today using an exclusive bound the next day.
#playwright#testing#e2e