Fundamentos de Testing

Por Qué Importa el Testing

El testing de software es el proceso de verificar que tu aplicación funciona como se espera y continúa funcionando a medida que haces cambios. No se trata solo de encontrar bugs—se trata de construir confianza, permitir desarrollo rápido y servir como documentación viva para tu código base.

Beneficios del Testing Automatizado

Tipos de Testing

Tu Primer Test Unitario

Escribamos un test unitario simple usando Jest:

// sum.js - Función a testear
export function sum(a, b) {
  return a + b;
}

export function subtract(a, b) {
  return a - b;
}

export function multiply(a, b) {
  return a * b;
}

export function divide(a, b) {
  if (b === 0) {
    throw new Error("No se puede dividir por cero");
  }
  return a / b;
}

// sum.test.js - Archivo de test
import { sum, subtract, multiply, divide } from './sum';

describe('Operaciones matemáticas', () => {
  // Test para función sum
  test('suma 1 + 2 para igual a 3', () => {
    expect(sum(1, 2)).toBe(3);
  });

  test('suma números negativos correctamente', () => {
    expect(sum(-1, -2)).toBe(-3);
  });

  // Test para función subtract
  test('resta 5 - 3 para igual a 2', () => {
    expect(subtract(5, 3)).toBe(2);
  });

  // Test para función multiply
  test('multiplica 3 * 4 para igual a 12', () => {
    expect(multiply(3, 4)).toBe(12);
  });

  test('multiplicar por cero devuelve cero', () => {
    expect(multiply(5, 0)).toBe(0);
  });

  // Test para función divide
  test('divide 10 / 2 para igual a 5', () => {
    expect(divide(10, 2)).toBe(5);
  });

  test('lanza error al dividir por cero', () => {
    expect(() => divide(10, 0)).toThrow('No se puede dividir por cero');
  });
});

// Ejecutar tests con: npm test

Testing de Componentes React

// Button.jsx - Componente a testear
export function Button({ onClick, disabled, children }) {
  return (
    
      {children}
    
  );
}

// Button.test.jsx - Test del componente
import { render, screen, fireEvent } from '@testing-library/react';
import { Button } from './Button';

describe('Componente Button', () => {
  test('renderiza con el texto correcto', () => {
    render(Click me);
    
    const button = screen.getByText('Click me');
    expect(button).toBeInTheDocument();
  });

  test('llama onClick cuando se hace clic', () => {
    const handleClick = jest.fn();
    render(Click me);
    
    const button = screen.getByText('Click me');
    fireEvent.click(button);
    
    expect(handleClick).toHaveBeenCalledTimes(1);
  });

  test('no llama onClick cuando está deshabilitado', () => {
    const handleClick = jest.fn();
    render(
      
        Click me
      
    );
    
    const button = screen.getByText('Click me');
    fireEvent.click(button);
    
    expect(handleClick).not.toHaveBeenCalled();
  });

  test('tiene atributo disabled cuando prop disabled es true', () => {
    render(Click me);
    
    const button = screen.getByText('Click me');
    expect(button).toBeDisabled();
  });
});

Desarrollo Guiado por Tests (TDD)

Patrones Comunes de Testing

test('usuario puede agregar item al carrito', () => {
  // Arrange: Configurar datos de test
  const cart = new ShoppingCart();
  const item = { id: 1, name: 'Libro', price: 20 };
  
  // Act: Realizar la acción
  cart.addItem(item);
  
  // Assert: Verificar el resultado
  expect(cart.items).toHaveLength(1);
  expect(cart.total).toBe(20);
});

describe('Tests de base de datos', () => {
  let db;
  
  // Ejecutar antes de cada test
  beforeEach(async () => {
    db = await connectDatabase();
    await db.clear();
  });
  
  // Ejecutar después de cada test
  afterEach(async () => {
    await db.disconnect();
  });
  
  test('puede guardar usuario', async () => {
    const user = { name: 'Alice', email: 'alice@example.com' };
    await db.users.save(user);
    
    const savedUser = await db.users.findOne({ email: 'alice@example.com' });
    expect(savedUser.name).toBe('Alice');
  });
});

// Testear múltiples inputs eficientemente
test.each([
  [1, 1, 2],
  [1, 2, 3],
  [2, 2, 4],
  [-1, 1, 0],
  [0, 0, 0],
])('sum(%i, %i) devuelve %i', (a, b, expected) => {
  expect(sum(a, b)).toBe(expected);
});