Ediciones ENI Editorial | líder en informática
Probar su aplicacion
Introducción
Generalmente las pruebas son tan importantes como descuidadas, ya sean unitarias o end-to-end (de extremo a extremo). Se pueden integrar fácilmente en un proyecto Angular, principalmente gracias a Angular CLI y sus comandos. El objetivo de este capítulo es ver cómo es posible crear y ejecutar pruebas unitarias, gracias a Karma y Jasmine, así como pruebas end-to-end, con Protractor.
Las pruebas unitarias
El objetivo de una prueba unitaria es aislar una parte del código para probarlo. Esto permite asegurarse de que una funcionalidad concreta, tan pequeña como se quiera, funciona correctamente. Como una aplicación es la combinación de múltiples funcionalidades, a menudo sucede que las modificaciones realizadas a una funcionalidad alteran otra. Para una aplicación pequeña, este no es un problema realmente importante, pero para una aplicación normal, incluso consistente, se vuelve problemático.
En este punto es interesante contar con pruebas unitarias que permitan garantizar que cada bloque continúe funcionando correctamente durante todo el proceso de desarrollo, independientemente de sus dependencias.
Para ejecutar las pruebas unitarias con Angular CLI, es suficiente con utilizar el comando ng test.
1. Introducción a las pruebas con Jasmine
Las pruebas unitarias se escriben en archivos TypeScript, gracias al entorno de prueba Jasmine. El comando ng test utiliza task runner Karma para lanzar las pruebas en el navegador elegido, según la configuración Karma a nivel de los archivos karma.conf.js y app/test.ts.
Por defecto, con Angular CLI, se van a ejecutar todos los archivos con extensión .spec.ts y que se corresponden con un archivo TypeScript:
-
sample.component.ts
-
sample.component.spec.ts
-
Para un archivo sample.component.ts existente, Karma ejecuta el archivo correspondiente sample.component.spec.ts.
El objetivo es que cada archivo TypeScript tenga un archivo de pruebas, para tener una cobertura máxima del código.
Jasmine es un framework de pruebas open source basado en BDD (Behaviour-Driven Development). El objetivo es centrarse en las especificaciones, las pruebas escritas son explícitas y están fuertemente vinculadas a estas especificaciones. En un entorno ágil, las pruebas representan las diferentes User Stories que definen las especificaciones de la aplicación. Esto aporta un proceso de redacción de pruebas más eficiente y fluido.
Varios conceptos bastante comunes a BDD se encuentran dentro de Jasmine:
-
describe: define el título de la prueba y da la función que contiene las diversas especificaciones.
-
it: tiene el título de una especificación y contiene las pruebas que validan esta especificación. De manera más precisa...
Las pruebas e2e
Como para las pruebas unitarias, el framework con el que se escriben las pruebas e2e es Jasmine. Sin embargo, para ejecutar estas pruebas se va a utilizar Protractor.
Protractor es un programa en Node.js, que utiliza Selenium para permitir a las pruebas interactuar con el navegador. Es todo el interés de las pruebas e2e, porque la idea de las pruebas e2e es interactuar con la aplicación de la misma manera que haría un usuario en su navegador.
De esta manera, es posible probar de principio a fin una funcionalidad, definiendo una sucesión de interacciones a realizar. Protractor ejecuta a continuación esta sucesión de acciones, en los navegadores definidos, lo que es muy práctico, porque esto permite identificar automáticamente las diferencias entre los navegadores.
Las pruebas e2e no sustituyen a las pruebas unitarias por muchas razones, sin embargo son complementarias. Estos dos tipos de pruebas son muy importantes.
Para conocer los detalles de Jasmine y sus matchers, ver en este mismo capítulo la sección Las pruebas unitarias y las subsecciones sobre los matchers Jasmine.
1. Ejecutar las pruebas e2e
Para ejecutar las pruebas e2e, es suficiente con utilizar el siguiente comando:
ng e2e La configuración Angular CLI en el archivo .angular-cli.json apunta por defecto al archivo protractor.conf.js.
Extracto del archivo angular.json
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "my-app:serve"
}
} El archivo protractor.conf.js permite configurar principalmente el framework de prueba que se debe utilizar, Jasmine por ejemplo. Por convención, los archivos de pruebas e2e a ejecutar tienen la extensión e2e-spec.ts. Estos archivos están en la carpeta e2e, en la raíz del proyecto.
Extracto del archivo protractor.conf.js
specs: [
'./src/**/*.e2e-spec.ts'
], 2. Escribir una prueba e2e
Para esta parte, se toma como ejemplo un componente relativamente sencillo. Este componente tiene un contador que se va a incrementar cada vez que el usuario pulse un botón.
import { Component...