Playwright E2E test setup and authoring for any web application. Plan-first: when asked to write or generate E2E tests, draft a markdown test plan (Overview, Seed, TC-numbered scenarios with Steps + Expected Results) and confirm scope with the user BEFORE writing any .spec.ts. Inspired by Playwright Test Agents (planner → generator → healer): plan, generate from the plan, then run + heal once before declaring done. Use this skill any time the user wants to create, set up, fix, scaffold, or migrate browser-level tests for a web application — whether or not they mention Playwright by name. Typical asks: "write a test for [page/route/flow]", "add e2e coverage for [feature I just shipped]", "generate an e2e test plan", "set up Playwright in [repo]", "fix our broken Playwright setup", "migrate Cypress to Playwright", "add a page object for [X]", "create a fixture that composes with authedPage", "switch our auth helper from token-bypass to real Cognito/SSO/Singpass", "wire up storageState/JWT/session cookies/mol-to
GCC deployment via Rabbit Deploy — initialize a local project with git, configure the Rabbit Deploy GitLab remote with a Project Access Token, and push to trigger automatic deployment. Use when a user wants to deploy their project to GCC using Rabbit Deploy, set up version control for the first time, or push code changes to trigger the CI/CD pipeline.
Enhancement Proposal (EP) creation — stepwise, KEP-style EP authoring with template discovery, parallel codebase research, and structured Part-1 / Part-2 / Part-3 generation. Use when creating or drafting an EP or feature design document.
Implementation plan generation — decomposes an EP or task description into a parallelised, phase-based workplan with a Mermaid dependency graph, critical path analysis, per-task agent prompts, and a parallel dispatch table. Use when creating an implementation plan for an EP or any task description.
React 18 patterns reference — concurrent rendering, automatic batching, transitions, Suspense, new hooks (useId, useTransition, useDeferredValue, useSyncExternalStore), streaming SSR, and TypeScript integration. Use when implementing, reviewing, or debugging React components in any React 18.x project.
React 19.2 modern patterns reference — hooks, Actions API, Server Components, concurrent rendering, TypeScript integration, and quality-of-life improvements. Use when implementing, reviewing, or debugging React components in any React 19+ project.
React beginner fundamentals — JSX, functional components, props, state, conditional rendering, list rendering, useEffect, data fetching, component composition, and common rookie mistakes. Use when implementing basic React features or when the user is new to React.
CSS fundamentals — box model, flexbox, grid, units, specificity, positioning, z-index, and responsive design. Library-agnostic. Use when writing, reviewing, or debugging styles in any web project regardless of CSS library or framework.