菜单
Behavior-driven front-end testing with DOM Testing Library and user-event. Use when writing or reviewing UI tests for React, Vue, Svelte, browser DOM code, forms, accessibility behavior, async rendering, loading states, error states, or user interactions.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Use when asked to find first customers, early adopters, design partners, beta users, or leads for a startup or product idea, to research who might buy, to define an ideal customer profile (ICP), or to validate early demand from public signals — given a product URL, repository, or description.
Shared vocabulary for designing deep modules. Use when the user wants to design or improve a module's interface, find deepening opportunities, decide where a seam goes, make code more testable or AI-navigable, or when another skill needs the deep-module vocabulary.
Feedback-loop-first diagnosis for hard bugs and performance regressions — build a tight red-capable repro loop before hypothesising.
Build and sharpen a project's domain model. Use when the user wants to pin down domain terminology or a ubiquitous language, record an architectural decision, or when another skill needs to maintain the domain model.
Compact the current conversation into a handoff document for another agent to pick up.
Feedback-loop-first diagnosis for hard bugs and performance regressions — build a tight red-capable repro loop before hypothesising.
| name | front-end-testing |
| description | Behavior-driven front-end testing with DOM Testing Library and user-event. Use when writing or reviewing UI tests for React, Vue, Svelte, browser DOM code, forms, accessibility behavior, async rendering, loading states, error states, or user interactions. |
Test behavior users can observe, not implementation details. Prefer accessible queries because they verify both behavior and semantic markup.
userEvent.setup() per test and await user interactions.getBy* for required elements, queryBy* for absence, and findBy* for async appearance.container.querySelector, class-name selectors, internal state assertions, and brittle snapshots.userEvent.Read references/claude-front-end-testing.md for query examples, async patterns, mocking guidance, and common anti-patterns.