javascript-testing-patterns
Domina los Patrones de Pruebas de JavaScript
También disponible en: wshobson
Escribir pruebas es difícil. Esta habilidad proporciona patrones probados y ejemplos para pruebas unitarias, de integración y de extremo a extremo usando Jest, Vitest y Testing Library para que puedas construir suites de pruebas confiables rápidamente.
Descargar el ZIP de la skill
Subir en Claude
Ve a Configuración → Capacidades → Skills → Subir skill
Activa y empieza a usar
Pruébalo
Usando "javascript-testing-patterns". Escribe pruebas unitarias para una función add que toma dos números y devuelve su suma
Resultado esperado:
- ```typescript
- import { describe, it, expect } from 'vitest';
- import { add } from './calculator';
- describe('add', () => {
- it('should add two positive numbers', () => {
- expect(add(2, 3)).toBe(5);
- });
- it('should add negative numbers', () => {
- expect(add(-2, -3)).toBe(-5);
- });
- it('should handle zero', () => {
- expect(add(0, 5)).toBe(5);
- });
- });
- ```
Usando "javascript-testing-patterns". Crea una prueba para un componente de formulario de usuario que valida el email y envía los datos
Resultado esperado:
- ```typescript
- import { render, screen, fireEvent } from '@testing-library/react';
- import { describe, it, expect, vi } from 'vitest';
- import { UserForm } from './UserForm';
- describe('UserForm', () => {
- it('should show validation error for invalid email', () => {
- render(<UserForm onSubmit={vi.fn()} />);
- fireEvent.change(screen.getByTestId('email-input'), {
- target: { value: 'invalid-email' }
- });
- fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
- expect(screen.getByText('Invalid email')).toBeInTheDocument();
- });
- it('should call onSubmit with form data', () => {
- const onSubmit = vi.fn();
- render(<UserForm onSubmit={onSubmit} />);
- fireEvent.change(screen.getByTestId('name-input'), {
- target: { value: 'John Doe' }
- });
- fireEvent.change(screen.getByTestId('email-input'), {
- target: { value: 'john@example.com' }
- });
- fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
- expect(onSubmit).toHaveBeenCalledWith({
- name: 'John Doe',
- email: 'john@example.com'
- });
- });
- });
- ```
Auditoría de seguridad
SeguroAll 145 static findings are false positives. The detected patterns exist only in code examples within markdown documentation files, not in executable code. The skill provides educational content about testing patterns with code samples demonstrating legitimate testing practices including mock setup, API testing, email service testing, and database integration testing. No executable code, no security risks.
Puntuación de calidad
Lo que puedes crear
Configuración de Pruebas para Proyecto Nuevo
Desarrolladores que inician un nuevo proyecto JavaScript/TypeScript que necesitan establecer infraestructura de pruebas desde cero con configuración adecuada del framework, estructura de directorios e integración CI/CD.
Agregar Pruebas a Código Existente
Equipos que mantienen aplicaciones heredadas o sin probar que necesitan introducir gradualmente pruebas para funciones, APIs y componentes existentes sin romper la funcionalidad existente.
Mejorar Cobertura de Pruebas
Desarrolladores que buscan aumentar la cobertura de código y mejorar la calidad de las pruebas aprendiendo patrones avanzados de mocking, factories de fixtures y estrategias de pruebas de integración.
Prueba estos prompts
Escribe pruebas unitarias para una función que [describe qué hace la función]. Incluye pruebas para casos de éxito y manejo de errores.
Crea pruebas de React Testing Library para un componente que [describe el comportamiento del componente]. Prueba interacciones de usuario, envíos de formularios y estados de error.
Escribe pruebas de integración para un endpoint de API REST que [describe la funcionalidad del endpoint]. Incluye configuración de base de datos, autenticación y limpieza usando supertest.
Crea pruebas para [servicio/clase] que mockeen dependencias externas incluyendo [lista dependencias]. Usa inyección de dependencias y patrones vi.mock.
Mejores prácticas
- Sigue el patrón Arrange-Act-Assert (AAA) en cada prueba para una estructura clara y legibilidad
- Prueba el comportamiento y las interacciones del usuario en lugar de los detalles de implementación para hacer las pruebas resilientes al refactoring
- Usa los hooks beforeEach y afterEach para la configuración y limpieza para mantener las pruebas aisladas y prevenir contaminación
Evitar
- Probar detalles de implementación como llamadas a funciones internas o el estado de los componentes en lugar del comportamiento observable
- Escribir pruebas frágiles que se rompen cuando el código se refactoriza pero el comportamiento permanece sin cambios
- Crear configuraciones de pruebas excesivamente complejas con demasiados mocks que hacen que las pruebas sean difíciles de entender y mantener
Preguntas frecuentes
¿Debo usar Jest o Vitest?
¿Cómo pruebo código que usa APIs externas?
¿Qué cobertura de pruebas debo buscar?
¿Debo probar los métodos privados?
¿Cómo manejo las pruebas de base de datos?
¿Cuál es la diferencia entre pruebas unitarias y de integración?
Detalles del desarrollador
Autor
sickn33Licencia
MIT
Repositorio
https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/javascript-testing-patternsRef.
main
Estructura de archivos