القائمة
TypeScript React frontend workflow for components, state, routing, typecheck, tests, builds, and browser smoke evidence.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Built-in browser automation and E2E verification workflow. Use for Claude /wf-browser, Codex $wf-browser or /skills wf-browser, Browser Use, Playwright, Chrome DevTools/CDP, screenshots, forms, UI verification, and browser-visible acceptance.
Codex compatibility: use $wf-help or /skills wf-help in Codex to show the Harness WF command table. Claude Code and OpenCode use the direct /wf-help command.
Use for /wf-max in Claude Code, $wf-max or /skills wf-max in Codex. WF-MAX is explicit only — the user must type /wf-max, $wf-max, or /skills wf-max.
Use when work needs bounded subagent coordination, parallel read-only exploration, independent review gates, broad context partitioning, or controlled handoffs.
Test-driven development. Use when the user wants to build features or fix bugs test-first, mentions "red-green-refactor", or wants integration tests.
Source-backed CLI invocation guide for Claude Code, Codex, and OpenCode automation. Use when invoking peer CLIs, writing batch tests, collecting cache telemetry, debugging command-line flags, or documenting cross-runtime agent usage for Harness workflows.
| name | ts-react-frontend |
| description | TypeScript React frontend workflow for components, state, routing, typecheck, tests, builds, and browser smoke evidence. |
Use this skill when changing React components, hooks, routes, client state, styling, build configuration, or frontend tests. For user-visible changes, typecheck, build, and unit tests are not enough; include real-browser smoke or screenshot evidence before claiming acceptance.
Harness/workflows/ts-react-frontend.mdHarness/PROGRESS.md and current task tasks/<id>/PLAN.mddata-testid hooks for critical inputs, buttons, filters, rows, empty/error/loading states, and other targetable UI states.tasks/<id>/PLAN.md when tracking a plan item.Return changed files, UI behavior summary, commands run, browser or test evidence, and unresolved risks. Include selectors added or verified for CDP/Playwright/manual checks.
Update Harness/tasks/<task-id>/PLAN.md only when executing a tracked task or recording required validation evidence.
Use Harness/specs/runtime/dispatch.md when independent frontend tasks can run in parallel, such as components, tests, and browser checks.