Playwright
Testing Agents
Tutorial

Test automation is becoming agentic

Traditional automation starts with a human deciding what to test, writing the test and maintaining it. Playwright Testing Agents add another layer: specialised AI agents can participate in each of those activities.

Playwright currently provides three specialised testing agents: Planner, Generator and Healer.

You can use them independently, sequentially, or as part of a larger agentic testing workflow.

Step 1 — Create or open a Playwright project

If you do not already have a Playwright project, initialise one.

npm init playwright@latest

Follow the prompts to create your project and install the required browser dependencies.

Step 2 — Initialise Playwright agents

Playwright provides an init-agents command that generates the agent definitions required by your chosen environment.

For VS Code

npx playwright init-agents --loop=vscode

For Claude Code

npx playwright init-agents --loop=claude

For Codex

npx playwright init-agents --loop=codex

Step 3 — Give Planner a seed test

A seed test can initialise the environment and place the agent in the right application context before exploration begins.

import { test, expect } from '@playwright/test';

test('open task application', async ({ page }) => {

    await page.goto('YOUR_APPLICATION_URL');

    await expect(page).toHaveTitle(/Todo|Tasks/i);

});

The seed does not need to contain the entire test suite. Think of it as the starting position from which the Planner can explore.

Generator — turn the plan into code

Once you are comfortable with the coverage, Generator can convert the test plan into executable Playwright Test files.

A generated test could conceptually look like this:

import { test, expect } from '@playwright/test';

test.beforeEach(async ({ page }) => {

    await page.goto('YOUR_APPLICATION_URL');

});

test('user can create a task', async ({ page }) => {

    const taskInput = page.getByPlaceholder(
        'What needs to be done?'
    );

    await taskInput.fill('Review regression results');
    await taskInput.press('Enter');

    await expect(
        page.getByText('Review regression results')
    ).toBeVisible();

});

test('user can complete a task', async ({ page }) => {

    const taskInput = page.getByPlaceholder(
        'What needs to be done?'
    );

    await taskInput.fill('Run smoke tests');
    await taskInput.press('Enter');

    await page
        .getByRole('checkbox', { name: /toggle todo/i })
        .check();

    await expect(
        page.getByText('Run smoke tests')
    ).toBeVisible();

});

Do not stop at “the code runs”

Review generated automation exactly as you would review human-written automation.

• Are assertions meaningful?
• Are locators resilient?
• Are tests independent?
• Is setup unnecessarily duplicated?
• Could the test pass even when the feature is broken?
• Are important business validations missing?

The 7-step responsible agentic testing workflow

Interview questions to remember