JavaScript de Cero a Experto / Testing con Vitest
Construye tu propio expect: un framework en 15 líneas
Antes de usar Vitest, vas a construirlo —en miniatura. Un framework de testing no es magia: son un puñado de funciones que ejecutan comprobaciones y te dicen cuáles pasaron. Al escribirlo con tus manos, cuando abras Vitest en la próxima lección vas a reconocer cada pieza. Es el método de este curso: primero por dentro, después la herramienta real.
La maquinaria bajo el capó
expect().toBe(): el corazón
Empecemos por lo mínimo que sirve. expect(valor) devuelve un objeto con
métodos de comparación (los "matchers"). El más básico compara con ===:
Léelo despacio: expect(sumar(2, 3)) guarda el valor RECIBIDO, y .toBe(5)
lo compara con el ESPERADO, imprimiendo ✓ o ✗. Esa frase —expect(...).toBe (...)— es, palabra por palabra, la misma que escribirás en Vitest. Acabas de
construir el gesto central del testing en siete líneas.
test(): agrupar y etiquetar
Ahora envolvamos cada comprobación en un test() con nombre, para que el
marcador sea legible. Y agreguemos más matchers —un juez necesita varias
formas de comparar:
Mira lo que lograste: un test() que atrapa el fallo (con el try/catch del
módulo 15 —¿ves cómo todo se conecta?), lo marca ✗ y sigue con los demás en
vez de morir. Y un matcher nuevo, toEqual, que compara CONTENIDO en vez de
identidad —crucial para objetos y arrays. Ese detalle es la trampa más famosa
del testing, y la desarmamos ahora mismo.
toBe vs toEqual: la trampa de los objetos
Escribes expect(obtenerUsuario()).toBe({ id: 1, nombre: 'Sara' }) y el test falla, aunque la función devuelve exactamente ese objeto. ¿Por qué?
Mini-reto
Extiende tu juez: 1) agrega a expect un matcher toBeGreaterThan(n) que
lance si recibido <= n; 2) agrega toContain(item) que verifique que un
array incluye un elemento; 3) escribe tres test() que los usen sobre
funciones tuyas, incluyendo uno que falle a propósito para ver el ✗ con su
mensaje. Cada matcher que construyes es uno que vas a reconocer en Vitest.
Qué sigue
Tienes el framework por dentro. Ahora conoce el de verdad: Vitest instalado
en un proyecto real, con describe, it, expect y decenas de matchers ya
hechos, corriendo en modo watch que re-testea al guardar. Vas a reconocer
todo —porque acabas de construir su corazón.