Playwright Labs

A collection of Playwright fixtures, utilities, and best practices for building reliable, maintainable test automation.

Packages

Package	Description	Install
@playwright-labs/decorators	OOP-style decorators for Playwright — @describe, @test, @step, @param, @use.define, @beforeAll, @afterAll, @beforeEach, @afterEach, and more	npm i @playwright-labs/decorators
@playwright-labs/fixture-abort	AbortController & AbortSignal fixtures with custom matchers (toBeAborted, toBeActive, toAbortWithin, etc.)	npm i @playwright-labs/fixture-abort
@playwright-labs/fixture-ajv-ts	Schema validation fixture using ajv-ts with toMatchSchema matcher	npm i @playwright-labs/fixture-ajv-ts ajv-ts
@playwright-labs/fixture-allure	Allure reporting fixture (useAllure), function/method decorators for steps, parameter masking (PARAMETER.MASKED)	npm i @playwright-labs/fixture-allure allure-js-commons
@playwright-labs/fixture-env	Type-safe environment variable management with ajv-ts or zod schema validation	npm i @playwright-labs/fixture-env
@playwright-labs/fixture-faker	Fake data generation fixture using @faker-js/faker with multi-locale support	npm i @playwright-labs/fixture-faker @faker-js/faker
@playwright-labs/fixture-testcontainers	Playwright fixture for Testcontainers — start real Docker containers in tests with automatic cleanup and 13 custom expect matchers	npm i @playwright-labs/fixture-testcontainers testcontainers
@playwright-labs/fixture-timers	Promise-based Node.js timer fixtures (setTimeout, setInterval, setImmediate, scheduler) with timing matchers	npm i @playwright-labs/fixture-timers
@playwright-labs/fixture-lock	Cross-worker/cross-process resource locking (useLock) — pluggable HTTP, WebSocket, IPC and filesystem transports, with a globalSetup/globalTeardown shared lock server	npm i @playwright-labs/fixture-lock
@playwright-labs/webauthn	Core WebAuthn/passkey primitives — WebAuthn, VirtualAuthenticator/VirtualAuthenticatorArray, credential export/import, isCredential/matchesCredentialFilter — used internally by fixture-webauthn	npm i @playwright-labs/webauthn
@playwright-labs/fixture-webauthn	WebAuthn/passkey fixture (webauthn, useWebAuthn) — drive a virtual FIDO2/U2F authenticator over CDP for full register/login testing, no real security key needed	npm i @playwright-labs/fixture-webauthn
@playwright-labs/ghost-cursor	Human-like mouse cursor movements for Playwright — Bézier-curve paths with overshoot, jitter, and Fitts's-law timing, driven by native page.mouse	npm i @playwright-labs/ghost-cursor
@playwright-labs/fixture-ghost-cursor	Ghost cursor fixture (ghostCursor, useGhostCursor) — integrates ghost-cursor into your test suite via test.extend	npm i @playwright-labs/fixture-ghost-cursor @playwright-labs/ghost-cursor
@playwright-labs/qrcode-core	QR code encode/decode primitives — QRCodeEncoder (8 output formats, mixed-mode segments via SegmentArray) and QRCodeDecoder (buffers, streams, files, base64, raw RGBA)	npm i @playwright-labs/qrcode-core
@playwright-labs/fixture-qrcode	QR code decode fixture (useQRCodeDecode) and toHaveQRCode matcher — assert QR content straight from locators	npm i @playwright-labs/fixture-qrcode
@playwright-labs/barcode-core	1D barcode encode/decode primitives — BarcodeEncoder (jsbarcode, SVG/file/stream/raw pixels, no canvas required) and BarcodeDecoder (EAN, Code128, UPC, ...)	npm i @playwright-labs/barcode-core
@playwright-labs/fixture-barcode	Barcode decode fixture (useBarcodeDecode) and toHaveBarcode matcher — assert EAN/Code128/UPC/... straight from locators	npm i @playwright-labs/fixture-barcode
@playwright-labs/otel-core	Shared OTel primitives (Counter, Histogram, UpDownCounter, Span) with stdout serialization bridge — used internally by reporter-otel and fixture-otel	npm i @playwright-labs/otel-core
@playwright-labs/reporter-otel	OpenTelemetry reporter — exports test traces and metrics to any OTLP-compatible backend (Jaeger, Grafana Tempo, Prometheus, Datadog)	npm i @playwright-labs/reporter-otel
@playwright-labs/fixture-otel	OTel metric fixtures (useCounter, useHistogram, useUpDownCounter, useSpan), withSpan callback helper, and custom matchers	npm i @playwright-labs/fixture-otel
@playwright-labs/prometheus-core	Shared Prometheus primitives (Counter, Gauge) with the stdout event bridge — used internally by reporter-prometheus-remote-write and fixture-prometheus	npm i @playwright-labs/prometheus-core
@playwright-labs/reporter-prometheus-remote-write	Prometheus Remote Write reporter — pushes test metrics to Prometheus in real time	npm i @playwright-labs/reporter-prometheus-remote-write
@playwright-labs/fixture-prometheus	Prometheus metric fixtures (useCounterMetric, useGaugeMetric) for custom test metrics	npm i @playwright-labs/fixture-prometheus
@playwright-labs/s3-core	Zero-dependency S3-compatible client (AWS SigV4 over fetch) — buckets/objects CRUD, write streams, retries/timeouts, typed events; works with AWS S3, MinIO, R2	npm i @playwright-labs/s3-core
@playwright-labs/reporter-s3	S3 reporter — uploads run summary.json and test attachments (screenshots, videos, traces) to S3-compatible storage with per-attachment bucket routing	npm i @playwright-labs/reporter-s3
@playwright-labs/fixture-s3	S3 upload fixture (useBucket) — put/putFile/write streams from tests; deferred shipping via reporter-s3 or immediate uploads	npm i @playwright-labs/fixture-s3
@playwright-labs/reporter-email	Email reporter for test run notifications via nodemailer (50+ email services supported)	npm i @playwright-labs/reporter-email
@playwright-labs/fixture-gmail	Gmail fixture (useGmail) — find, read and send emails via the Gmail API straight from tests; HTML body primitives (h1-h6, table, ...) and attachments	npm i @playwright-labs/fixture-gmail
@playwright-labs/email-core	Shared email primitives — EmailProvider base class (waitForEmail, getEmailLinks), common types, HTML body builders and provider clients (providers/gmail, providers/mailpit)	npm i @playwright-labs/email-core
@playwright-labs/fixture-mailpit	Mailpit fixture (useMailpit) — find, wait for, read, send and delete emails via the Mailpit API straight from tests; link extraction (getEmailLinks) and HTML body primitives	npm i @playwright-labs/fixture-mailpit
@playwright-labs/reporter-core	Shared BaseReporter + types (TestCases, Template, StatusCounts) — the unified API every @playwright-labs/reporter-* package extends	npm i @playwright-labs/reporter-core
@playwright-labs/reporter-inline	Build a Playwright reporter from plain callbacks — no class, no boilerplate; pass any subset of the lifecycle hooks and get a fully valid reporter	npm i @playwright-labs/reporter-inline
@playwright-labs/reporter-webhook	Reporter that POSTs test-run lifecycle events to any webhook as JSON { event, data } bodies — feed CI dashboards, chat bots, ticket systems, or your own automation	npm i @playwright-labs/reporter-webhook
@playwright-labs/reporter-desktop-native-notification	Desktop native notifications on run finish via node-notifier (macOS Notification Center, Windows toast, Linux notify-send)	npm i @playwright-labs/reporter-desktop-native-notification
@playwright-labs/slack-buildkit	Framework-agnostic Slack Block Kit builder with a custom React JSX runtime — write messages as TSX, render to Block Kit JSON; includes <Table>/<Tr>/<Th>/<Td> for GFM tables	npm i @playwright-labs/slack-buildkit
@playwright-labs/reporter-slack	Slack reporter for Playwright — sends rich Block Kit notifications via Incoming Webhook or Web API; ships BaseTemplate, WithOptionsTemplate, and WithTableTemplate	npm i @playwright-labs/reporter-slack
@playwright-labs/selectors-core	Shared parsing infrastructure for the selectors-* family — framework-agnostic attribute selector parser (parseAttributeSelector) and value matcher (matchesAttributePart)	npm i @playwright-labs/selectors-core
@playwright-labs/selectors-angular	Angular-aware selector engine (angular= syntax), expect matchers, and $ng fixture for inspecting component inputs, outputs, signals, and directives at runtime	npm i @playwright-labs/selectors-angular
@playwright-labs/selectors-react	React-aware selector engine (react= syntax), expect matchers, and $r fixture for inspecting component props, state (hooks), and context via the fiber tree	npm i @playwright-labs/selectors-react
@playwright-labs/selectors-vue	Vue 3-aware selector engine (vue= syntax), expect matchers, and $v fixture for inspecting component props, Composition API setup state, and Options API data	npm i @playwright-labs/selectors-vue
@playwright-labs/sql-core	Compile-time SQL validator via TypeScript template literal types — sql tag, SqlStatement<P> phantom brand, SQLParams<S> FSM type, SQLite/pg/mysql2 adapters	npm i @playwright-labs/sql-core
@playwright-labs/fixture-sql	Playwright fixture for SQL database testing — auto-open/close connections, sql and useSql fixtures, works with SQLite, PostgreSQL, and MySQL	npm i @playwright-labs/fixture-sql
@playwright-labs/ts-plugin-sql	TypeScript language service plugin for sql tagged templates — table/column autocomplete, structural diagnostics, and hover types from your live DB schema	npm i @playwright-labs/ts-plugin-sql
@playwright-labs/playwright-best-practices	AI-optimized best practices guide — 29 rules across 8 categories with real-world examples	pnpx add-skill https://github.com/vitalics/playwright-labs/tree/main/packages/playwright-best-practices

Examples

Runnable examples showing each package integrated with real infrastructure.

Example	Packages demonstrated	What it shows
reporter-otel	reporter-otel · fixture-otel	Full OTel stack (OTel Collector → Jaeger + Prometheus + Grafana) — traces per test/step, built-in metrics, custom counters/histograms/spans
s3-stack	reporter-s3 · fixture-s3 · s3-core	S3 examples with reporter + fixture
grafana-stack	reporter-prometheus-remote-write · fixture-prometheus	Prometheus remote-write receiver + Grafana — real-time test metrics, custom counters/gauges, verify project querying the Prometheus API
reporter-email	reporter-email	Live preview server for all email templates (plain HTML, Tailwind, shadcn/ui, charts)
selectors-angular	selectors-angular	Angular application used to test the angular= selector engine and component inspection
selectors-react	selectors-react	React application used to test the react= selector engine and fiber-tree inspection
selectors-vue	selectors-vue	Vue 3 application used to test the vue= selector engine and Composition API inspection
sql	fixture-sql · ts-plugin-sql	SQLite in-memory tests showing sql tagged templates, join/aggregate queries, and TypeScript plugin schema (inline + schemaFile)
webauthn-login	fixture-webauthn	Fake passkey login page tested end to end — register and sign in with a virtual authenticator, plus the "no passkey registered" failure path

Quick Start

All fixture packages follow the same pattern — import test and expect, or merge with your existing fixtures:

// Use directly
import { test, expect } from "@playwright-labs/fixture-timers";

// Or merge with other fixtures
import { mergeTests, mergeExpects } from "@playwright/test";
import {
  test as timersTest,
  expect as timersExpect,
} from "@playwright-labs/fixture-timers";
import {
  test as abortTest,
  expect as abortExpect,
} from "@playwright-labs/fixture-abort";

export const test = mergeTests(timersTest, abortTest);
export const expect = mergeExpects(timersExpect, abortExpect);

License

MIT