Skip to main content

Grabaciones web

Grabación de una transacción sencilla


Para poder realizar una grabación Selenium dispone de un amigable IDE que permite realizar esta tarea fácilmente.

La extensión de Selenium IDE puede utilizarse tanto en Google Chrome como en Mozilla Firefox, para poder añadir la extensión en cualquiera de estos navegadores haremos lo siguiente.

Chrome

Desde el siguiente link puedes añadir la extensión Selenium IDE de chrome

https://chrome.google.com/webstore/detail/selenium-ide/mooikfkahbdckldjjndioackbalphokd

image-1647615158382.png

Mozilla firefox

Inicie Firefox y navegue hasta https://addons.mozilla.org/en-US/firefox/addon/selenium-ide/  

Haga clic en Agregar a Firefox

image-1647615376058.png

Empezar a grabar con selenium

 

Para empezar a grabar en Selenium, se debe crear un proyecto nuevo:
 

image-1647615424535.png

Se le debe asignar un nombre:

image-1647615442320.png

Para iniciar la grabación, se debe dar al boton de "rec".

image-1647615457303.png

En "Base url" se deberá introducir la url  que se quiere grabar.

image-1647615466914.png

Se abrirá una nueva ventana de la url que hemos introducido, en la que podremos ver un icono como el de la imagen de abajo, situado en la esquina izquierda derecha de la pantalla, que indicará que Selenium esta grabando.

image-1647968996685.png

Para parar la grabacción se puede utilizar el siguiente botón:

image-1647969029458.png

Una vez parada la grabación, las acciones realizadas en esta quedarán grabadas como una secuencia de comandos, con un aspecto similar al siguiente:

image-1647948607058.png

Una vez terminada la grabación podemos guardar el fichero .side resultante dando al botón "save project" , que será la grabación que usemos en PandoraFMS.

Sugerencias para las grabaciones de Selenium

Es recomendable el uso de algunos comandos en nuestra grabación de selenium para un mejor tratado de estas desde PandoraFMS. Algunos de estos son :

  • Comando set speed

    Algunas grabaciones  pueden ir demasiado rápido y esto puede provocar un error en esta a la hora de procesar cada paso. Con este comando se le puede asignar una velocidad determinada a la grabación para evitar estos posibles fallos.

    Se puede asignar este comando al principio de la grabación con el boton derecho del ratón y pulsando "insert new command"

    image-1647443706110.png

    Una vez hecho esto se le puede asignar el comando y el valor que determinará la velocidad de la grabación (en milisegundos).

    image-1647443763991.png



  • Comandos wait for element presentwait for visible y wait for text

    Pueden establecer el tiempo en milisegundos que esperará para que el elemento aparezca en la página antes de marcar la transacción como fallo. Es importante destacar que el uso de estos comandos, si bien aumentan sobremanera la fiabilidad del chequeo, también incrementarán el tiempo que se tarda en ejecutar la transacción.



  • Introducir fases en la transacción

    Pandora FMS WUX permite dividir la monitorización de la navegación de un sitio web en múltiples módulos, que representarán cada uno de los pasos realizados. Esto puede ser de gran ayuda a la hora de controlar un fallo o de esquematizar la información.

     

     

     

    Para introducir estos comentarios se debe insertar un nuevo comando y dividir el bloque de cada fase con :

    //phase_start:<nombre identificativo>

    //phase_end:<nombre identificativo>


    Ejemplo con la grabación sencilla de antes al añadir estos cambios :

     

    image-1647973098767.png



    Esta transacción se vería representada mediante módulos en PandoraFMS, creando uno global_status y otro global_time por cada fase de la transacción (también se creara uno extra llamado snapshot si se produce un error, con una imagen del momento en el que se ha producido):

     

    Especificando directamente el módulo en el que se ha producido el error y mostrando una captura indicando el momento exacto del fallo.

  • Realizar comprobaciones de los elementos. Para esto se usarán comandos como assert y verify, en sus distintas vertientes. Acabar una transacción con un clic, por ejemplo, no nos garantiza que la nueva página que deba abrir el elemento en el que se hace clic se abra, solo que es posible hacer clic en el elemento. Si después del clic introducimos un verify text a un texto que se sepa que solo se va a cargar después de realizar el clic, esa sí sería una forma de comprobar que la página a la que nos manda el clic está disponible.

  • Utilizarstore window handle en transacciones en las que se vaya a cambiar de ventanas. El cambio de ventana (con un select window) puede dar fallo si no se ha almacenado previamente un identificador a la ventana inicial.

  • Utilizarxpath cuando falle el Target por identificador de CSS o cuando quiera buscar contenido en la página. Por defecto el grabador de Selenium IDE introduce en el Target del elemento el localizador del CSS, pero también graba el localizador por xpath, por tanto es posible ver todos los localizadores que guarda si pulsa en la caja del Target en el grabador:Además, utilizando rutas por xpath, es posible buscar textos dentro de las etiquetas de las páginas para realizar grabaciones mucho más dinámicas. En la captura de pantalla anterior observe que es posible usar un xpath que busque el texto “Innovadores de la monitorización” en todas las etiquetas span de la página, no en un locator en concreto.

 

Grabaciones complejas

Selenium tiene muchos  elementos y opciones que se pueden utilizar para personalizar la transacción.

Ejemplo de una transacción compleja

image-1647453195349.png

En este caso vemos una grabación que entra en sourceforge y comprueba que existen los archivos de la ultima release y que esos archivos se han generado en este mes.

Comando store test

image-1647453342142.png

Guarda en una variable el valor de un elemento. Con la opcion "find target" podemos ver seleccionado cual es el elemento.
image-1647453618326.png


Comando execute script

Con este comando se pueden ejecutar scripts

Ejemplo:

image-1647454256443.png

Este pequeño script concretamente comprueba si el texto que tiene dentro coincide con un patron.

Ese valor quedaría guardado en una variable y luego comprobando el valor de la variable se puede hacer que la grabación haga una cosa o otra, pudiendo pillar distintos caminos dependiendo del resultado de la transacción.

image-1647454100212.png

Después de esto entra en el enlace comprueba que existen ciertos elementos y termina.

image-1647454366084.png

 

Recuperación de valores de una página web

Esto nos permite recoger información de un dato en un momento de la transacción para guardar dicho valor en un módulo normal de datos de Pandora FMS. Para ello usaremos el siguiente comando avanzado en nuestra grabación: getValue.

Comando getValue

Este comando es muy interesante ya que permite crear un módulo en PandoraFMS

image-1647454580988.png

La sintaxis para su uso es la siguiente :

//getValue;<nombre_modulo>;<tipo_de_dato>;<valor del modulo o expresión regular>


getValue

Instrucción para el sistema UX.

Nombre del módulo

El nombre del módulo tal y como aparecerá en Pandora FMS.

Tipo de dato del módulo

Qué tipo se utilizará; puede ser cualquiera de los tipos de datos soportados por Pandora FMS

Expresión regular Perl a utilizar para la captura de datos

Debe ser una expresión regular Perl, con la orden de captura de información entre paréntesis.

Por ejemplo, en el texto:

<p>La temperatura de la placa solar es de: <span class ="temperatura">54º C</span></p>

Si quiere recuperar la temperatura para llevar un seguimiento del valor, especifique la expresión regular como sigue:

<span class ="temperatura">(\d+\.*\,*\d*).*</span>

De tal manera que recuperará el valor 54 del ejemplo, o posibles valores con posiciones decimales.

La directiva de captura completa quedaría como sigue:

getValue;temperatura placa solar;generic_data;<span class="temperatura">(\d+\.*\,*\d*).*</span>

Los comandos que generan módulos son:

  • getValue: Extrae un valor.
getValue;nombre_modulo;tipo_modulo;REGEX_de_captura
  • getVariable: (Versión NG 753 o superior ) Extrae un valor específico de una variable.
getVariable;nombre_modulo;tipo_modulo;nombre_variable
  • getScreenshot: Extrae una captura de pantalla.
getScreenshot;nombre_modulo


getValue es un comando que pertenece al tipo que generan los módulos PFMS. Visita el enlace anterior para saber más sobre ellos.

Todos los comandos propios deben aparecer en el fichero de test (.side) como comentarios. En caso contrario, fallará a la hora de probar el test en la extensión de Selenium.

Lista de Comandos

La lista de comandos compatibles para usarlos en Pandora FMS se puede encontrar en el siguiente enlace.

Macros personalizadas

El funcionamiento de las macros personalizadas implica la sustitución de determinadas cadenas de texto presentes en el fichero de sesión de navegación por ciertos valores personalizables.

En el caso de módulos de análisis web, se ha mejorado esta funcionalidad, permitiendo macros dinámicas que permiten que estos valores se traduzcan en fechas y horas variables.

¿Por qué esta funcionalidad?

Suponga que necesita monitorizar, mediante una sesión de navegación, el correcto funcionamiento de una aplicación web de reserva de salas de reuniones.

Si estableciera una fecha y hora fija a la hora de rellenar los datos del formulario, es posible que el sistema cancelase la reserva porque en algún momento quede en el pasado; por ejemplo, podría estar intentando reservar una sala para la semana pasada.

También es posible que encontremos con un máximo de tiempo para poder efectuar esa reserva, y que el sistema nos obligue a reservar la sala dentro de un periodo de tiempo concreto, por ejemplo no superior al mes vigente.

Para evitar tener que editar la macro cada pocos días, y despreocuparse del apartado de configuración, puede usar las macros dinámicas, indicando al sistema que reserve la sala siempre para el día siguiente al momento de realizar el test.

Para poder usar esta funcionalidad, los valores deberán tener un formato específico, logrando las siguientes sustituciones posibles:

  • @DATE_FORMAT: fecha/hora actual con formato definido por el usuario.
  • @DATE_FORMAT_nh: horas.
  • @DATE_FORMAT_nm: minutos.
  • @DATE_FORMAT_nd: días.
  • @DATE_FORMAT_ns: segundos.
  • @DATE_FORMAT_nM: mes.
  • @DATE_FORMAT_nY: años.

Donde “n” puede ser un número sin signo (positivo) o negativo.

Y FORMAT sigue el estándar de strftime de Perl

Ejemplos:

@DATE_%Y-%m-%d %H:%M:%S
@DATE_%H:%M:%S_300s
@DATE_%H:%M:%S_-1h