Menu
Test React components with Testing Library — render, query by role, and assert on user-visible behavior.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
| name | react-component-testing |
| description | Test React components with Testing Library — render, query by role, and assert on user-visible behavior. |
| version | 1.2.0 |
| tags | ["react","testing","frontend"] |
| status | active |
Test what the user sees, not implementation details.
render(<Component />) from @testing-library/react.screen.getByRole('button', { name: /save/i }).userEvent, then assert on the resulting DOM.container.querySelector and snapshot-everything tests — they break on refactors.Prefer findBy* for async UI and getBy* for content that is already present.
Find the commit that introduced a regression automatically with git bisect run.
Configure Jest for a TypeScript project — ts-jest, module mapping, and coverage thresholds.
Diagnose a slow Postgres query and add the right index using EXPLAIN ANALYZE.
Fix TypeScript ES module import errors by adding .js extensions to relative imports.
Migrate a Jest test suite to Vitest — config, globals, and mock API differences.
Comprehensive guide for creating high-quality skills for Claude. Use when building a new skill, writing a SKILL.md, designing skill frontmatter, planning skill structure, debugging trigger issues, or reviewing an existing skill for improvements. Covers standalone skills, MCP-enhanced skills, and skill-tree programmatic skills.