skills.rest
leonardoacosta
leonardoacostaCOMMUNITY
Explore all skills by this author →
GitHub

playwright-auth

Implements credential-based login, storage state persistence, and multi-role auth fixtures for Playwright E2E tests.

Updated Aug 2, 2026
Search Tags:#authentication#playwright#e2e testing#fixtures#page object model#multi-role#storage state
One-click install
npx skills add https://github.com/leonardoacosta/skills --skill playwright-auth-leonardoacosta
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playwright-auth
Source: https://github.com/leonardoacosta/skills/tree/main/web-frontend-kit/skills/playwright-auth
Command: npx skills add https://github.com/leonardoacosta/skills --skill playwright-auth-leonardoacosta

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Playwright E2E suites repeatedly re-implement login flows, leak sessions across roles, and flake on fixed timeouts. This Skill defines a single auth contract covering credential-based login, storage state reuse, and multi-role persona management so tests authenticate deterministically without boilerplate. ## Core Features & Use Cases - POM vs Fixture Decision Framework: Choose Page Object Model when the login page itself is under test, or test.extend() fixtures when login is pure setup for downstream assertions. - Persona Catalog and Setup Project: Define a typed persona catalog (role, credential env keys, .auth/<persona>.json paths) and generate storage state in a serial Playwright setup project, regenerated per CI run. - Credential Sourcing and Anti-Patterns: Use environment variables with deterministic seeded fallbacks, avoid waitForTimeout, shared contexts across roles, and silent privileged persona substitution. - Use Case: In a T3 Turbo monorepo with platform-admin and agency-agent roles, generate .auth/admin.json and .auth/agent.json in a setup project, then expose platformAdminPage and agentPage fixtures so test bodies never contain login code. ## Quick Start Set up Playwright auth fixtures for my e2e suite with separate admin and agent personas using storage state generated in a setup project.

Frequently Asked Questions about playwright-auth

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle login in Playwright E2E tests without repeating it in every test?▼

Generate storage state once in a serial Playwright setup project using page.context().storageState(), then create browser contexts from the saved .auth/<persona>.json files. Fixtures built with test.extend() hand tests pre-authenticated pages so test bodies contain no login code.

Playwright POM vs fixture pattern for authentication: which should I use?▼

Use a Page Object Model when the login page itself is under test, such as asserting on error messages, rate limiting, or OAuth buttons. Use fixtures when login is only setup for downstream tests, since fixtures eliminate per-test login boilerplate entirely.

How do I test multiple user roles in Playwright?▼

Define a typed persona catalog mapping each role to credential env keys and a .auth/<persona>.json storage state path, then expose one fixture per role such as platformAdminPage and agentPage. Each fixture creates its own browser context so sessions never leak across roles.

Can I reuse Playwright storage state across CI runs?▼

No. Storage state contains live session cookies and localStorage that go stale across builds and targets, and committing .auth/*.json leaks credentials. Gitignore the .auth directory and regenerate state in the setup project on every CI run.

Why does my Playwright login test flake after submit?▼

Fixed delays like page.waitForTimeout(3000) after login flake under CI variance and cold caches. Replace them with page.waitForURL() waiting on the post-login redirect, and use data-testid selectors instead of CSS-class-based locators.

How should Playwright E2E tests handle email verification or magic links?▼

Keep the real browser route, auth service, and token persistence, substituting only terminal delivery through the application's injected EmailDelivery interface with a deterministic run-scoped adapter. Read tokens from the deterministic mailbox store, never from a shared provider inbox or a page.route mock of the auth endpoint.

Related Skills

Explore More Software Engineering Skills→
MrJmpl3MrJmpl3

0036-laravel-e2e-playwright

Standardize Playwright end-to-end testing for Laravel with stable selectors and authentication flows.

Community
Intermediate
weval-orgweval-org
31

e2e-pr

Run Playwright end-to-end tests on routes affected by pull-request changes.

Official
Intermediate
alexaundrealexaundre

webapp-testing

Test local web apps with Playwright and manage server lifecycles.

Community
Intermediate
fredpopefredpope

route-tester

Automate testing of authenticated API routes with cookie-based authentication.

Community
Advanced