Nightwatch.js. Instalación y primeras pruebas (II) en Mac OS

Volvemos con Nightwatch.js. Hoy vamos a ver cómo instalar en Mac OS X todo lo necesario para poder realizar pruebas web automáticas usando Nightwatch.js.

Vamos a instalar Node.js, necesario para instalar Nightwatch.js. También vamos a instalar Java, necesario para arrancar el Selenium Server. Por último instalaremos Firefox, que es el navegador que por defecto tratará de arrancar Selenium.

Instalación de Node.js y Nightwatch.js:

Lo primero que necesitamos es instalar Node.js, para después poder instalar Nightwatch.js.

Primero vamos a verificar que efecticamente no tenemos node instalado en nuestro equipo. Para ello abrimos una ventana del terminal y escribimos:

MacBook:~ macbook$ node -v

Aparecerá un mensaje diciendo algo así como ‘command not found’. Vamos entonces a la página de Node.js y descargamos la última versión estable.

Una vez que lo hemos descargado, seguimos los pasos de instalación. A continuación tenéis los pasos a seguir:

Para confirmar que node está correctamente instalado abrimos una ventana de línea de comandos y escribimos ‘node -v’, y nos aparecerá un mensaje como el siguiente:

MacBook:~ macbook$ node -v

v5.0.0

Para instalar la última versión de Nightwatchjs, desde la misma ventana de línea de comandos escribimos ‘sudo npm install -g nightwatch‘:

MacBook:~ macbook$ sudo npm install -g nightwatch

El -g es muy importante, pues con esto conseguimos que el nightwatch runner esté disponible globalmente en cualquier ruta de nuestro sistema.

Cuando acabe de instalar, escribimos nightwatch -v y le damos a intro para verificar que se ha instalado correctamente:

MacBook:~ macbook$ nightwatch -v

nightwatch v0.8.6

Perfecto, ya tenemos nightwatch.js instalado en nuestro equipo.

Instalando Java

Para que podamos probar en local necesitaremos poder arrancar el selenium standalone server, y para esto necesitamos Java. Para comprobar si tenemos o no java instalado, vamos de nuevo a una ventana del terminal, y escribimos:

MacBook:~ macbook$ java -version

Si tenemos java instalado nos aparecerá un mensaje indicando la versión:

MacBook:~ macbook$ java -version
java version "1.8.0_65"
Java(TM) SE Runtime Environment (build 1.8.0_65-b17)

Si tenemos que instalarlo, vamos a la página web de oracle de descargas de Java y descargamos la versión del Java SE Development Kit para nuestro sistema operativo.

Una vez descargado comenzará el programa de instalación:

Instalación de Firefox

Una vez que tenemos node.js, nightwatch.js y java, lo único que nos queda es instalar Firefox, que es el navegador que por defecto va a intentar levantar selenium.

Vamos a la página de descargas de Firefox, lo descargamos e instalamos en nuestra máquina:

A partir de aquí el procedimiento es igual independientemente del sistema operativo. Lo único importante a tener en cuenta es utilizar un editor de texto como Sublime Text o similar, y no TextEdit, que incluiría caracteres extraños en el código fuente.

Creando el proyecto

Lo primero que vamos a hacer es crearnos una estructura de carpetas que posteriormente nos va a facilitar la labor de administrar nuestro proyecto de pruebas automáticas.

Para ello, en la ruta que queramos de nuestro sistema vamos a crear una carpeta a la que nosotros hemos llamado nightwatch. Dentro de esta carpeta vamos a crear 2 más. La primera será config y la segunda src. La primera contendrá la configuración del proyecto, y en la carpeta src estarán los ficheros con el código de las pruebas, por lo que crearemos una carpeta aquí llamada tests. Crearemos una tercera carpeta lib, a la misma altura que config y src, que utilizaremos posteriormente. Debe quedarnos una estructura así:

Dentro de C:\ tenemos una carpeta nightwatch, dentro de esta 3 carpetas (config, lib y src) y dentro de src la carpeta tests.

Entramos en la carpeta config y, pulsando con el botón derecho, le decimos que queremos crear un nuevo documento de texto. Le ponemos de nombrenightwatch.json (es necesario que podamos ver las extensiones de nuestros archivos). Cuando nos pregunte que si estamos seguros, le decimos que si. Posteriormente, abrimos este archivo con alguna herramienta como sublime text, notepad++, o simplemente el bloc de notas, y escribimos lo siguiente:

{
 "src_folders" : ["./src/tests"],
 "output_folder" : "./logs/",
 "selenium" : {
  "start_process" : false,
  "log_path" : "./logs/"
 }, 
 "test_settings" : {
  "default" : {
   "launch_url" : "http:testeandosoftware.com",
   "selenium_host" : "127.0.0.1",
   "selenium_port" : 4444,
   "silent": true,
   "screenshots" : {
    "enabled" : false,
    "path" : "./screenshots/"
    }
   }
 }
}

Tras esto, guardamos el archivo. Para que lo veáis gráficamente, el proceso sería el siguiente:

Ejecutando el servidor de Selenium

Para poder ejecutar nuestras pruebas necesitamos tener arrancado el servidor de selenium. Tendremos que descargarlo, y después podemos ejecutarlo independientemente de las pruebas de nightwatch, o bien decirle a nightwatch que arranque el servidor de selenium.

Descargar Selenium

Descarga la última versión de selenium-server-standalone-{VERSION}.jar desde la página de descargas de selenium,  y guárdalo en la ubicación que prefieras.

Ejecutando Selenium Manualmente

Para ejecutar el servidor de selenium manualmente debemos abrir una ventana de línea de comandos, ir a la ruta dónde tenemos el archivo .jar que hemos descargado, y ejecutar el siguiente comando:

java -jar selenium-server-standalone-{VERSION}.jar

Ejecutando Selenium Automaticamente

Si vamos a tener el servidor de selenium en la misma máquina dónde vamos a ejecutar nightwatch.js, podemos hacer que el Nightwatch Test Runner se encargue directamente de arrancar y parar selenium. Para ello, en el archivo nightwatch.json cambiaremos esto:

"selenium" : {
  "start_process" : false,
  "log_path" : "./logs/"
 },

Por esto:

"selenium" : {
 "start_process" : true,
 "server_path" : "./lib/selenium-server-standalone-2.43.1.jar",
 "log_path" : "./logs/",
 "host" : "127.0.0.1",
 "port" : 4444
 },

Y guardamos el archivo.

Necesitamos además crear una nueva carpeta dentro de la carpeta nightwatch, a la que llamaremos lib, y donde copiaremos el archivo selenium-server-standalone-{VERSION}.jar que hemos descargado anteriormente.

Nosotros para las pruebas, vamos a hacer que el nightwatch runner arranque selenium.

Crear nuestra primera prueba automática

Por último vamos a crear nuestra primera prueba automática. Vamos a la carpeta src, y creamos una nueva carpeta llamada tests. Dentro de esta creamos un nuevo archivo al que llamaremos ejemplo1.js, y después lo abrimos con nuestro editor favorito (sublime text o notepad++ serán perfectos). Escribimos lo siguiente:

module.exports = {
 "Demo test Google" : function (browser) {
 browser
 .url("https://www.google.com")
 .waitForElementVisible('body', 1000)
 .setValue('input[type=text]', 'testeandosoftware')
 .waitForElementVisible('button[name=btnG]', 1000)
 .click('button[name=btnG]')
 .pause(1000)
 .assert.containsText('#main', 'testeandosoftware.com')
 .end();
 }
};

Y guardamos nuestro archivo.

Con esta prueba, lo que vamos a hacer es:

1. Abrir firefox
2. Ir a google.com
3. Escribir testeandosoftware en el recuadro de búsqueda y darle a buscar
4. Verificar que en la página de resultados aparece testeandosoftware.com.

Ejecutando la prueba

Para lanzar nuestra prueba, abrimos una ventana de línea de comandos, vamos hasta la ruta de nuestra carpeta nightwatch, y ejecutamos lo siguiente:

nightwatch -c config/nightwatch

Si todo va bien en la ventana de línea de comandos iremos viendo como se ejecutan los pasos.

Según se ejecutan los pasos, se abrirá firefox e irá haciendo lo que hemos indicado en el test.

Veremos que entre nuestras carpetas ha aparecido una nueva carpeta logs, que se ha creado automáticamente, que recoge los logs de la prueba. El árbol de carpetas y archivos final será algo así:

A partir de aquí, navegando entre la gran documentación que hay en la developer guide  de nightwatch.js, podremos ir creando más pruebas automáticas que verifiquen nuesto sitio web, y no sólo que nuestro sitio web aparece en google.

Próximamente iremos haciendo crecer nuestra bateria de tests, y os mostraremos como ejecutar estas mismas pruebas contra un dispositivo móvil (android) que esté conectado a la misma red que nosotros (vía WiFi) sin necesidad de que esté conectado por USB, gracias a Appium.

Nightwatch.js. Instalación y primeras pruebas.