uniswap/interface
Overview
This skill runs, creates, and debugs Playwright end-to-end tests for the Uniswap web app. Always invoke this skill using the SlashCommand tool (/web-e2e) before attempting to run or debug any e2e, Playwright, or Anvil tests so you learn the correct commands, test architecture, and required environment. It enforces the repo conventions and provides the exact commands to start servers, Anvil, and Playwright safely.
How this skill works
The skill inspects the apps/web/ test layout, Playwright fixtures, mocks, and the automatic test wallet setup so you know how tests start and what state they expect. It explains the import pattern getTest(), available fixtures (graphql, anvil, tradingApi, amplitude), mock usage, and the required dev commands (bun e2e, bun preview:e2e, bun anvil:mainnet, bun playwright:test). It also guides on running headed/debug/ui modes and Playwright MCP integration.
When to use it
- Before running or debugging any Playwright or Anvil tests — always call /web-e2e first
- When creating new e2e tests for UI flows that depend on wallet or blockchain state
- When you need to mock GraphQL, Trading API, or analytics in tests
- When configuring or troubleshooting Anvil state, snapshots, or balances
- When you want to run tests in debug/headed/UI mode or use Playwright MCP for inspection
Best practices
- Invoke this skill to learn correct commands and avoid running bun playwright test directly
- Use getTest() or getTest({ withAnvil: true }) to get the right fixtures for each test
- Prefer TestID enum selectors; avoid string literals for stability
- Mock external services via graphql and tradingApi fixtures before navigation
- Always start the Vite preview server (bun preview:e2e) before running tests; bun e2e commands start it for you
Example use cases
- Create a swap end-to-end test using TestID selectors and set ERC20 balances with anvil.setErc20Balance
- Debug a flaky GraphQL response by intercepting OperationName with graphql.intercept and timing assertions
- Run only non-blockchain tests with bun e2e:no-anvil for faster iteration
- Reproduce a failing Anvil test by taking snapshots and reverting state across runs
- Use Playwright MCP to interactively explore UI and capture TestIDs for new tests
FAQ
The slash command provides the repository-specific commands, environment variables, and architecture details so you run tests with the correct servers, Anvil handling, and auto-connected test wallet; running playwright directly can fail or produce inconsistent state.
What is the automatic test wallet and how does it affect tests?
Playwright tests auto-connect TEST_WALLET_ADDRESS (displays as "test0") via wagmiAutoConnect.ts. Tests assume a connected wallet, so you should set balances/allowances via anvil fixtures when testing on-chain flows.
