If you find this useful,
Blog
Back to Blog

OpenClaw Playwright Skill: Browser Automation Through Your AI Agent

· by Trellis

Automate browsers with OpenClaw Playwright. Web scraping, automated testing, screenshot capture, form filling, and monitoring workflows through conversation.

Last Tuesday at 2 AM, a deploy went out and nobody noticed the checkout page was broken until morning. The button was there, the form fields loaded, but the submit handler silently failed because a CSS class name changed during the build. A unit test would not have caught it. An integration test might have, if someone had written one for that specific flow. What would have caught it instantly: a browser automation that clicked through the checkout flow every thirty minutes and pinged Slack if anything went wrong.

That is the kind of thing the OpenClaw Playwright skill makes trivially easy. Instead of writing Playwright scripts from scratch, configuring test runners, and maintaining CI pipelines, you describe what you want in conversation. Your agent handles the browser.

This guide covers what the OpenClaw Playwright skill does, how to install and configure it, and practical workflows for testing, scraping, monitoring, and more.

What Is the Playwright Skill?

Playwright is Microsoft’s open-source browser automation library. It controls Chromium, Firefox, and WebKit programmatically — clicking buttons, filling forms, navigating pages, taking screenshots, and extracting data. Developers use it for end-to-end testing, web scraping, and workflow automation.

The OpenClaw Playwright skill wraps Playwright’s capabilities into something your AI agent can use. Instead of writing JavaScript or Python scripts, you tell your agent what to do in plain language. The skill translates your intent into Playwright actions, executes them in a real browser, and returns the results.

Core capabilities:

  • Page navigation — Open URLs, follow links, handle redirects
  • Element interaction — Click buttons, fill forms, select dropdowns, check boxes
  • Data extraction — Scrape text, tables, lists, and structured data from pages
  • Screenshot capture — Full page or element-level screenshots
  • PDF generation — Render pages as PDF documents
  • Network monitoring — Intercept requests, check response codes, measure load times
  • Multi-page workflows — Chain actions across multiple pages (login, navigate, extract)
  • Wait strategies — Wait for elements, network idle, or custom conditions

The skill runs a headless browser by default. No visible browser window pops up. Everything happens in the background and you get the results through your messaging channel.

Why Browser Automation Through an Agent?

Before diving into setup, it is worth understanding why you would want browser automation running through an AI agent rather than as standalone scripts.

The Traditional Approach

You write a Playwright script in JavaScript or Python. You handle selectors, waits, error recovery, and output formatting yourself. When selectors change (and they always change), you update the script manually. Each new automation task means a new script.

// Traditional Playwright script
const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com/dashboard');
  await page.fill('#username', '[email protected]');
  await page.fill('#password', 'secret');
  await page.click('button[type="submit"]');
  await page.waitForSelector('.dashboard-content');
  const title = await page.textContent('.dashboard-title');
  console.log(title);
  await browser.close();
})();

That works, but it is rigid. If the selector changes from .dashboard-title to .dash-header, the script breaks. If you want to extract different data, you rewrite the script.

The OpenClaw Playwright Approach

You describe the task in conversation:

Log into example.com/dashboard with [email protected] and password secret,
then extract the dashboard title text

Your agent uses the Playwright skill to execute the same browser actions, but with AI-powered selector resolution. If the exact selector fails, the agent can adapt by looking for similar elements on the page. And when you want different data next time, you just ask differently.

AspectTraditional ScriptOpenClaw Playwright
Setup timeWrite and debug scriptDescribe in conversation
Selector changesScript breaks, manual fixAgent adapts or reports issue
New tasksNew script requiredNew conversation message
Error handlingYou write the logicAgent handles retries and reports
Output formatYou parse and formatAgent returns structured data
SchedulingCron job or CI setupAsk your agent to run periodically

The tradeoff: traditional scripts give you precise control and reproducibility. The agent-based approach gives you speed and flexibility. For production test suites, you probably want both. For ad-hoc scraping, monitoring, and quick checks, the agent approach wins on efficiency.

Installation and Setup

Step 1: Install the Skill

clawhub install playwright

This installs the Playwright skill to ~/.openclaw/skills/playwright/.

Step 2: Install Browser Binaries

Playwright needs browser binaries to work. The skill handles this automatically on first use, but you can pre-install them:

npx playwright install chromium

This downloads a Chromium binary (~150MB). You can also install Firefox and WebKit:

npx playwright install firefox webkit

Chromium alone covers most use cases. Add others if you need cross-browser testing.

Step 3: Verify the Installation

Reload your agent and test:

openclaw skills reload
openclaw start

Send a test message:

Take a screenshot of https://example.com

If the skill returns a screenshot image, everything is working. If you get an error about missing browsers, run the install command from Step 2.

Web Scraping Workflows

Scraping is the most common use case. The Playwright skill handles JavaScript-rendered pages that simple HTTP requests cannot scrape.

Extracting Text Content

Scrape the main article text from https://example.com/blog/post-title

The agent navigates to the page, waits for content to load, identifies the main article body, and returns the text.

Extracting Structured Data

Go to https://example.com/products and extract a table of all products
with their name, price, and rating

The skill parses the page and returns structured data:

[
  {"name": "Widget A", "price": "$29.99", "rating": "4.5"},
  {"name": "Widget B", "price": "$49.99", "rating": "4.2"},
  {"name": "Widget C", "price": "$19.99", "rating": "4.8"}
]

Handling Pagination

Scrape all product listings from https://example.com/products,
following the "Next" pagination link until there are no more pages.
Collect name and price for each product.

The agent clicks through pages automatically, collecting data from each one, and returns the combined result.

Scraping Behind Login

Some data requires authentication:

Log into https://app.example.com with email [email protected]
and password mypassword, then navigate to /reports
and extract the monthly revenue table

The skill handles the full flow: navigate to login, fill credentials, submit, wait for the dashboard, navigate to the reports page, and extract the data. Cookies and session state persist within the browser session.

Automated Testing

The OpenClaw Playwright skill is useful for quick smoke tests and monitoring, not as a replacement for a full test suite, but as a fast way to verify critical flows.

Smoke Testing a Deployment

After deploying, ask your agent:

Go to https://myapp.com and verify:
1. The homepage loads with status 200
2. The login page at /login has a username and password field
3. The API health endpoint at /api/health returns OK

The agent visits each URL, checks the conditions, and reports back:

Results:
1. Homepage - PASS (loaded in 1.2s, status 200)
2. Login page - PASS (username field found, password field found)
3. Health endpoint - PASS (returned {"status": "ok"})

Form Validation Testing

Go to https://myapp.com/signup and test the form validation:
- Submit with empty fields and check for error messages
- Enter an invalid email and check for validation error
- Enter a password shorter than 8 characters and check the error

The agent fills the form with each test case, submits, and reports what error messages appeared.

Visual Regression Checks

Take a full-page screenshot of https://myapp.com/dashboard
at 1920x1080 resolution

Compare this with a previous screenshot to spot visual changes. The agent can take screenshots at specific viewport sizes, making it easy to check responsive layouts.

Take screenshots of https://myapp.com at these widths:
375px (mobile), 768px (tablet), 1440px (desktop)

Screenshot and PDF Workflows

Beyond testing, the Playwright skill generates visual assets.

Full Page Screenshots

Take a full-page screenshot of https://example.com/pricing
including content below the fold

The skill scrolls the entire page and captures everything, not just the visible viewport.

Element Screenshots

Take a screenshot of just the pricing table on https://example.com/pricing

The agent identifies the pricing table element and captures only that section.

PDF Generation

Generate a PDF of the invoice at https://app.example.com/invoices/12345
with A4 paper size and margins

Useful for archiving web-based documents, generating reports, or creating printable versions of web pages.

Timed Captures

Take a screenshot of https://status.example.com every hour
and alert me if the page shows any "degraded" or "outage" text

Combined with periodic execution, this becomes a visual monitoring system.

Monitoring and Alerting

The Playwright skill turns your agent into a lightweight monitoring tool.

Uptime Monitoring

Check https://myapp.com every 30 minutes.
If the page does not load within 10 seconds or returns a non-200 status,
send me an alert.

The agent visits the URL on schedule, checks the response, and only bothers you when something is wrong.

Content Change Detection

Monitor https://competitor.com/pricing for changes.
Check every 6 hours and notify me if the pricing table content changes.

The skill scrapes the pricing data, compares it with the previous check, and alerts you on changes. Useful for tracking competitor pricing, monitoring regulatory pages, or watching for stock availability.

Performance Monitoring

Measure the load time of https://myapp.com/dashboard every hour.
Alert me if it takes longer than 5 seconds.

The Playwright skill can measure page load timing, including time to first paint, DOM content loaded, and full page load. Combine this with historical tracking to spot performance regressions before users complain.

Advanced Patterns

Chaining Multiple Steps

Complex workflows chain multiple browser actions:

1. Go to https://vendor.example.com
2. Search for "industrial widgets"
3. Filter by price under $50
4. Sort by rating highest first
5. Extract the top 10 results with name, price, and rating
6. Take a screenshot of the results page

The agent executes each step in sequence, maintaining browser state throughout. The login session, cookies, and page context carry forward from one step to the next.

Handling Dynamic Content

Modern web apps load content dynamically. The Playwright skill handles this with configurable wait strategies:

  • Wait for element — Pause until a specific element appears
  • Wait for network idle — Pause until network requests settle
  • Wait for navigation — Pause until a page navigation completes
  • Custom timeout — Set how long to wait before reporting failure
Go to https://app.example.com/dashboard and wait for the chart
to finish loading before taking a screenshot

The agent waits for the chart element to render rather than capturing a half-loaded page.

Working with iframes

Some pages embed content in iframes (payment forms, embedded widgets):

Go to https://myapp.com/checkout and fill in the credit card form
inside the payment iframe with test card number 4242424242424242

The Playwright skill can switch into iframe contexts to interact with embedded content.

File Downloads

Go to https://app.example.com/reports, click the "Download CSV" button,
and save the downloaded file

The skill intercepts browser downloads and returns the file content or saves it to a specified location.

Configuration Options

Fine-tune the Playwright skill behavior through OpenClaw config:

# Set default browser (chromium, firefox, webkit)
openclaw config set playwright.browser chromium

# Set default viewport size
openclaw config set playwright.viewport_width 1920
openclaw config set playwright.viewport_height 1080

# Set default timeout (milliseconds)
openclaw config set playwright.timeout 30000

# Enable/disable headless mode
openclaw config set playwright.headless true

# Set user agent string
openclaw config set playwright.user_agent "Mozilla/5.0 (compatible; MyBot/1.0)"

Proxy Configuration

For scraping through a proxy:

openclaw config set playwright.proxy_server "http://proxy.example.com:8080"
openclaw config set playwright.proxy_username "user"
openclaw config set playwright.proxy_password "pass"

By default, each browser session starts fresh. To persist cookies across sessions:

openclaw config set playwright.storage_state "~/.openclaw/playwright/state.json"

This saves cookies and local storage after each session and restores them on the next run. Useful for maintaining login sessions across multiple automation runs.

Combining Playwright with Other Skills

The Playwright skill becomes more powerful when paired with other OpenClaw skills.

Playwright plus Notification Skills

Scrape data with Playwright, then send it through a notification channel:

Check https://store.example.com/product/12345 for price changes.
If the price drops below $100, send me a Telegram message.

Playwright plus Data Skills

Extract data with Playwright and store it in a database:

Scrape all job listings from https://jobs.example.com every day
and save them to my Notion database

Playwright plus Analysis Skills

Scrape content and analyze it:

Go to https://competitor.com/blog, extract their latest 5 blog post titles
and summaries, then summarize the key themes

Browse the automation skills category and development skills category for tools that complement Playwright workflows.

Troubleshooting

”Browser executable not found”

Playwright cannot find the browser binary. Install it:

npx playwright install chromium

If you installed Playwright globally but the skill uses a local installation, make sure the binary paths match. Run npx playwright install --with-deps to install system dependencies on Linux.

”Timeout waiting for selector”

The element you are targeting does not exist or has not loaded yet. Possible causes:

  • The page uses dynamic rendering and the element loads after an API call
  • The selector or description does not match any element on the page
  • The page is behind a login wall and you are seeing the login page instead

Ask your agent to take a screenshot of the current page state to see what actually loaded.

The target URL may be blocking automated browsers. Some sites check for headless browser signatures. Try setting a realistic user agent:

openclaw config set playwright.user_agent "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36"

Pages loading slowly

Increase the default timeout:

openclaw config set playwright.timeout 60000

For pages with heavy JavaScript, ask the agent to wait for network idle:

Navigate to the page and wait for all network requests to complete
before extracting data

Memory usage on long sessions

Browser processes consume memory. For long-running automation tasks, the skill closes and reopens the browser periodically. If you notice high memory usage, restart your agent:

openclaw skills reload

OpenClaw Playwright vs. Direct Playwright Scripts

When should you use the OpenClaw Playwright skill versus writing Playwright scripts directly?

Use the OpenClaw Playwright skill when:

  • You need a quick one-off scrape or check
  • You want to describe the task in natural language rather than writing code
  • You are monitoring something and want alerts through your messaging app
  • You are combining browser automation with other agent capabilities
  • You need flexibility and speed over precision

Use direct Playwright scripts when:

  • You need pixel-perfect, deterministic test suites
  • You are building a CI/CD pipeline with specific test cases
  • You need the full Playwright API surface (custom fixtures, test reporters)
  • Performance benchmarking requires exact control over timing
  • You are running hundreds of tests in parallel

Many teams use both. The OpenClaw Playwright skill handles ad-hoc tasks and monitoring. Direct scripts handle the production test suite. They are complementary, not competing.

Getting Started

If you have not set up OpenClaw yet, start with the Getting Started guide. Once your agent is running:

clawhub install playwright
npx playwright install chromium
openclaw skills reload

Then try your first automation:

Take a screenshot of https://news.ycombinator.com and extract the top 5 story titles

From there, build up to more complex workflows: login flows, multi-page scraping, scheduled monitoring, and form testing.

For the full skill documentation, visit the playwright skill page. For more automation tools, browse the automation skills category. And for curated recommendations across all skill types, see Best OpenClaw Skills 2026.