Automatizando Pruebas Unitarias y de Integración en Aplicaciones Web

Automatizando Pruebas Unitarias y de Integración en Aplicaciones Web con QUnit, Selenium & PhantomJS.
Presentación en JS Meetup @ Infragistics Uruguay

Transcript

1. Automatizando Pruebas Unitarias y de Integración en Aplicaciones Web Con QUnit, Selenium & PhantomJS Ing. Héctor Quartino hquartino@infragistics.com
2. Problemática • Dada una Aplicación Web: – jQuery UI widgets – Rica interacción entre cliente y servidor via AJAX. • Misión: Correr las pruebas unitarias del cliente y de integración con el servidor como parte del proceso de integración continua.
3. Desafíos • ¿Cómo hacer las pruebas unitarias? – Automatizar browser – Tipos de pruebas • ¿Cómo hacer las pruebas de integración? – To Mock or Not To Mock • ¿Cómo correr automáticamente las pruebas unitarias y de integración?
4. Pruebas unitarias • QUnit – Framework para pruebas unitarias en Javascript • Pruebas sincrónicas y asincrónicas • ¿Pruebas visuales? – Validez DOM – Browser bugs / quirks
5. Pruebas unitarias (cont.) • ¿Cómo correr las pruebas automáticamente en el servidor de CI? – Chutzpah: Javascript Test Runner – PhantomJS: Headless Webkit
6. Pruebas de integración • ¿Qué?: Probar los puntos de interacción entre el cliente y el servidor. • ¿Por qué? – Detección temprana de errores causados por cambios en el servidor o el cliente. – Automatizar las pruebas. • ¿Cuándo? ¿Dónde? – En el servidor de CI. – CI (en cada commit) vs Nightly (periódicos)
7. Pruebas de integración (cont.) • ¿Cómo? – Automatizar el browser  ¡Selenium! • Permite controlar el navegador programáticamente • WebDriver API – independiente del browser • Múltiples bindings a nivel de lenguajes • Múltiples drivers para navegadores – Algunos navegadores ya tienen el driver built in (Firefox, PhantomJS) – Ghostdriver: PhantomJS Webdriver
8. Arquitectura
9. Arquitectura (cont.) • Algunas consideraciones: • Resulta útil abstraer los objetos a testear en wrappers – Tests más fáciles de escribir y de entender – Encapsular en wrappers la interacción con Selenium – ¿Cómo probar llamadas asincronicas? • Client-side wrappers • Sacar screenshots en los tests, útil a la hora de diagnosticar errores – Permite también hacer pruebas visuales automáticas – Advertencias • PhantomJS ≈ Chrome, Safari, etc. • Third Party Issues  (Webdrivers, browsers, componentes externos)
10. DEMO
11. ¿Preguntas?
12. Referencias • QUnit – http://qunitjs.com/ – Cookbook: http://qunitjs.com/cookbook/ • Chutzpah – http://chutzpah.codeplex.com/ • PhantomJS – http://phantomjs.org/ • Selenium – http://docs.seleniumhq.org/ • Ghostdriver – https://github.com/detro/ghostdriver