Cómo escribir tu primera prueba unitaria en JavaScript

Probar el código es el primer paso para protegerlo. Una de las mejores formas de hacerlo es usar pruebas unitarias, que verifican que cada una de las funciones más pequeñas de una aplicación se comporte como debería, sobre todo cuando recibe datos extremos, no válidos o potencialmente dañinos.

¿Por qué hacer pruebas unitarias?

Hay muchas formas de hacer pruebas unitarias. Algunos de sus principales objetivos son:

• Verificar la funcionalidad: Las pruebas unitarias garantizan que el código haga lo que debe y no haga nada que no debería, que es donde se originan la mayoría de los errores.

• Prevenir regresiones en el código: Cuando encontramos un error, agregar una prueba unitaria que compruebe ese escenario evita que futuros cambios en el código vuelvan a introducirlo.

• Documentar el código: Con las pruebas unitarias adecuadas, un conjunto completo de pruebas y resultados sirve como especificación del funcionamiento esperado de una aplicación.

• Proteger tu aplicación: Las pruebas unitarias pueden detectar vulnerabilidades explotables, como las que permiten inyecciones SQL maliciosas.

Definir el alcance y escribir pruebas unitarias

Usar un framework de pruebas unitarias nos permite escribir y automatizar pruebas rápidamente, además de integrarlas en los procesos de desarrollo y despliegue. Estos frameworks suelen admitir pruebas tanto para código JavaScript de frontend como de backend.

A continuación encontrarás algunas pautas generales para escribir pruebas unitarias de rendimiento y código fácil de probar.

Mantén las pruebas unitarias breves y simples

No sobrecargues las pruebas unitarias. Cada prueba debería ocupar solo unas pocas líneas de código y comprobar partes funcionales pequeñas de la aplicación.

Considera los casos de prueba positivos y negativos

Es útil escribir una prueba que confirme que una función se ejecuta correctamente. Sin embargo, es mucho más eficaz crear un conjunto más amplio de pruebas para comprobar si la función falla como corresponde cuando se usa de forma incorrecta o en casos extremos. Estas pruebas negativas pueden ser incluso más valiosas porque ayudan a anticipar situaciones inesperadas, como cuándo una función debería lanzar una excepción o cómo debería manejar datos malformados.

Divide las funciones largas y complejas

Las funciones grandes con mucha lógica son difíciles de probar; incluir demasiadas operaciones impide probar cada variable de forma eficaz. Si una función es demasiado compleja, divídela en funciones más pequeñas para probarlas por separado.

Evita las conexiones de red y de bases de datos

Las pruebas unitarias deberían ser rápidas y ligeras, pero las funciones que hacen llamadas de red o se conectan con otras aplicaciones o procesos tardan mucho en ejecutarse. Esto dificulta ejecutar muchas operaciones al mismo tiempo y puede generar código más frágil. Puedes usar simulaciones en las pruebas unitarias para simular llamadas de red o a bases de datos y así probar el resto de la función. Puedes incluir las conexiones reales de red y a bases de datos en otro proceso de prueba llamado pruebas de integración.

Cómo escribir pruebas unitarias

Ahora que repasamos algunas prácticas recomendadas para las pruebas unitarias, ya puedes escribir tu primera prueba unitaria en JavaScript.

En este tutorial usaremos Mocha Framework, uno de los frameworks más populares para pruebas unitarias. Cada framework de pruebas es ligeramente diferente, pero son lo bastante similares como para que, al aprender los conceptos básicos, puedas cambiar de uno a otro fácilmente.

Para seguir esta demostración, asegúrate de tener Node.js instalado en tu computadora.

Crear un proyecto nuevo

Primero, abre una ventana de terminal o de línea de comandos en una carpeta nueva para el proyecto. Luego, crea un proyecto de Node.js dentro de ella escribiendo npm init -y.

Esto crea un archivo package.json dentro de la carpeta, que te permite instalar Mocha como dependencia de desarrollo con npm install -D mocha.

A continuación, abre el archivo package.json en tu editor de código y reemplaza el script de prueba provisional por mocha:

1  "scripts": {
2    "test": "mocha"
3  },

Implementar una clase

A continuación, escribe el código de un sistema de semáforos sencillo para probarlo con pruebas unitarias.

En el directorio de tu proyecto, crea un archivo llamado traffic.js y agrega el siguiente código para una clase TrafficLight:

1class TrafficLight {
2    constructor() {
3        this.lightIndex = 0;
4    }
5
6    static get colors() {
7        return [ "green", "yellow", "red" ];
8    }
9    get light() {
10        return TrafficLight.colors[ this.lightIndex ];
11    }
12    next() {
13        this.lightIndex++;
14        // This is intentionally wrong!
15        if( this.lightIndex > TrafficLight.colors.length ) {
16            this.lightIndex = 0;
17        }
18    }
19}
20
21module.exports = TrafficLight;

Esta clase consta de cuatro partes:

• TrafficLight.colors: una propiedad constante con los colores del semáforo.

• lightIndex: una variable que registra el índice del color actual del semáforo.

• light: una propiedad de clase que devuelve como texto el color actual del semáforo.

• next(): una función que cambia el semáforo al siguiente color.

Configurar y agregar nuestra primera prueba unitaria

Ahora es momento de agregar pruebas unitarias al código.

Crea una carpeta llamada test en el directorio del proyecto. De forma predeterminada, Mocha buscará allí las pruebas unitarias. Luego, agrega un archivo llamado traffic.test.js dentro de la nueva carpeta de pruebas.

A continuación, importa la clase TrafficLight al principio del archivo:

1const TrafficLight = require( "../traffic" );

También usaremos el módulo assert para las pruebas, así que inclúyelo en el código:

1const assert = require( "assert" );

Con Mocha, podemos agrupar pruebas unitarias en conjuntos mediante la función describe(). Por eso, podemos crear un grupo de nivel superior para esta clase de la siguiente manera:

1describe( "TrafficLight", function () {
2});

Luego, crearemos pruebas unitarias para validar los colores del semáforo en un subgrupo llamado colors, dentro del conjunto TrafficLight:

1describe( "TrafficLight", function () {
2    describe( "colors", function () {
3    });
4});

En esta primera prueba unitaria, podemos verificar que colors tenga solo tres estados: verde, amarillo y rojo. La prueba se define con una función it() dentro del grupo describe(), así que escríbela de esta manera:

1describe( "TrafficLight", function () {
2    describe( "colors", function () {
3        it( "has 3 states", function () {
4            const traffic = new TrafficLight();
5            assert.equal( 3, TrafficLight.colors.length );
6        });
7    });
8});

Ahora ejecutemos la prueba unitaria y veamos si pasa.

Ejecuta npm test en la terminal. Si todo está correcto, Mocha mostrará los resultados de la ejecución de la prueba unitaria.

Agregar más pruebas unitarias

Nuestro proyecto ya está listo para ejecutar pruebas unitarias, así que podemos agregar más para asegurarnos de que el código funcione correctamente.

Primero, agrega una prueba unitaria al grupo colors para validar que los colores del semáforo sean correctos y estén en el orden adecuado. Aquí tienes una forma de implementarla:

1it( "colors are in order", function () {
2    const expectedLightOrder = [ "green", "yellow", "red" ];
3    const traffic = new TrafficLight();
4    for( let i = 0; i < expectedLightOrder.length; i++ ) {
5        assert.equal( expectedLightOrder[ i ], TrafficLight.colors[ i ] );
6    }
7});

Segundo, prueba la función next() para comprobar si cambia correctamente las luces del semáforo. Crea un subgrupo y agrega dos pruebas unitarias: una para comprobar que las luces cambien en el orden correcto y otra para verificar que, después de red, la luz vuelva a green.

Escribe estas pruebas unitarias de la siguiente manera:

1describe( "next()", function () {
2    it( "changes lights in order", function () {
3        const traffic = new TrafficLight();
4        for( let i = 0; i < TrafficLight.colors.length; i++ ) 
5            assert.equal( traffic.light, TrafficLight.colors[ i ] );
6            traffic.next();
7        }
8    });
9    it( "loops back to green", function () {
10        const traffic = new TrafficLight();
11        // Change the light 3x to go from green -> yellow -> red -> green
12        for( let i = 0; i < 3; i++ ) {
13            traffic.next();
14        }
15        assert.equal( traffic.light, TrafficLight.colors[ 0 ] );
16    });
17});

Al volver a ejecutar las pruebas, veremos que una falla. Esto se debe a que hay un error en la clase TrafficLight.

Corregir el error

Vuelve a abrir el código de la clase TrafficLight y busca el comentario dentro de la función next() que dice // This is intentionally wrong!

Gracias a nuestras pruebas unitarias, sabemos que esta función no vuelve correctamente a green. Vemos que el código comprueba si el valor de lightIndex supera la cantidad de colores del semáforo, pero el índice empieza en 0. En cambio, debemos volver al inicio en cuanto el valor alcance la cantidad exacta de colores. Actualicemos el código para restablecer lightIndex a 0 cuando sea igual a la longitud de la lista de colores del semáforo:

1// This is intentionally wrong!
2if( this.lightIndex === TrafficLight.colors.length ) {
3    this.lightIndex = 0;
4}

Ahora deberían pasar todas tus pruebas unitarias. Y lo mejor es que, aunque se refactorice o modifique considerablemente la clase TrafficLight, las pruebas unitarias detectarán este error antes de que llegue a los usuarios.

Para concluir

Las pruebas unitarias son fáciles de configurar y una herramienta eficaz para el desarrollo de software. Ayudan a eliminar errores desde el principio y evitan que vuelvan a aparecer. Así, los proyectos son más manejables y fáciles de mantener, incluso cuando crecen y se vuelven más complejos, sobre todo en equipos de desarrollo grandes. Además, las pruebas automatizadas como estas permiten a los desarrolladores refactorizar y optimizar el código sin preocuparse por si el nuevo código funciona correctamente.

Las pruebas unitarias son una parte clave de tu proceso de desarrollo y son fundamentales para ayudarte a crear mejores aplicaciones JavaScript más seguras.

¡Que disfrutes las pruebas!