Verificación automática de un ecommerce y la experiencia de usuarios

El objetivo principal de cualquier ecommerce es permitir la venta de productos a los usuarios. Esto que resulta tan obvio, no siempre es fácil de conseguir y más aún cuando hablamos de grandes marcas cuyos sitios web tienen que ser capaces de responder a situaciones cómo: grandes volúmenes de tráfico, picos de usuarios, venta multiregión por países, soporte a múltiples dispositivos, cambios constantes en el catálogo de productos, actualización de precios, ofertas, cambios en las galerías de imágenes, etc. Este tipo de ejemplos, puede darnos una idea de la complejidad de mantenimiento y operaciones que conlleva mantener un sistema así en producción.

Desde el Team de QA de SNGULAR , nos comprometimos a dar el mejor servicio a sus usuarios proveyendo de soluciones tecnológicas, para evitar estos errores que producen mala imagen y costes a las ecommerce.

Reto

En escenarios como este, las posibilidades de introducir errores aumentan considerablemente, lo que, en muchas ocasiones, conlleva pérdida de ventas y daño reputacional. Por tanto, resulta necesario contar tanto con medios preventivos como un sistema de alertas que nos dé información rápida y fiable sobre el estado del sistema en producción.

En este caso, desarrollamos un conjunto de pruebas automáticas que verifican el correcto funcionamiento del ecommerce y de la experiencia de compra real en múltiples dispositivos.

Solución

De manera que los errores en producción que ponen en riesgo los objetivos de negocio, sean detectados lo antes posible para que se tomen las medidas necesarias, se ha desarrollado una batería de pruebas automáticas que, simulando acciones de usuarios reales, validan que la experiencia de compra en el ecommerce es correcta.

Además, utilizando técnicas de visual testing, también se verifica no sólo que la venta de elementos está funcionando correctamente sino que también la maquetación de la web es la que se espera. Este punto resulta realmente importante en ecommerce donde la imagen de marca tiene un gran peso y donde se da prioridad al cumplimiento estricto de los diseños establecidos.

Para facilitar las validaciones con diferentes navegadores y dispositivos reales, nos apoyamos en la solución en la nube BrowserStack. Este sistema permite la ejecución de pruebas en múltiples dispositivos móviles reales y combinaciones diversas de navegadores web y sistemas operativos. Esto nos permite aumentar enormemente la cobertura de las pruebas, pudiendo detectar así casos particulares y adaptarnos a la experiencia de los usuarios finales.

Otra ventaja de esta herramienta es la calidad y el detalle de sus informes. Gracias a la grabación en video de las ejecuciones, captura de evidencias y generación de logs, se facilita enormemente la labor de corrección de errores en caso de ser detectados.

Mediante la implementación de este proceso de pruebas automáticas diarias, se ha conseguido reducir el impacto de los errores introducidos en producción y disminuir sus consecuencias en los objetivos de negocio.

Esto, también ha traído consigo una optimización del proceso de pruebas manuales que se venía haciendo hasta el momento y que suponía un cuello de botella en el proceso de delivery. De esta manera, se ha conseguido aumentar la velocidad y fiabilidad de los despliegues, así cómo aumentar la calidad del tiempo del testing manual dado que ya no se emplea en verificaciones repetitivas rutinarias sino en pruebas de escenarios especiales.

Desarrollo con el cliente

La colaboración con este cliente comenzó con un equipo técnico encargado del desarrollo de funcionalidades sobre su web principal. Este equipo SNGULAR, liderado por Raúl Gundín, se ganó la confianza de los responsables, siendo el propio Raúl quien, dada la inestabilidad de la web principal, les puso sobre aviso sobre la necesidad de contar con personas dedicadas específicamente a labores de testing.

A raíz de ello, realizamos una presentación de la DKC (Digital Key Capabilities) del Team QA de SNGULAR y de cómo podríamos solventar algunos de sus problemas. En dicha reunión, se elaboró una pequeña prueba de conceptos a modo de demo, para mostrar nuestra aproximación sobre su web y aplicaciones reales de producción.

Esto fue lo que terminó de convencer al cliente.

Actualmente nuestro equipo de QA trabaja muy cerca del cliente y de manera ágil. Existe un marco de confianza y colaboración constante en modo de chats internos, dailies, retros, etc.

Automatización de pruebas

La automatización de pruebas es un proceso complejo y que requiere de mantenimiento constante, puesto que cualquier cambio en la web hace que las pruebas comiencen a fallar. Por tanto, resulta especialmente importante aplicar patrones de diseño y técnicas de pruebas que hagan que la suite de pruebas sea fiable, robusta y mantenible.

“La detección temprana de errores evita el daño reputacional y que los objetivos de negocio se vean comprometidos.”

Francisco Moreno.

Nos hemos apoyado en la herramienta BrowserStack como proveedor de dispositivos en la nube para la ejecución de pruebas. Sus principales ventajas están en la generación de informes automáticos y uso de dispositivos móviles reales.

El objetivo de esta pruebas es el de validar que la web se está comportando correctamente en producción tanto a nivel funcional como visual. Por ello, resulta importante utilizar herramientas de automatización que repliquen de la manera más fiable posible las interacciones que realizaría un usuario real sobre el ecommerce.

Teniendo esto en cuenta, nos decantamos por utilizar webdriverio como herramienta base para dirigir las navegaciones sobre la web. En el contexto de este proyecto era importante mantener cierta homogeneidad tecnológica y no introducir nuevos lenguajes de programación o plataformas, debido a esto, webdriverio es una buena opción si deseamos mantenernos dentro de tecnologías Javascript. Además, es una herramienta asentada en la industria y que cuenta con varios plugins que permiten la generación automática de informes e integraciones con Cucumber, BrowserStack y herramientas de VisualTesting entre otras ventajas.

Una vez seleccionado la librería adecuada para dirigir las navegaciones y dadas las características de los usuarios que utilizan el ecommerce, resultaba importante poder realizar las validaciones sobre diferentes navegadores, sistemas operativos y dispositivos móviles de manera que pudiésemos cubrir un amplio abanico de posibilidades. Teniendo esto en cuenta, lo más eficiente en términos de esfuerzo y coste de infraestructura es optar por proveedores en la nube que ofrezcan este tipo de servicios. Entre las varias opciones en el mercado, una de las más asentadas es Browserstack. Esta plataforma permite tanto la ejecución manual como automática de pruebas en una amplia gama de navegadores y dispositivos móviles reales. Además cuenta con un sistema de informes y generación de videos de las ejecuciones que facilita enormemente la tarea de depuración de errores.

Finalmente, las pruebas son lanzadas de manera automática, todas las mañanas mediante un pipeline de jenkins que además se encarga de enviar un informe resumido con los resultados de las pruebas.

Colaboración de equipos

Este proyecto ha tenido especial importancia la colaboración entre los equipos de QA y Cloud puesto que fue necesario desarrollar un pipeline de Jenkins que ejecute las pruebas de manera automática todas las mañanas, y envíe un informe con los resultados a clientes y personas implicadas.

Trabajando con el cliente y en remoto desde Cáceres, Madrid, Oviedo… La distancia de las personas no ha supuesto ningún problema ya que el equipo ha trabajado en remoto pero siempre atento al cliente y viceversa.

De este proyecto no solo estamos contentos con su desarrollo, si no que el equipo ha aprendido y estamos en camino de exportar este enfoque para validar de manera automática el funcionamiento de las aplicaciones móviles tanto Android como iOS.

Photo by Kit Suman on Unsplash