Workshop

Twenty blocks. Three parts. One day of Playwright.

Before you arrive
  1. 00.

    Install Playwright and land one green test so day-of goes smoothly.

Basics

Install, debug, run.
  1. 01.

    Record your first tests using codegen

  2. 02.

    Break things, debug them and analyze with the trace viewer.

  3. 03.

    Basic configuration options for your Playwright setup.

  4. 04.

    Learn how to give your test suite some structure.

Writing tests

The craft of real tests.
  1. 01.

    Understand Playwright's actionability and locators.

  2. 02.

    Learn how to add assertions and avoid all these "waitFor"s.

  3. 03.

    Use accessibility-aware matchers to lock down structure and catch a11y regressions with clear failure messages.

  4. 04.

    Read data out of the page so you can assert on values you don't know up front.

  5. 05.

    Learn how to implement a setup step and reuse browser state.

  6. 06.

    Recognize the patterns behind flaky tests and apply the right tool for each.

  7. 07.

    Learn how to take some pictures and implement visual regression tests.

  8. 08.

    Block, mock, and modify network requests so tests stay fast and deterministic.

  9. 09.

    Use the `request` fixture to hit HTTP endpoints directly without a browser.

  10. 10.

    Subscribe to dialogs, console messages, errors, downloads, and new tabs.

  11. 11.

    Combine everything you learned into one end-to-end purchase using the local /checkout.

AI

Playwright in the agentic era.
  1. 01.

    See why coding agents work better with `@playwright/cli` than with MCP, and run your first agent-driven browser session.

  2. 02.

    Have your coding agent turn a CLI-driven session into a runnable Playwright spec.

  3. 03.

    Let your agent extract repeated locators into a Page Object Model.

  4. 04.

    Let your agent extract repeated setup into a custom Playwright fixture.

  5. 05.

    Spot the testing tasks where AI is the obvious tool, and stay in charge.