testing
Estandariza la creación de tests unitarios, de integración y de componentes con Vitest.
Install
mkdir -p .claude/skills/testing-sammysnake-d && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/14265" && unzip -o skill.zip -d .claude/skills/testing-sammysnake-d && rm skill.zipInstalls to .claude/skills/testing-sammysnake-d
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
测试规范与最佳实践。Use when writing unit tests, integration tests, or component tests. Triggers on: creating test files, using Vitest, Testing Library, mocking, test organization questions.Key capabilities
- →Organize test files in a `__tests__` directory
- →Define unit tests using `*.test.ts` or `*.test.tsx`
- →Define integration tests using `*.spec.ts` or `*.spec.tsx`
- →Mock dependencies using `vi.mock` from Vitest
- →Run all tests or watch for changes
How it works
It provides guidelines for structuring test files, naming conventions, and using Vitest for writing unit and integration tests. It also specifies how to mock services and check test coverage.
Inputs & outputs
When to use testing
- →Escribir tests unitarios para funciones
- →Crear tests de componentes con React
- →Simular dependencias con vi.mock
- →Ejecutar suites de tests y ver cobertura
About this skill
Testing Guide
测试规范，涵盖 Vitest、Testing Library 和测试组织。
Quick Start
import { describe, it, expect } from 'vitest';
describe('ModuleName', () => {
it('should behavior description', () => {
expect(actual).toBe(expected);
});
});
Test Location
All tests in __tests__/ directory, mirroring source structure:
__tests__/
├── lib/utils/
├── lib/services/
├── components/
└── hooks/
File Naming
- Unit tests:
*.test.ts/*.test.tsx - Integration tests:
*.spec.ts/*.spec.tsx
Commands
pnpm test # Run all tests
pnpm test:watch # Watch mode
pnpm test:coverage # Coverage report
Component Test
import { render, screen } from '@testing-library/react';
import { Button } from '@/components/ui/button';
describe('Button', () => {
it('should render children', () => {
render(<Button>Click</Button>);
expect(screen.getByText('Click')).toBeInTheDocument();
});
});
Mocking
import { vi } from 'vitest';
vi.mock('@/lib/services', () => ({
UserService: {
getUser: vi.fn().mockResolvedValue({ id: '1' }),
},
}));
Coverage Requirements
- Normal path - Expected behavior
- Edge cases - Empty, null, boundary values
- Error handling - Exception scenarios
When not to use it
- →When the project does not use Vitest or Testing Library
- →When the project does not follow the `__tests__` directory structure
Limitations
- →It focuses on Vitest and Testing Library.
- →It requires tests to be located in a `__tests__` directory.
- →It specifies file naming conventions like `*.test.ts` and `*.spec.ts`.
How it compares
This skill provides specific conventions for test file location, naming, and mocking within a Vitest and Testing Library environment, rather than using generic testing approaches.
Compared to similar skills
testing side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| testing (this skill) | 0 | 7mo | Review | Beginner |
| ui-ux-expert-skill | 91 | 9mo | Review | Advanced |
| react-best-practices | 22 | 3mo | No flags | Intermediate |
| frontend-testing | 11 | 3mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
ui-ux-expert-skill
fercracix33
Technical workflow for implementing accessible React user interfaces with shadcn/ui, Tailwind CSS, and TanStack Query. Includes 6-phase process with mandatory Style Guide compliance, Context7 best practices consultation, Chrome DevTools validation, and WCAG 2.1 AA accessibility standards. Use after Test Agent, Implementer, and Supabase agents complete their work.
react-best-practices
redpanda-data
Client-side React performance optimization patterns.
frontend-testing
langgenius
Generate Vitest + React Testing Library tests for Dify frontend components, hooks, and utilities. Triggers on testing, spec files, coverage, Vitest, RTL, unit tests, integration tests, or write/review test requests.
feature-flags
Use when feature flag tests fail, flags need updating, understanding @gate pragmas, debugging channel-specific test failures, or adding new flags to React.
playwright-validation
open-metadata
Use when validating UI changes in a branch require Playwright E2E testing. Reviews branch changes, validates UI with Playwright MCP, and adds missing test cases.
senior-qa
alirezarezvani
This skill should be used when the user asks to "generate tests", "write unit tests", "analyze test coverage", "scaffold E2E tests", "set up Playwright", "configure Jest", "implement testing patterns", or "improve test quality". Use for React/Next.js testing with Jest, React Testing Library, and Playwright.