skills.rest
matthewharwood
matthewharwoodCOMMUNITY
Explore all skills by this author →
GitHub

playwright-app-tests

Automate Playwright end-to-end tests for dean-stack routes, IndexedDB hydration, and cross-tab sync.

1|Updated Apr 26, 2026
Search Tags:#testing#playwright#fixtures#e2e-testing#ci#idb#broadcast-channel
One-click install
npx skills add https://github.com/matthewharwood/dean-stack --skill playwright-app-tests
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playwright-app-tests
Source: https://github.com/matthewharwood/dean-stack/tree/main/.claude/skills/playwright-app-tests
Command: npx skills add https://github.com/matthewharwood/dean-stack --skill playwright-app-tests

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Playwright-app-tests helps ensure the dean-stack app behaves correctly in a real browser, validating end-to-end user workflows, real IndexedDB hydration, and cross-tab consistency without mocks.

Core Features & Use Cases

  • End-to-end route workflows: navigate, interact, verify state across app routes.
  • Real IDB hydration: verify data seeded in the browser's IndexedDB hydrates the app state after navigation.
  • Cross-tab synchronization: verify BroadcastChannel propagates changes between tabs.
  • CI-focused: gates regressions via Playwright tests integrated with bun run check.

Quick Start

Run the app-level Playwright e2e tests against the running dean-stack app to verify route workflows, IDB hydration, and cross-tab synchronization.

Frequently Asked Questions about playwright-app-tests

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

FAQPage Schema
How do I test IndexedDB hydration in Playwright end-to-end tests?▼

Playwright e2e tests validate real IndexedDB hydration by verifying that data seeded in the browser's IndexedDB correctly hydrates the app state after navigation. This ensures data persistence works without mocks across app routes.

Can I verify cross-tab synchronization using BroadcastChannel in Playwright tests?▼

Yes, cross-tab synchronization is verified by testing that BroadcastChannel propagates changes between multiple browser tabs. Playwright automates opening tabs and asserting that state updates reflect accurately across them.

How do I set up Playwright e2e tests for route workflows in CI?▼

Playwright e2e tests for route workflows are integrated into CI via the bun run check command. This gates regressions by automating navigation, interactions, and state verification across the running application's routes.

What's the best way to test a web app without mocking browser storage in e2e tests?▼

Using Playwright to automate a real browser environment allows you to test without mocking browser storage. It validates real IndexedDB hydration and cross-tab BroadcastChannel synchronization against the actual running application.

Do I need a running app server to execute Playwright end-to-end tests?▼

Yes, these Playwright end-to-end tests require a correctly configured test suite and a running application. The tests validate route workflows and browser storage hydration against the live app in both local development and CI environments.

Related Skills

Explore More Software Engineering Skills→
Dragoon0xDragoon0x
4

qa

Generate stack-matched Playwright smoke tests with runner scripts.

Community
Intermediate
mvillmowmvillmow
18

analyze-ci-failure-logs

Analyze CI failure logs to identify root causes and error patterns.

Community
Intermediate
matthewharwoodmatthewharwood
1

idb

Wrap IndexedDB with type-safe openDB, migrations, and hydration promise.

Community
Advanced
chiruu12chiruu12
1

browse

Automates web page navigation, form submissions, screenshot diffs, and state verification via headless browser technology in Python.

Community
Advanced