模板详情

React Testing Library 测试规则

帮助 React 团队让 AI 生成的测试关注行为,而不是组件内部实现细节。

CursorWindsurfClaude Code.cursor/rules.cursorrulesCLAUDE.md
438投票
7,350安装量
已验证状态

安装预览

命令仍是 MVP 预览。真实使用前请检查目标文件和覆盖行为。

npx rulesmarket add frontend-testing-library
返回模板库
.cursor/rules/react-testing.mdc
---
description: React Testing Library rules
globs: ["**/*.{test,spec}.{ts,tsx}", "**/*.tsx"]
alwaysApply: false
---

# React Testing Rules

- Test user-visible behavior, not component internals.
- Prefer role, label and text queries that mirror accessibility semantics.
- Avoid brittle snapshots unless they protect a deliberate rendering contract.
- Use realistic interaction flows and assert loading, error and empty states.
- Keep mocks narrow and local; do not mock the component under test.
- Add regression tests for bug fixes touching shared components or workflow logic.

它会指定测试运行器吗?

不会。它适用于 Vitest、Jest 或仓库已经采用的测试运行器。

为什么强调 role 查询?

role 查询更接近用户和辅助技术看到的界面,能让测试更稳定,也能反馈可访问性问题。