Lanzando y controlando tests distribuidos de Selenium con un chatbot

En esta charla veremos cómo dar **visibilidad, auditar y compartir tests manuales** corriendo en Selenium desde un chat grupal como Slack, Mattermost, Hipchat, ...

Mostraremos como funciona este chatbot nos permite:
- lanzar un **Grid de Selenium** en **Kubernetes**
- enviar comandos desde el chat
- dar feedback al usuario mostrando resultados, capturas de pantalla, etc.

Compartiremos nuestra experiencia y mostraremos las ventajas que hemos visto al utilizarlo.

Transcript

1. Lanzando y controlando tests distribuidos de Selenium con un chatbot COMMIT CONF 2019
2. 2 Quiénes somos Commit Conf 2019
3. 3 Quiénes somos www.minervaproject.com Commit Conf 2019
4. 4 Minerva Project Commit Conf 2019
5. 5 Minerva Project Commit Conf 2019
6. Contexto del problema 6 Contexto • La mayoría de los ingenieros trabaja en remoto • Usamos slack para ◦ Alertas ◦ Despliegues ◦ Consulta de datos (looker, grafana, …) ◦ Información diaria ▪ Errores reportados ▪ Evolución del rendimiento • Slack hace de memoria viva sobre los procedimientos ◦ Da visibilidad a herramientas que mejoran la productividad ◦ ¿Por qué no aprovecharlo para los tests? Commit Conf 2019
7. Demo 7 Arrancar la flota
8. Una flota de navegadores (casi) instantánea 8 Flota de navegadores Commit Conf 2019 • Helm: El gestor de paquetes para Kubernetes • Brigade: Permite correr tareas en un cluster como respuesta a eventos • Cluster autoscaler: Ajuste automático de capacidad del cluster • Selenium Grid: Manejo de navegadores corriendo en instancias remotas • Hubot: Herramienta para crear tus propios bots de chat
9. Diagrama de la solución 9 Flota de navegadores Commit Conf 2019 Slack Hubot Cluster Autoscaler HTTP Gateway Selenium Hub Selenium Node Chrome Selenium Node Chrome Jobs
10. Arrancar la flota 10 Arrancar la flota Commit Conf 2019 1 Brigade • Recibe evento por http • Despliega charts Helm • Genera manifests • Despliega en el cluster 2 Cluster Autoscaler • Detecta pods • Arranca recursos 3 Selenium • Arranca hub • Arranca navegadores 4
11. Chart de Selenium Grid en Helm - extracto de la configuración 11 Arrancar la flota Commit Conf 2019 chrome: nodeSelector: environment: test enabled: true resources: limits: cpu: 2 memory: 0 replicas: 5 hub: nodeSelector: environment: test resources: limits: cpu: 2 memory: 0
12. Demo 12 Browser fleet
13. Diagrama de la solución 13 Browser Fleet Commit Conf 2019 Slack Hubot Selenium Hub Selenium Node Chrome Selenium Node Chrome Cluster Autoscaler HTTP Gateway Jobs Browser Fleet CLI
14. Diagrama de Browser Fleet 14 Browser Fleet CLI Commit Conf 2019 Selenium Hub Selenium Node Chrome Selenium Node Chrome REPL Interface Controllers Controllers Custom Controllers Browser Fleet CLI WDIO
15. REPL remoto mediante sockets - Configuración REPL 15 Browser Fleet CLI Commit Conf 2019 const REPL = require('repl'); const replConfig = { prompt: '> ', input: socket, output: socket, }; const repl = REPL.start(replConfig); repl.context.controller = controller; repl.on('exit', async () => { await controller.close(); if (socket) { socket.end(); } process.exit(0); });
16. REPL remoto mediante sockets - servidor 16 Browser Fleet CLI Commit Conf 2019 const server = net.createServer((socket) => { socket.on('close', () => { stopRepl(controller, socket); }); socket.on('data', (data) => { if (data.toString().includes('start')) { socket.removeAllListeners('data'); startRepl(controller, socket, server); } }); });
17. const wdio = require('webdriverio'); class MinervaController { ... for (let i = 0; i < config.numberOfBrowsers; i++) { this.browserConfiguration[`chrome${i}`] = { host: config.host, port: config.port, desiredCapabilities: { browserName: 'chrome', 'goog:chromeOptions': {args:['--use-fake-device-for-media-stream', ...]} } }; } ... } Controlando la flota remotamente: WDIO & Controllers 17 Browser Fleet CLI Commit Conf 2019
18. async initialize() { this.browser = wdio.multiremote(this.browserConfiguration); await this.browser.init(); await this.browser.timeouts('script', 60000); ... } async screenshot(id) { const fileName = `./${id}_${new Date().getTime()}.png`; await this.browser(id).saveScreenshot(fileName); return fileName; } async connectAll() { await this.browser.url(this.url); await this.browser.waitUntilConnected(); } Controlando la flota remotamente: WDIO & REPL 18 Browser Fleet CLI Commit Conf 2019
19. async function waitUntilConnected(timeout = 90000) { await Promise.all([ this.waitForExist("input#js-email", timeout), this.waitForExist("input#js-password", timeout), this.waitForExist("input#sign-in", timeout), ]); } browser.addCommand('waitUntilConnected', waitUntilConnected); Controlando la flota remotamente: WDIO nuevos comandos 19 Browser Fleet CLI Commit Conf 2019
20. Diagrama de la solución 20 Browser Fleet Commit Conf 2019 Slack Selenium Hub Selenium Node Chrome Selenium Node Chrome Browser Fleet CLI Cluster Autoscaler HTTP Gateway Jobs Hubot
21. Integración con Hubot 21 Hubot Commit Conf 2019 robot.respond(/bfconnect (.*) (.*)/i, (msg) => { const region = msg.match[1]; const release = msg.match[2]; const slackThread = createSlackThread(msg.message.thread_ts); const host = getBrowserFleetHost(region, release); slackThread.client = net.createConnection({host, port}, () => { msg.send(`Connected to browser_fleet_cli in ${host}`); slackThread.client.write('start\r\n'); slackThread.client.on('data', (data) => { msg.send(data.toString()); }); slackThread.client.on('end', () => { msg.send(`Session ${host} ended`); closeThread(slackThread); }); }); });
22. Integración con Hubot 22 Hubot robot.respond(/bfrun (.*)/i, (msg) => { const thread = msg.message.thread_ts; const slackThread = getSlackThread(msg.message.thread_ts); ... if (slackThread && slackThread.client) { slackThread.client.write(`${command}\r\n`); } }); Commit Conf 2019
23. Resumen de demo 23 Browser fleet
28. Gracias Contacto Javier: @jcague Pedro : @lodoyun 1145 Market Street, Ninth Floor San Francisco, CA 94103 www.minervaproject.com