Cobertura de pruebas en JavaScript: herramientas y métricas de código

Cobertura de código con pruebas en JavaScript: herramientas y métricas

Imagina que eres el capitán de un enorme transatlántico. Tu equipo revisa diligentemente los motores, la navegación y los sistemas de seguridad. Pero un día decides no revisar el sistema de refrigeración porque «funcionó ayer». El resultado es predecible: sobrecalentamiento, avería, y quedas a la deriva en mar abierto. En el mundo de JavaScript, esta negligencia se llama «falta de cobertura de código con pruebas».

Escribes pruebas, eso es genial. Pero, ¿cómo saber si realmente lo has verificado todo y no solo has creado una ilusión de seguridad? La respuesta son las métricas de cobertura de código. Muestran qué parte de tu aplicación se ejecutó durante las pruebas. Sin estas métricas, corres el riesgo de pasar por alto un error crítico que se esconde en una rama de condición no verificada.

En este artículo, analizaremos cómo medir correctamente la cobertura de código con pruebas en JavaScript, qué herramientas existen para ello y cómo interpretar las métricas para no perjudicarte. ¡Sumérgete en el mundo del code coverage sin aburrimiento!

¿Qué es la cobertura de código y por qué es importante?

Cobertura de código (code coverage) es una métrica que muestra cuántas líneas, funciones o ramas de tu código se ejecutaron al ejecutar las pruebas. En pocas palabras, es el porcentaje de código «verificado».

Muchos desarrolladores creen que el 100% de cobertura es el santo grial. Pero no es exactamente así. La cobertura es una herramienta, no un objetivo. Ayuda a:

\n
• Encontrar código «muerto» que nunca se ejecuta (y posiblemente no sea necesario).
\n
• Comprender qué partes del código quedaron sin pruebas y evaluar el riesgo.
\n
• Aumentar la confianza en la refactorización: si la cobertura no baja, no has roto nada.
\n

Pero también hay trampas. El 100% de cobertura no garantiza la ausencia de errores. Puedes verificar todas las líneas, pero pasar por alto un error lógico en las reglas de negocio. Por lo tanto, la cobertura de pruebas en JavaScript debe considerarse en conjunto con la calidad de las propias pruebas.

Métricas principales de cobertura de código

Antes de elegir una herramienta, analicemos qué métricas existen. Las métricas de cobertura de código se dividen en varios tipos, y cada uno responde a su propia pregunta.

Cobertura de líneas (Line Coverage)

Es la métrica más simple. Muestra cuántas líneas del código fuente se ejecutaron al menos una vez. Si tienes 100 líneas y las pruebas ejecutaron 80, la cobertura de líneas es del 80%.

Cobertura de ramas (Branch Coverage)

Una métrica más profunda. Analiza todas las rutas posibles de ejecución del código (ramas if/else, operadores ternarios, switch). Por ejemplo, si tienes una condición if (a > 5), hay dos ramas: true y false. Si tu prueba solo verifica el caso en que a > 5, la cobertura de ramas será del 50%.

Cobertura de funciones (Function Coverage)

Muestra cuántas funciones (o métodos) fueron invocadas durante las pruebas. Si una función está declarada pero nunca se llama, no está cubierta.

Cobertura de sentencias (Statement Coverage)

Es similar a la cobertura de líneas, pero opera con sentencias individuales (expresiones) en lugar de líneas. En JavaScript, estos conceptos a menudo se superponen, pero formalmente son cosas diferentes.

Para proyectos reales, el análisis de cobertura JS generalmente incluye las cuatro métricas. Pero la atención principal debe centrarse en la cobertura de ramas, ya que es la que revela los escenarios omitidos.

Herramientas para medir la cobertura en JavaScript

Afortunadamente, el ecosistema de JavaScript es rico en herramientas. Revisaremos las más populares: desde las simples hasta las avanzadas.

Istanbul (nyc) — el estándar de oro

Istanbul es la herramienta más popular para medir la cobertura de código con pruebas en JavaScript. Funciona con prácticamente cualquier test-runner: Jest, Mocha, Ava, Cypress. Después de la instalación, simplemente ejecutas las pruebas con el envoltorio nyc.

Ejemplo de instalación y ejecución: