playwright-e2e

Run Playwright end-to-end tests for Anarchy frontend features in a real browser.

Updated Feb 6, 2026
One-click install
npx skills add https://github.com/MoriwakiYusuke/anarchy --skill playwright-e2e-moriwakiyusuke
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-e2e
Source: https://github.com/MoriwakiYusuke/anarchy/tree/main/.claude/skills/playwright-e2e
Command: npx skills add https://github.com/MoriwakiYusuke/anarchy --skill playwright-e2e-moriwakiyusuke

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It prevents frontend integration regressions by ensuring new Anarchy features actually work in a real browser end-to-end, including smoldot/Wasm/worker behavior and UI state transitions.

Core Features & Use Cases

  • E2E test coverage for new frontend capabilities: Defines what to validate when adding a new page/route, new extrinsic submission flow, new Wasm cryptography or heavy processing, new scanner logic, or new key management UI.
  • Deterministic, flaky-resistant Playwright patterns: Provides fixture-driven synchronization (e.g., waiting for chain-status connected state), UI-observed assertions for extrinsic finalize, and explicit anti-flake guidance (no blind sleeps).
  • Security-oriented assertions inside E2E: Adds checks to ensure secrets and keys are not leaked into localStorage, sessionStorage, IndexedDB, cookies, or DOM after sensitive operations.
  • Operational workflow guidance: Supplies run commands for headless and headed modes and clarifies constraints (e.g., Playwright MCP limitations on certain Ubuntu/WSL setups).

Quick Start

Run the E2E for the new feature by starting the required testnet and storage nodes, then executing the corresponding spec file under apps/frontend with the Playwright test command.

Frequently Asked Questions about playwright-e2e

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

FAQPage Schema
How do I write Playwright E2E tests for Next.js Wasm and worker interactions without flaky waits?

Write Playwright E2E tests for Next.js Wasm and worker interactions by using fixture-driven synchronization and UI-observed assertions for connection states, avoiding blind sleeps to ensure deterministic, flaky-resistant test execution.

How do I verify that secret keys are not leaked to browser storage during E2E testing?

Verify secret keys are not leaked during E2E testing by adding security-oriented Playwright assertions that check localStorage, sessionStorage, IndexedDB, cookies, and the DOM after sensitive key-management operations execute.

What is the best way to test extrinsic submission flows and chain effects in a real browser?

The best way to test extrinsic submission flows and chain effects is using Playwright E2E tests with UI-observed assertions for extrinsic finalize, validating the full chain interaction path from page rendering through smoldot/Wasm.

Do I need a testnet to run Playwright E2E tests for frontend crypto and scanner logic?

Yes, you need to start required testnet and storage nodes before executing the corresponding Playwright spec file under apps/frontend to validate new Wasm cryptography or scanner logic end-to-end.

Why are my Playwright E2E tests failing on Ubuntu or WSL setups?

Playwright E2E tests may fail on Ubuntu or WSL setups due to Playwright MCP limitations on certain environments, requiring you to verify execution constraints and run commands for headless or headed modes accordingly.

Can I use Playwright to test UI state transitions and new routes in a Next.js frontend?

Yes, you can use Playwright to test UI state transitions and new routes in a Next.js frontend by exercising the full UI flow from page rendering through smoldot/Wasm/worker interaction to prevent frontend integration regressions.