스킬 tdd-vitest-typescript
📦

tdd-vitest-typescript

낮은 위험 📁 파일 시스템 액세스⚙️ 외부 명령어

Configurar TDD con Vitest y TypeScript

Escribir pruebas antes del código garantiza software confiable y mantenible. Esta guía te lleva a través del ciclo Rojo-Verde-Refactorizar con Vitest, cubriendo patrones de pruebas, estrategias de mocking y mejores prácticas de TDD.

지원: Claude Codex Code(CC)
🥉 73 브론즈
1

스킬 ZIP 다운로드

2

Claude에서 업로드

설정 → 기능 → 스킬 → 스킬 업로드로 이동

3

토글을 켜고 사용 시작

테스트해 보기

"tdd-vitest-typescript" 사용 중입니다. Ayúdame a escribir una prueba para una característica de registro de usuario usando TDD

예상 결과:

## Enfoque TDD: Registro de Usuario

### 1. Rojo - Escribir Prueba que Falla

```typescript
describe('User Registration', () => {
it('creates new user account with valid email', async () => {
const result = await registerUser({
email: 'new@example.com',
password: 'secure123',
});

expect(result.success).toBe(true);
expect(result.user.email).toBe('new@example.com');
});

it('rejects registration with existing email', async () => {
// ... test for duplicate email handling
});

it('rejects weak passwords', async () => {
// ... test for password validation
});
});
```

### 2. Verde - Implementación Mínima

Escribe solo el código suficiente para pasar las pruebas.

### 3. Refactorizar

Mejora la implementación manteniendo las pruebas verdes.

"tdd-vitest-typescript" 사용 중입니다. ¿Cómo configuro Vitest con TypeScript?

예상 결과:

## Configuración de Vitest + TypeScript

### Instalar Dependencias
```bash
npm install -D vitest @vitest/ui @vitest/coverage-v8 typescript @types/node
```

### Crear vitest.config.ts
```typescript
import { defineConfig } from 'vitest/config';

export default defineConfig({
test: {
globals: true,
environment: 'node',
coverage: {
provider: 'v8',
reporter: ['text', 'json', 'html'],
},
},
});
```

### Configurar tsconfig.json
```json
{
"compilerOptions": {
"types": ["vitest/globals", "node"],
"esModuleInterop": true,
"strict": true
}
}
```

보안 감사

낮은 위험
v1 • 1/23/2026

Legitimate TDD educational skill. Static analyzer flagged benign code patterns: TypeScript template literals misidentified as shell backticks, regex validation patterns misidentified as weak crypto, and project scaffolding fs operations. No malicious intent detected.

4
스캔된 파일
1,930
분석된 줄 수
5
발견 사항
1
총 감사 수
낮은 위험 문제 (3)
TypeScript Template Literals Misidentified
Static analyzer flagged TypeScript template literals (backticks) as shell command execution. These are standard code examples using backticks for multiline strings in test documentation.
Regex Patterns Misidentified as Crypto
Email validation and pattern matching regex expressions flagged as weak cryptographic algorithms. These are standard input validation patterns in test code.
Project Scaffolding Filesystem Operations
Setup script creates project files and directories using fs module. Operations are controlled for local project initialization only.

위험 요인

감사자: claude

품질 점수

64
아키텍처
100
유지보수성
87
콘텐츠
21
커뮤니티
84
보안
87
사양 준수

만들 수 있는 것

Comenzando una Nueva Característica con TDD

Un desarrollador quiere construir una nueva característica utilizando Desarrollo Guiado por Pruebas. La guía lo acompaña a escribir pruebas que fallan primero, implementar código mínimo y refactorizar manteniendo las pruebas verdes.

Aprendiendo Patrones de Pruebas con TypeScript

Un desarrollador nuevo en pruebas con TypeScript quiere aprender patrones para datos de prueba tipo-seguros, pruebas de funciones genéricas y estrategias de mocking adecuadas con Vitest.

Mejorando la Calidad de Pruebas

Un equipo quiere mejorar su suite de pruebas. La guía ayuda a identificar anti-patrones como probar detalles de implementación, configuración compleja y nombres de pruebas vagos.

이 프롬프트를 사용해 보세요

Configuración Básica de TDD
Ayúdame a configurar Desarrollo Guiado por Pruebas usando Vitest y TypeScript. Quiero seguir el ciclo Rojo-Verde-Refactorizar para construir una nueva característica.
Escribiendo Pruebas que Fallan
Escribe primero una prueba que falla para una clase Calculator con métodos add, subtract, multiply y divide. Luego muéstrame la implementación mínima para que las pruebas pasen.
Haciendo Mock de Dependencias
¿Cómo hago mock de una dependencia de API externa en Vitest? Necesito probar un servicio que llama a una API remota sin hacer solicitudes de red reales.
Evitando Anti-patrones de Pruebas
Revisa mi código de prueba e identifica cualquier anti-patrón. Mis pruebas son frágiles y se rompen cuando refactorizo aunque el comportamiento no haya cambiado.

모범 사례

  • Escribir pruebas que fallan primero antes de cualquier código de implementación para definir el comportamiento claramente
  • Mantener las pruebas enfocadas con una sola aserción por preocupación de prueba para facilitar la depuración
  • Probar el comportamiento público y los resultados en lugar de los detalles de implementación privados

피하기

  • Probar detalles de implementación como métodos privados que pueden cambiar durante la refactorización
  • Usar delays arbitrarios de sleep o timeout en pruebas en lugar de esperar condiciones reales
  • Crear configuraciones de prueba masivas con docenas de líneas de código repetitivo en lugar de helpers reutilizables

자주 묻는 질문

¿Qué es el ciclo TDD?
TDD sigue tres fases: Rojo (escribir una prueba que falla), Verde (escribir código mínimo para pasar), y Refactorizar (mejorar el código manteniendo las pruebas verdes). Este ciclo asegura que las pruebas definan el comportamiento antes de la implementación.
¿Cómo ejecuto Vitest en modo watch?
Ejecuta 'vitest' sin argumentos para iniciar el modo watch. Las pruebas se ejecutan automáticamente cuando los archivos cambian, permitiendo iteraciones TDD rápidas.
¿Qué convención de nombres de archivos de prueba usa Vitest?
Vitest reconoce archivos nombrados *.test.ts o *.spec.ts. Coloca las pruebas junto a los archivos fuente o en directorios __tests__.
¿Cómo hago mock de un módulo en Vitest?
Usa vi.mock() antes de los imports: 'vi.mock("./api");'. Luego usa vi.mocked() para escribir tipo las devoluciones del mock o vi.fn() para funciones spy.
¿Qué objetivo de cobertura debo buscar?
Apunta a 80%+ de cobertura en lógica de negocio y 100% en rutas críticas como autenticación. Evita obsesionarse con 100% de cobertura en todas partes.
¿Cómo pruebo código asíncrono con Vitest?
Usa async/await con expect(result).rejects.toThrow() para promesas rechazadas, o usa .resolves para promesas cumplidas.

개발자 세부 정보

작성자

Emz1998

라이선스

MIT

참조

main