Page Object

 ¿Qué es un Page Object?

Page Object es un patrón de diseño con el cual buscamos crear un objeto que sirva como una capa de abstracción para las interacciones que se pueden efectuar en una página web. Es decir, un page object debe proveer una manera simple para interactuar con una página web encapsulando sus funcionalidades y características.

¿Por qué usar page objects?

Los page objects nos entregan una manera sencilla de interactuar con las páginas web que queremos verificar en nuestros tests. Esto le quita mucha complejidad a nuestros tests, ya que nosotros para realizar acciones u obtener datos de la página web, solamente debemos llamar los métodos del objeto. Esto reducirá dramáticamente la cantidad de código en nuestros tests. Disminuyendo sus complejidad, mantenimiento y facilitando el patrón AAA (Arrange, Act y Assert.).

Consejos para el manejo de elementos.

Campo de texto (Input text y text areas).

Usualmente los campos de texto son elementos html que aceptan texto libre en su interior.

Extracción de datos.

Se debe tener un método para extraer el contenido de dicho campo y retornarlo como un String.

Asignación de datos.

Se debe tener un método para poder ingresar datos a ese campo. Lo ideal es que este método reciba un String como parámetro

Radio buttons.

Los radio buttons son un conjunto de elementos que comparten el atributo name y se diferencian entre ellos por el valor que ellos contienen.

Extracción de datos.

Se debe tener un método que retorne el valor del botón seleccionado de la familia.

Asignación de datos.

Se debe tener un método que debería ser capaz de seleccionar el elemento de la familia mediante un parámetro de texto que concuerde con uno de los elementos de la familia.

Checkboxes.

Los checkboxes son elementos que pueden ser clickeados para  cambiar su estado a 'checked'.

Extracción de datos.

Se debe tener un método que retorne True o False.

Asignación de datos.

Se debe terner un método que asigne mediante un parámetro booleano para cambiar la selección de dicho objecto. True para que pase a estar 'checked' y False para remover remover el atributo 'checked'.

Listas desplegables (Selects).

Las listas deplegables son elementos que contienen opciones para ser seleccionadas por el usuario. Las opciones tienen dos principales características, una es el texto visible y la otra es el valor de la opción. Dichas características no siempre comparten valor.

Extracción de datos.

Se debe tener métodos que retornen el valor, texto o índice de la opción seleccionado en la lista desplegable.

Asignación de datos.

Se debe tener métodos para poder seleccionar la opción por valor, texto o indice.

Conclusión.

El page object es un patrón de diseño que nos ayudarás a disminuir la complejidad de nuestros tests. Debido a que nos entregará menos código por mantener, mayor abstracción en nuestras pruebas y una complejidad menor en nuestros tests.

Guía para utilizar WebElementHighlighter

WebElementHighlighter es una librería python que nos permite resaltar WebElements de Selenium. La principal finalidad de esta librería es poder mostrar al tester que elementos de una página están fallando.

Sus funcionalidades actuales son:

• Hacer parpadear WebElements.
• Cambiar estilos como fondo y bordes de WebElements.

Instalación.

pip install webelement_highlighter

Ejemplo de uso.

from webelement_highlighter import WebElementHighlighter
from selenium import webdriver

driver = webdriver.Chrome()
driver.get("https://www.w3schools.com/js/default.asp")

wh = WebElementHighlighter(driver)

we = driver.find_element_by_id("topnavbtn_references")
wes = driver.find_elements_by_class_name("w3-col")

wh.make_it_blink(we)
wh.make_them_blink(wes, times=20)

wh.highlight_element(we)
wh.highlight_elements(wes, stop=True)

Nota.

Para ejecutar el ejemplo es necesario tener instalada la librería selenium.

Enlaces.

Repositorio: https://github.com/rtorres90/webelement_highlighter

Guía para utilizar MaildropccReader.

MaildropccReader es un librería que permite extraer correos desde cuentas de www.maildrop.cc. Maildrop es una página que nos permite tener acceso a cuentas de correo públicas que usualmente se utilizan para probar si aplicaciones o servicios están enviando correos a terceros apropiadamente.

Instalación.

Para instalar MaildropccReader solamente debemos ejecutar el siguiente comando:

pip install MaildropccReader

Ejemplo de uso.

>>> from MaildropccReader import MaildropccReader
>>> maildrop_reader = MaildropccReader(email_account="chile")
>>> maildrop_reader.get_emails()
Output:
[{
    'id':'aTC7Qx',
    'sender': u'test@ismyemailworking.com',
    'subject':'IsMyEmailWorking.com - Test ID [c8a64c21-2c1b-463d-8bf0-1283f8e16f92]',
    'date': u'Jul 15 2017 10:30 AM',
    'body':'Received: from IsMyEmailWorking.com ([108.60.212.145])\r\n        by localhost\r\n        with SMTP (MailDrop) id J55KIM4A\r\n        for chile@maildrop.cc;\r\n        Sat, 15 Jul 2017 10:30:25 -0700 (PDT)\r\nMIME-Version: 1.0\r\nMessage-ID: <afe6e0fd7cfe899d@b0467bdd42a8d410>\r\nDate: Sat, 15 Jul 2017 10:30:58 -0700\r\nFrom: "Email Test" <test@ismyemailworking.com>\r\nTo: chile@maildrop.cc\r\nSubject: IsMyEmailWorking.com - Test ID [c8a64c21-2c1b-463d-8bf0-1283f8e16f92]\r\nContent-Type: text/plain;\r\n\tcharset="utf-8"\r\nContent-Transfer-Encoding: quoted-printable\r\n\r\nCongratulations=20you=20have=20now=20proven=20that=20you=20at=20least=20rec=\r\neive=20email!=20Now=20to=20prove=20that=20you=20can=20also=20send=20email=\r\n=20simply=20reply=20to=20this=20message=20and=20we=20will=20let=20you=20kno=\r\nw=20when=20we=20receive=20your=20reply.=20Be=20sure=20to=20check=20your=20j=\r\nunk/bulk/spam=20(whatever=20it=20is=20for=20you)=20box=20again=20for=20our=\r\n=20next=20reply.=0d=0a=0d=0a=0d=0aPlease=20note,=20we=20do=20not=20spam=20o=\r\nr=20solicit=20anyone.=20You=20received=20this=20email=20because=20you=20(or=\r\n=20someone=20posing=20to=20be=20you)=20requested=20it.=20We=20implement=20a=\r\nnd=20work=20to=20constantly=20improve=20our=20security=20technologies=20in=\r\n=20order=20to=20prevent=20non-humans=20and=20others=20from=20using=20your=\r\n=20email=20address=20in=20our=20service=20while=20at=20the=20same=20time=20=\r\nothers=20may=20work=20constantly=20to=20defeat=20our=20security.=20If=20you=\r\n=20have=20received=20this=20email=20and=20did=20not=20request=20us=20please=\r\n=20contact=20us=20via=20the=20contact=20link=20on=20our=20website=20at=20ht=\r\ntp://IsMyEmailWorking.com/Contact.aspx.\r\n'
}]

Enlaces.
Repositorio: https://github.com/rtorres90/maildropcc-reader

Directivas de formatos de fecha para utilizar con strftime y strptime.

Ejemplos basados en datetime.datetime(2013, 9, 30, 7, 6, 5)




Código	Explicación	Ejemplo
%a	Día de la semana abreviado.	Mon
%A	Nombre completo de día de la semana.	Monday
%w	Número de la semana como dígito, donde 0 es Domingo y 6 es Sábado.	1
%d	Día de la semana en número decimal, si contiene sólo un dígito python añadirá un cero a la izquierda.	30
%-d	Día de la semana en número decimal.	30
%b	Nombre de mes abreviado.	Sep
%B	Nombre completo de mes.	September
%m	Mes como número decimal,  si contiene sólo un dígito python añadirá un cero a la izquierda.	09
%-m	Número decimal del mes.	9
%y	Últimos dos dígitos del año,  si contiene sólo un dígito python añadirá un cero a la izquierda.	13
%Y	Año en números decimales.	2013
%H	Hora en números decimales, si contiene sólo un dígito python añadirá un cero a la izquierda. (Formato 24 horas)	07
%-H	Hora en números decimales. (Formato 24 horas)	7
%I	Hora en números decimales, si contiene sólo un dígito python añadirá un cero a la izquierda. (Formato 12 horas)	07
%-I	Hora en números decimales. (Formato 12 horas)	7
%p	Retorna si es AM o PM.	AM
%M	Minutos en número decimales, si contiene sólo un dígito python añadirá un cero a la izquierda.	06
%-M	Minutos en número decimales.	6
%S	Segundos en número decimales, si contiene sólo un dígito python añadirá un cero a la izquierda.	05
%-S	Segundos en número decimales.	5
%f	Microsegundos en números decimales, python añadirá un cero a la izquierda hasta tener 6 números.	000000
%Z	Time zone.
%j	Día del año en números decimales, python añadirá un cero a la izquierda hasta tener 3 números.	273
%-j	Día del año en números decimales.	273
%U	Número de la semana en números decimales,  si contiene sólo un dígito python añadirá un cero a la izquierda.	39
%W	Número de la semana en números decimales.	39
%c	Muestra la fecha y hora de la manera esperada para el formato local.	Mon Sep 30 07:06:05 2013
%x	Muestra la fecha de la manera esperada para el formato local.	09/30/13
%X	Muestra la hora de la manera esperada para el formato local.	07:06:05
%%	Caracter literal de  '%'.	%

Fuente: http://strftime.org/

Configuración de webdriver para manejar descarga de PDFs.

Uno de los grandes problemas al momento de crear tests para una aplicación web que entregue PDFs como resultado en algunas de sus funcionalidades,  es controlar el comportamiento por defecto que tendrá el navegador frente a dichos archivos. Según mi experiencia como QA de automatización los principales problemas son los siguientes:

• Ventanas de confirmación de descarga. ¡Un verdadero dolor de cabeza!, es imposible interactuar con ellas porque son parte del navegador y no de la página web.

• Ubicación del archivo a descargar. Un gran problema si no es manejado en la configuración de tu driver porque el navegador por defecto intentará usar sus carpetas ocultas en los lugares más oscuros de tu pc, ten en cuenta que además las rutas para dichos directorios son diferentes por sistema operativo, por lo tanto buscar manualmente o hardcodear una ruta es casi imposible sin previa investigación.

• Plugins por defecto del navegador. Actualmente los navegadores son capaces de leer los PDFs sin ningún tipo de plugin de terceros. Esto es un problema bastante recurrente, intentas descargar un pdf, pero ¡pum! el navegador mágicamente lo abre, rompiendo totalmente con el flujo de tu test.

Para poder resolver estos problemas es necesario modificar las configuración de los navegadores y guardar estos cambios dentro de un perfil.

A continuación listaré y explicaré los pasos para crear estos perfiles con sus configuraciones necesarias para los drivers de Firefox y Chrome utilizando Python.

Firefox.

profile = webdriver.FirefoxProfile() #1

profile.set_preference("browser.download.folderList", 2)#2
profile.set_preference("browser.download.dir", cfg.temp_pdf)#3
profile.set_preference("browser.download.useDownloadDir", True)#4
profile.set_preference("browser.download.manager.showWhenStarting", False)#5
profile.set_preference("browser.helperApps.neverAsk.saveToDisk", "application/pdf")#6
profile.set_preference("browser.download.manager.showAlertOnComplete", False)#7
profile.set_preference("browser.download.manager.useWindow", False)#7
profile.set_preference("pdfjs.disabled", True)#9
self.driver = webdriver.Firefox(profile)#10

Configuración para firefox.

1. Se crea un perfil de firefox vacío.
2. Con el número 2 le indicamos a firefox que debe utilizar la carpeta especificada en el paso 3.
3. Acá le proporcionaremos a firefox la carpeta que queremos utilizar como directorio de descarga.
4. Ahora activamos el uso del directorio asignado en el paso 3.
5. Apagamos la animación de comienzo de descarga. (Opcional)
6. Este paso es muy importante, acá le pasaremos como parámetro los MIME type que queremos descargar sin preguntar. Más info sobre MIME types.
7. Desactivamos animación de descarga completa. (Opcional)
8. Deshabilitamos la ventana de descarga de firefox.
9. Apagamos el plugin por defecto de firefox para leer archivos PDF.
10. Instanciamos el driver de Firefox pasando como parámetro nuestro profile recién creado.

Chrome

chrome_profile = webdriver.ChromeOptions()#1
profile = {"download.default_directory": cfg.temp_pdf,
           "download.prompt_for_download": False,
           "download.directory_upgrade": True,
           "safebrowsing.enabled": True,
           "plugins.always_open_pdf_externally": True}#2
chrome_profile.add_experimental_option("prefs", profile)#3
chrome_profile.add_argument("--disable-extensions")#4
chrome_profile.add_argument("--disable-print-preview")#5
self.driver = webdriver.Chrome(chrome_options=chrome_profile)#6

Configuración para Chrome.

1. Se crea un perfil de chrome vacío.
2. Acá creamos un diccionario con las siguientes configuraciones.
1. Directorio por defecto para las descargas de chrome.
2. Acá apagamos  la ventana que pregunta donde ubicar y como llamar el archivo por descargar.
3. Opción para que chrome pueda crear la ruta de descarga si es que no existe.
4. Navegación segura activada. (Opcional)
5. Para abrir el pdf externamente.
3. Se añade el diccionario recién creado como las preferencias del perfil.
4. Desactiva todas las extensiones de Chrome para evitar que algún plugin del navegador intente abrir los archivos PDF.
5. Acá desactivamos la vista de impresión para evitar nuevamente que algo intente abrir los PDFs.
6. Finalmente instanciamos el chromedriver pasando como parámetros el perfil de chrome recién creado.

Tal como pudimos apreciar, la configuración para evitar la interrupción de tests que contengan PDFs es un tanto compleja, ya que se debe tener en consideración muchas variables como lugar de descarga, desactivación de plugins, etc. Como comentario profesional siempre recomiendo descargar los pdfs utilizando código para no crear tests completamente dependientes de la máquina en que se están corriendo los tests, debido a que estos tipos de tests no van a funcionar al 100% en drivers provistos por saucelabs.

Introducción a Vagrant

¿Qué es Vagrant?

Vagrant es una herramienta opensource la cual permite la creación de entornos virtuales donde los desarrolladores pueden trabajar libremente independiente del sistema operativo que ellos estén utilizando.

¿Por qué usar Vagrant?

Vagrant es extremadamente simple de utilizar, por lo tanto, sus archivos de configuración son fáciles de reproducir y portables. Además posee una cantidad gigantesca de boxes para llegar e instalar, por ejemplo: hay boxes de diferentes versiones de ubuntu e incluso otras con todo lo necesario para comenzar a utilizar laravel o un servidor lamp. A estas alturas, Vagrant es un estándar de la industria del software.

Prerrequisitos para utilizar vagrant.

Para poder utilizar vagrant necesitamos un virtualizador de máquinas virtuales, siempre se recomienda utilizar Virtualbox. La razón de esto, es que el proyecto Vagrant ha sido ideado para trabajar con esta aplicación.

Instalación de Vagrant.

Despues de instalar Virtualbox es necesario ir a la página de descargas de Vagrant y descargar el instalador para tu sistema operativo. Al tener el instalador, en nuestra máquina debemos ejecutarlo e instalar Vagrant. En Mac y Windows esto es muy fácil, por lo tanto, solamente enseñaré como instalarlo en sistemas GNU/Linux.

1. Abre un terminal.
2. Ve al directorio donde está el instalador de Vagrant.
3. Ejecuta el siguiente comando.

   $ sudo dpkg -i vagrant_TU_ARCHIVO.deb

4. Para verificar la instalación, ejecuta este comando para ver la versión de Vagrant.

   $ vagrant -v

Creando y corriendo nuestra primera máquina Vagrant.

¡Ahora que tenemos todo lo necesario instalado podremos crear nuestra primera máquina Vagrant!. Para poder hacer esto, ejecuta los siguiente pasos:

1. Abre un terminal y crea un directorio de prueba.
2. Ve al directorio recién creado y ejecuta los siguientes comandos.

   $ vagrant init hashicorp/presice64
   $ vagrant up

¿Qué hicimos con estos comandos?

Con 'vagrant init hashicorp/precise64' le ordenamos a vagrant que cree un archivo Vagrantfile con todo lo necesario para descargar la box hashicorp/precise64. Después con el comando 'vagrant up', Vagrant utiliza el Vagrantfile para descargar la box solicitada y después levantar la máquina virtual cuando todo esté listo.

Accediendo a la máquina Vagrant.
Para acceder ala máquina recién creada debes ejecutar el siguiente comando:

$ vagrant ssh

Después de esto nos encontraremos dentro de la máquina virtual y podremos ejecutar todos los comandos que queramos. Cabe mencionar que vagrant siempre crea credenciales root en la máquinas virtuales que son levantadas con sus boxes públicas, usualmente estás credenciales  son:
Usuario: vagrant
Password: vagrant

Conclusión.
Cómo se comentó al comienzo de este post, Vagrant es una excelente solución para levantar entornos de desarrollo replicables y fáciles de configurar. Siguiendo los pasos descritos podemos demostrar la facilidad de uso de esta tecnología.

Cabe mencionar, que esta es la primera entrada de varios tutoriales y tips que compartiré de Vagrant, por lo tanto, no te enojes con la simpleza de este post jeje.