Browser on Vibe Coding

Puppeteer

Mon, 01 Jan 0001 00:00:00 +0000

The Puppeteer server gives an agent control of a real (or headless) Chrome browser — navigating to URLs, clicking elements, filling in forms, and capturing screenshots as it goes.

Why it matters

Some tasks can only be verified by actually looking at rendered output — a UI change, a broken layout, a JavaScript-heavy page that a plain HTTP fetch can’t render. Browser automation closes that verification gap.

Webapp Testing

Mon, 01 Jan 0001 00:00:00 +0000

The Webapp Testing skill packages a verification workflow: launching a dev server, driving a browser through the golden path and edge cases, and checking console and network output for errors — rather than declaring a UI change complete after just reading the code.

Playwright

Mon, 01 Jan 0001 00:00:00 +0000

Playwright MCP gives an agent structured control over a real browser — Chromium, Firefox, or WebKit — using Playwright’s accessibility tree instead of pixel-based screenshots. It exposes tools for navigation, clicking, form filling, and page inspection so an agent can complete multi-step web tasks deterministically.

Chrome DevTools

Mon, 01 Jan 0001 00:00:00 +0000

Chrome DevTools MCP connects a coding agent to a live Chrome instance, exposing the same network, console, and performance-tracing tools available in DevTools. It lets an agent navigate pages, inspect requests, read console errors, and record performance traces from inside its own workflow.

Playwright Browser Automation

Mon, 01 Jan 0001 00:00:00 +0000

This skill gives Claude Code direct, model-invoked control of Playwright — driving a real browser through a web app’s flows to click, fill forms, and validate behavior end-to-end.

Why a skill for this

Reading component code doesn’t confirm a flow actually works in a browser. A dedicated Playwright skill turns that verification into a repeatable, invokable step instead of an ad hoc script written from scratch each time.

Chrome Relay

Mon, 01 Jan 0001 00:00:00 +0000

Chrome Relay drives the user’s already-signed-in Chrome session — cookies, SSO, localhost included — through a local CLI bridge, as a real-browser counterpart to headless Playwright automation.

Why a skill for this

Some flows only work correctly inside an authenticated, already-logged-in browser session — SSO-gated internal tools, for instance. Relaying through the real Chrome session sidesteps re-authenticating a separate automated browser.

Playwright Testing Skill

Mon, 01 Jan 0001 00:00:00 +0000

OpenAI’s curated Playwright skill gives Codex the same browser-automation and interactive test-authoring capability as its Claude Code counterpart, packaged for Codex’s skill system.

Why a skill for this

Verifying a web app in a real browser matters regardless of which coding agent is driving the session — this is the Codex-native equivalent of that same verification step.