playwright-app-testing

A browser-testing procedure for the Expensify App using Playwright. Playwright is a tool that automates a real web browser so an app can be tested through its interface.

In plain words
What is it for?
It helps open the development app, create or use a test account, interact with screens, and check whether browser-based fixes work.
Why use it?
It helps verify frontend changes and investigate user-interface problems without relying only on code inspection.

Skill for Claude CodeCodex

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/expensify/app/playwright-app-testing
Any agent
npx skills add Expensify/App --skill playwright-app-testing
Clone the repo
git clone --depth 1 https://github.com/Expensify/App

Made for: Claude Code, Codex.

Per session 34 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 701 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00034 $0.00701
Opus 5 $0.00017 $0.00351
Sonnet 5 $0.00007 $0.00140
Haiku 4.5 $0.00003 $0.00070

Measured 2d ago against content hash fd1bfab68163, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

playwright-app-testing scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.claude/skills/playwright-app-testing/SKILL.md · 81 lines

How it starts

The opening of the file, as written. The whole thing — 81 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Playwright App Testing

When to Use This Skill

Use Playwright testing when:

  • User requests testing the App in a browser
  • Verifying fixes or improvements you've made to UI/frontend code
  • Debugging UI issues

Proactively use after making frontend changes to verify your work functions correctly.

Prerequisites Check

Before using Playwright tools, verify the dev server is running:

ps aux | grep "rspack" | grep -v grep

If server not running: Inform user to start with cd App && npm run web

Dev Server Details

  • URL: https://dev.new.expensify.com:8082/

Playwright Testing Workflow

  1. Verify server: Check Rspack process is running
  2. Navigate: Open https://dev.new.expensify.com:8082/ in the browser
  3. Interact: Use Playwright MCP tools to inspect, click, type, and navigate

Do NOT add arbitrary waits after actions. Instead, take a snapshot to check the result and only add short waits if the page hasn't updated yet.

Dev Environment Sign-In

When signing in to dev environment:

  • Email: Generate random Gmail address (e.g., user+throwaway<random>@gmail.com)
    • New Account: Press join to create account
    • Existing Account: Security code: Always 000000
  • Onboarding: The SKIP_ONBOARDING env flag is set to false by default in .env. When false, onboarding screens will appear after sign-in for new accounts. Unless you are specifically asked to test onboarding, update the flag to true before starting the dev server so that onboarding is bypassed entirely:
    sed -i '' 's/SKIP_ONBOARDING=false/SKIP_ONBOARDING=true/' .env
    
    If you need to test onboarding flows, set it back to false:
    sed -i '' 's/SKIP_ONBOARDING=true/SKIP_ONBOARDING=false/' .env
    
    You can check the current value with:
    grep SKIP_ONBOARDING .env
    
    Important: After changing SKIP_ONBOARDING in .env, the web dev server must be restarted for the change to take effect.

Read the full file on GitHub · 81 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2d ago First seen · 81 lines · 34 tokens per session scan A fd1bfab68163

Subscribe to this mod's changes

playwright-app-testing is a skill published in the GitHub repository Expensify/App (5,017 stars, last pushed today), licensed MIT. It adds 34 tokens to every session and 701 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

systematic-debugging

Use when encountering any bug, test failure, or unexpected behavior, before proposing fixes.

obra/superpowers · 21 tokens

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.

obra/superpowers · 37 tokens

chat-pet-sprite-creation

Use when creating or changing VS Code chat pet sprite art, sprite sheets, state animations, eye treatments, Stable/Insiders variants, or pet transitions under src/vs/workbench/contrib/chat/browser/widget/media/chatPet.

microsoft/vscode · 53 tokens

cpu-profile-analysis

Analyze V8/Chrome CPU profiles (.cpuprofile) and DevTools trace files (Trace-.json). Use when: profiling performance, investigating slow functions, comparing code paths, finding bottlenecks, analyzing timeToRequest, understanding call trees from sampling profiler data, analyzing layout/paint/rendering, investigating…

microsoft/vscode · 71 tokens

agent-host-chat-contributions

Build and review cross-cutting agent-host chat behavior through lifecycle contributions. Use when adding turn lifecycle side effects, prompt or context injection, restored-history transformation, protocol-action observation, or when reviewing changes that add code to AgentSideEffects or AgentService.

microsoft/vscode · 56 tokens

auto-perf-optimize

Run agent-driven VS Code performance or memory investigations. Use when asked to launch Code OSS, automate a VS Code scenario, run the Chat memory smoke runner, capture renderer heap snapshots, take workflow screenshots, compare run summaries, or drive a repeatable scenario before heap-snapshot analysis.

microsoft/vscode · 62 tokens