Playwright · Field Manual

Tests that depend on your code, not the internet.

44 self-contained patterns for getting API mocking and test conventions right with Playwright. Every card is a complete recipe: prose, a live specimen you can poke at, and a runnable test.

44 cards 5 parts page.route() first

Part 01

Network Mocking

Make a test depend only on your code, never the internet.

01 First Browser Test
02 Mock Your First API
03 Full Mock Payload
04 Mock Only What You Need
05 Proxy to a Real API
06 Record & Replay Fixtures
07 Patch Fixtures for Edge Cases
08 Validate with Zod Schemas
09 Generate Data with Faker
10 Per-Test Overrides

Part 02

Locators & Structure

Find elements by what the user sees; keep selectors in one place.

11 Login Flow
12 Locators → Actions → Flows
13 Scoped Queries
14 Region Objects

Part 03

Reliability

Web-first waits, error guards, and screenshots that do not flake.

15 Done Signals & waitForApi
16 Debug Unhandled Requests
17 Accessibility with Axe
18 Stability Techniques

Part 04

Architecture, Auth & Data

Fixtures, storage-state auth, and parallel-safe test data at scale.

19 Auth Storage State
20 API Seeding & Cleanup
21 App Driver Fixture
22 Failure Artifacts
23 API-Only Tests
24 Parameterized Tests
25 Default Conventions
26 Full Architecture

Part 05

Operations & Advanced

Visual diffs, tracing, sharded CI, devices, and the long tail.

27 Visual Regression
28 Component Testing
29 Trace Viewer
30 CI Sharding & Merge Reports
31 Network HAR
32 Mobile & Emulation
33 Worker-Scoped Fixtures
34 Retries & Soft Assertions
35 Multi-Tab & Multi-Context
36 File Uploads & Downloads
37 Global Setup & Teardown
38 Executable Stories
39 Test ID Strategy
40 shadcn Components
41 Type-Safe i18n
42 WebMCP Tools
43 Premature-Pass Races
44 Agentic MCP → CI