Playwright Subscribe to Playwright RSS feed

Not long ago I received a trend summary titled “The Spread of AI-Based Accessibility Standards.” Its first line said “W3C’s ARIA-AI Framework discussions are underway.” I went looking, and there’s no such standard. The only places that name appeared were auto-generated posts without a single W3C link. AI and accessibility really have come together, though. Not in standards, though. In tools. OpenAI’s developer FAQ for its AI browser, ChatGPT Atlas, says: “Making your website more accessible helps ChatGPT Agent in Atlas understand it better.” ...

↻ 2026-10-02 Updated I corrected how this post described the snapshot an AI agent receives. The snapshots I originally showed were Playwright’s default aria snapshots, the kind tests use, but what Playwright MCP actually hands the model is a snapshot taken with mode: 'ai', and it looks different. Retaking them showed that even the div button survives as a nameless generic that can be clicked by its number (ref). The result was the same on 1.61, the version the practice repo used, so this wasn’t a version change — I got it wrong from the start. So I’ve withdrawn the claim that “a screen a screen-reader user can’t use, an AI agent can’t use either,” and rewritten the section around the finding that each agent tool receives a different tree. The conclusion — get role and name right — stands. This is Part 20 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary ...

This is Part 16 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary Ever had every test green while the screen was broken? Logic fine, one CSS rule collapsing the layout? Visual regression testing stores a reference screenshot (the baseline) and compares pixels, automatically catching “regressions only eyes can see.” It’s built into Playwright — one line to start — but there’s a knack to stable shots and an ambush called environment differences. All covered here. ...

This is Part 15 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary Whether a button has a name, you can tell by looking at that button. But whether its text contrasts enough with the background, whether the page declares a language, whether an id is duplicated — you can’t tell from one element. You have to look at the whole screen, and at the state it’s actually rendered in. That’s tiring to do by eye every time, which is exactly why you want an automated checking engine. ...

This is Part 14 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary “Works on my machine, red on CI.” The homework of everyone who operates E2E, and the prime cause of console.log wallpaper. Playwright ships three tools that solve this mystery with evidence: traces that rewind the failure whole, a UI mode that time-travels, and retries used as a signal. We pack all three today. Series readers: this is insurance for the day your E2E breaks. Searchers: this is the emergency kit for the test that’s broken right now. Examples are self-contained. ...

This is Part 13 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary Past ten E2E tests, two things start to hurt: the setup code copy-pasted into every test, and the suite slowing down as it runs in sequence. Playwright’s fixtures (a mechanism that injects repeated setup into tests) and parallel execution solve both at once — this article covers custom fixtures, auth reuse (storageState), and the safety rules for parallelism. ...

This is Part 12 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary Flaky tests — the code hasn’t changed, yet some days it passes and some days it fails. It’s the first illness every team catches when adopting E2E, and left untreated it breeds a scary culture: “that one again? just rerun it.” Fortunately the cause is usually singular: finding elements too early, or the wrong way. This article pulls that root out with Playwright’s locators and auto-wait. ...

This is Part 11 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary Playwright is an E2E testing tool that drives real browsers (Chromium, Firefox, WebKit) with code. E2E (End-to-End) is exactly what it says — reproducing the entire flow of a user visiting, searching, and seeing results, in an actual browser. This article goes from install to a passing first scenario in one sitting. If you’ve been following the series, this is where the stage gets bigger — we’ve been playing inside jsdom, a pretend browser; now we open a real one. New here? No problem: we start from installation, and you can put any Vite/React app of yours where the demo app sits. (Demo UI strings are Korean — 대시보드 = “Dashboard”, 검색 = “Search”.) ...

This is Part 1 of the “Frontend Testing, Done Right” series. Browse the full series · Glossary “Tests? But it already works.” We’ve all said it — or heard it. I said it for years. Look at the screen, click around, “yep, works,” done. But then the features pile up, and every time you touch the code a little voice asks, “if I change this, what breaks over there?” That creeping anxiety is exactly the moment tests become worth their price. ...