Ahora bien, ya hemos visto de que se trata Jasmine ahora veamos como funciona.
Este archivo ejecuta unas pruebas en un código de ejemplo, sí deseamos correr las prueba podemos refrescar el navegador y las mismas se ejecutarán.
Ahora veamos un ejemplo del uso de Jasmine:
return "Hello world!";
}
Estamos bastante seguros que esto funciona ¿verdad? Pero probemos esto con Jasmine y veamos que opina de nuestro código.
<script type="text/javascript" src="src/hello.js"></script>
it("says hello", function() {
expect(helloWorld()).toEqual("Hello world!");
});
});
Veamos que contiene esta porción de código:
Primero tenemos el describe, que usualmente define un componente de nuestra aplicación, puede ser una clase, función o quizá algo más. En este ejemplo hace referencia a nuestra función helloWorld().
Sigamos en el mismo código y tendremos el bloque de it(), esto es llamado una especificación. Es una función en Javascript que nos dice que se espera o que debería hacer nuestro componente. Por cada describe podemos tener cualquier cantidad de especificaciones.
En este caso estamos probando si la función helloWorld() retorna “Hello world!” y lo verificamos con el toEqual() que no es más que un matcher, esto básicamente nos dirá si el contenido de la cadena es igual con lo que se está probando.
<script type="text/javascript" src="spec/hello.spec.js"></script>
Finalmente corremos esta especificación en nuestro navegador y veremos una salida como la que tenemos a continuación:
También podemos usar otro tipo de matcher, veamos:
describe("Hello world", function() {
it("says world", function() {
expect(helloWorld()).toContain("world");
});
});
En vez de esperar que el valor sea igual, esta vez esperamos que el contenido sea la palabra “world” sin importar el resto del contenido, siempre y cuando exista la palabra “world” en esta prueba Jasmine lo interpretará como correcto.
Sí nos vamos a nuestra función podemos cambiar lo que dice y colocar algo a diferente a “Hello World”, Jasmine verá esto como incorrecto porque no es lo que está esperando y esa es la razón principal por la cual queremos a Jasmine, para que nos diga cuando algo no es lo esperado y esto nos ayudará a que nuestro código sea limpio y sin errores.
- Descargamos la última versión de Jasmine y la descomprimimos.
- Ingresamos al directorio de Jasmine y ejecutamos SpecRunner.html y veremos lo siguiente:
Este archivo ejecuta unas pruebas en un código de ejemplo, sí deseamos correr las prueba podemos refrescar el navegador y las mismas se ejecutarán.
Ahora veamos un ejemplo del uso de Jasmine:
- Primero creamos una función simple que contenga una cadena como llamada de retorno.
return "Hello world!";
}
Estamos bastante seguros que esto funciona ¿verdad? Pero probemos esto con Jasmine y veamos que opina de nuestro código.
- Guardamos la función creada en un archivo que podemos llamar hello.js, abrimos SpecRunner.html para realizar la inclusión.
<script type="text/javascript" src="src/hello.js"></script>
- Ahora pongamos a Jasmine a trabajar, creamos un archivo que contenga el siguiente código:
it("says hello", function() {
expect(helloWorld()).toEqual("Hello world!");
});
});
Veamos que contiene esta porción de código:
Primero tenemos el describe, que usualmente define un componente de nuestra aplicación, puede ser una clase, función o quizá algo más. En este ejemplo hace referencia a nuestra función helloWorld().
Sigamos en el mismo código y tendremos el bloque de it(), esto es llamado una especificación. Es una función en Javascript que nos dice que se espera o que debería hacer nuestro componente. Por cada describe podemos tener cualquier cantidad de especificaciones.
En este caso estamos probando si la función helloWorld() retorna “Hello world!” y lo verificamos con el toEqual() que no es más que un matcher, esto básicamente nos dirá si el contenido de la cadena es igual con lo que se está probando.
- Guardamos el código con el nombre hello.spec.js lo colocamos en el directorio donde están contenidos las especificaciones y lo incluimos en nuestro SpecRunner.html
<script type="text/javascript" src="spec/hello.spec.js"></script>
Finalmente corremos esta especificación en nuestro navegador y veremos una salida como la que tenemos a continuación:
También podemos usar otro tipo de matcher, veamos:
describe("Hello world", function() {
it("says world", function() {
expect(helloWorld()).toContain("world");
});
});
En vez de esperar que el valor sea igual, esta vez esperamos que el contenido sea la palabra “world” sin importar el resto del contenido, siempre y cuando exista la palabra “world” en esta prueba Jasmine lo interpretará como correcto.
Sí nos vamos a nuestra función podemos cambiar lo que dice y colocar algo a diferente a “Hello World”, Jasmine verá esto como incorrecto porque no es lo que está esperando y esa es la razón principal por la cual queremos a Jasmine, para que nos diga cuando algo no es lo esperado y esto nos ayudará a que nuestro código sea limpio y sin errores.
