Testing E2E con Selenium Web Driver & NodeJs
Hoy en día todos desearíamos tener un TARS o un WALL-E que nos ayude con nuestras tareas diarias. Desgraciadamente, una persona común aún está lejos de poder automatizar sus actividades diarias a través de robots… ¡Pero! en el área de tecnología no estamos muy alejados de este concepto y esto es gracias a la automatización.
En este artículo te mostraré lo fácil que puede ser automatizar tus pruebas con selenium-webdriver y JavaScript, uno de los lenguajes de programación más populares en la actualidad, y evitar las tediosas que pueden ser las pruebas manuales día con día.
¿Qué es Selenium Web Driver?
Selenium es una biblioteca de automatización del navegador. Se utiliza con mayor frecuencia para probar aplicaciones web, puede usarse para cualquier tarea que requiera la interacción automática con el navegador.
Simple, ¿no? Pasemos a lo siguiente.
Instalación:
En esta ocasión trabajaremos con Chrome, los controladores para Chrome, deben colocarse en la RUTA del sistema, descárgalo a continuación:
Sin embargo, si desconoces el tema te dejo la siguiente guía para instalarlo:
Crearemos un directorio para nuestro proyecto y dentro de la terminal ejecutaremos:
npm init -y
Lo siguiente que tenemos que hacer es abrir nuestro editor de código favorito y crearemos un archivo llamado “index.js”.
Usa la línea de comando dentro de tu carpeta de proyecto para instalar las selenium-webdriver.
npm install selenium-webdriverMuy bien, ahora estamos listos. Primero que nada, no tienes que entender todo lo que escribiremos en este momento, solo quiero mostrarte lo rápido y fácil que es iniciar en el mundo de Selenium.
Primeros pasos:
Dentro de nuestro archivo “index.js” escribiremos lo siguiente, que es básicamente extraer funciones desde nuestros módulos de Node que instalamos hace un momento.
const {Builder, By, Key, until} = require(‘selenium-webdriver’);Debajo de eso, crearemos una función asíncrona llamada “example” y dentro tendrá un bloque “try”, el cual contiene las instrucciones que deseamos que se cumplan.
(async function example() {let driver = await new Builder().forBrowser(‘chrome’).build();try {} finally {}});
Nota: La función “Builder” se encarga de construir nuestro navegador, que en nuestro caso será “Chrome”.
Ahora que tenemos el constructor, abriremos una página algo simple, como Google, y dentro de nuestro bloque try agregaremos lo siguiente:
await driver.get(‘http://www.google.com/‘);En la siguiente línea, indicaremos que encuentre el elemento llamado “q” y dentro escriba la palabra “webdriver” para después presionar la tecla “Enter”(si tienes algo de conocimiento en html, sabrás que puedes inspeccionar las páginas web y obtener los nombres y ID de sus componentes):
await driver.findElement(By.name(‘q’)).sendKeys(‘webdriver’, Key.RETURN);Para finalizar nuestro bloque, indicaremos que una vez que el título de nuestra pestaña sea “webdriver — Google Search”, el navegador espere estático por 2 segundos.
await driver.wait(until.titleIs(‘webdriver — Google Search’), 2000);Al cumplirse todas las indicaciones que programamos, pasaremos a nuestro bloque “finally”, en el cual nuestra orden será que el navegador deberá cerrarse:
finally {await driver.quit();}
Nuestro código al final deberá ser algo como esto:
const {Builder, By, Key, until} = require(‘selenium-webdriver’);(async function example() {let driver = await new Builder().forBrowser(‘chrome’).build();try {await driver.get(‘http://www.google.com/');await driver.findElement(By.name(‘q’)).sendKeys(‘webdriver’, Key.RETURN);await driver.wait(until.titleIs(‘webdriver — Google Search’), 1000);} finally {await driver.quit();}//Nota: para al final deberemos colocar (); para que se inicie la ejecución})();
Ahora todo lo que tenemos que hacer es ir a nuestro directorio en la terminal y ejecutar “node index.js”, para ejecutar nuestra primera automatización.
node index.js
Y, así de simple, acabas de terminar tu primer test automatizado. A pesar de ser un breve ejemplo, es muy ilustrativo y puedes ver de manera general cómo es trabajar con selenium.
Para finalizar, te dejare el link de la documentación, que es de gran utilidad para adentrarte en este mundo y además cuenta con su versión en español. ¡Nos vemos en la próxima!
