ContenoxContenox
Back to Cookbook

Browser Automation with Playwright MCP

Control websites with plain English. Add the official @playwright/mcp server once and your local Contenox agent can drive a real browser: navigate, click, type, take snapshots, read structured accessibility trees, and extract data — all without sending page pixels to a vision model (unless you explicitly use screenshot-related tools). Use it for scraping, testing, form filling, or autonomous research.

Prerequisites

  • contenox init in your project and a configured backend (see the Quickstart).
  • Node.js with npx available (the MCP server runs via npx).

One-command setup

Register the Playwright MCP server (stored in Contenox’s SQLite DB — survives reboots):

contenox mcp add playwright --transport stdio \
  --command npx --args "-y,@playwright/mcp@latest"

Expose tools to contenox run

The default run chain from contenox init only allowlists local_shell and local_fs. After mcp add, you must allow the Playwright hook by name:

  1. Edit .contenox/default-run-chain.json and add "playwright" to the execute_config.hooks array (alongside any other hooks you use), or
  2. Use a custom chain whose hooks include "playwright", or
  3. Use contenox chat (or pipe into contenox) — the default chat chain uses "hooks": ["*"], so every registered MCP server is available without editing JSON.

Tip

Tool names exposed to the model are prefixed with the server name, e.g. playwright.<tool_name>.

For interactive approvals before sensitive actions, use contenox vibe — plain contenox run does not add a human-in-the-loop gate by itself.

Run it

# Simple navigation + summary
contenox run "go to https://github.com/microsoft/playwright-mcp and summarize the latest release"

# Research flow
contenox run "open https://x.ai, find the latest Grok announcement and list the key points"

# Search and extract
contenox run "search Google for 'contenox github', open the first result, and report the current star count"

Advanced mcp add options

Append extra flags to the Playwright MCP package via comma-separated --args (each segment becomes one argument):

GoalExample
Headless--args "-y,@playwright/mcp@latest,--headless"
Specific browser--args "-y,@playwright/mcp@latest,--browser,firefox"
Unrestricted file access--args "-y,@playwright/mcp@latest,--allow-unrestricted-file-access"
Persistent profile (logins/cookies between runs)--args "-y,@playwright/mcp@latest,--user-data-dir,$HOME/.playwright-mcp"

See the package README on npm for the full CLI surface.

How it works

  1. Registration — contenox mcp add stores the server in SQLite; a worker keeps a session so tools stay responsive across steps.
  2. Tools — The model receives Playwright MCP tools (namespaced with the server name). Prefer accessibility snapshots and DOM-driven actions; screenshot tools are available when you need them.
  3. Local execution — The browser runs on your machine; no cloud browser farm is required.
  4. Safety — Treat this like any automation with network and filesystem access: use trusted sites, review chains, and use contenox vibe when you want confirm-before-run behavior.
All recipes