📘 Documentación de Avances — Selenium IDE
Este documento recopila los aprendizajes, configuraciones, buenas prácticas y soluciones a problemas encontrados durante el uso de Selenium IDE en los proyectos del equipo (BAT).
El objetivo es que sirva como referencia para otros compañeros, facilitando el trabajo colaborativo y la resolución de errores futuros.
🚀 ¿Qué es Selenium?
Selenium es una herramienta para automatizar pruebas en navegadores web. Permite simular acciones como:
- Navegar a una URL
- Hacer clic en elementos
- Escribir texto
- Validar información en pantalla
- Manejar iframes, formularios y alertas
🚀 ¿Qué es Selenium IDE?
Selenium IDE es una herramienta de automatización que permite:
- Grabar interacciones con el navegador
- Ejecutar pruebas de forma repetitiva
- Exportar los test a diferentes lenguajes
- Organizar suites de prueba
- Validar elementos del DOM sin necesidad de programar
Se utiliza principalmente como extensión de navegador para Firefox y Edge. Es especialmente útil para automatizaciones rápidas, validación de flujos y pruebas exploratorias automatizadas.
💥(Selenium IDE dejo de ser compatible con Chrome)
:tools: Configuración del Entorno
✔️ Instalacion via Extension:
- Asegúrate de usar tu browser preferido (Firefox o Microsoft Edge).
- Navega a Selenium IDE.
- Selecciona tu navegador, sigue los pasos de instalación y se estará instalando como extensión en tu browser seleccionado.
- Asegúrate de que la extensión esté visible en tu toolbar del navegador y verifica que la extensión se instaló correctamente.
✔️ Instalacion via .zip:
- Navega a Selenium IDE.
- Haz click en
Latest Zip - En la pagina de GitHub selecciona un archivo ejecutable depende de tu sistema operativo, en este caso usaremos
Selenium-IDE-Setup-4.0.1-beta.14.exe - Cuando la descarga termine, abre el archivo ejecutable y sigue los pasos de la instalación.
✔️ Archivos y proyectos:
Un proyecto de Selenium IDE contiene:
- 📁 Suites → Conjuntos de pruebas
- ✏️ Tests → Casos de prueba individuales
- ⚙️ Comandos → Acciones registradas (click, type, open, assert, wait, etc.)
✔️ Solucion de problemas con la extension
¿No ves el icono de Selenium IDE en tu barra de menú?
Asegúrate de que el IDE esté habilitado en la configuración de extensiones de tu navegador. Puedes llegar rápidamente escribiendo lo siguiente en tu barra de direcciones y presionando Enter .
- Firefox:
about:addons - Microsoft Edge:
edge://extensions
⭐ Bienvenida
Depende de cómo descargues Selenium IDE, ya sea como extensión o como programa, el menú de bienvenida va a hacer diferente igual con la UI .
Selenium IDE Programa:
{width="579" height="380"}
Selenium IDE Extension:
{width="621" height="208"}
Seleccione la opción que necesite.
Si es tu primera vez usando el IDE (o estás comenzando un nuevo proyecto), entonces selecciona Create a new project o Create Project
🔄 Flujo Básico de Trabajo
⭐ Grabando tu primera prueba
- Ten lista la URL que vas a necesitar, y agrégala en Playback base URL. La URL base es la URL de la aplicación que estás probando. Es algo que configuras una sola vez y se utiliza en todas las pruebas de este proyecto. Puedes cambiarla más tarde si es necesario.
- Después de completar estos ajustes, se abrirá una nueva ventana del navegador, cargará la URL base y comenzará a grabar.
- Interactúa con la página y cada una de tus acciones se grabará en el IDE. Para detener la grabación, cambia a la ventana del IDE y haz clic en el icono de grabación (parte superior derecha).
⭐ Organizando tus pruebas
✏️ Tests - Pruebas
Via Extension
Puedes agregar una nueva prueba haciendo clic en el símbolo + en la parte superior del menú de la barra lateral izquierda (a la derecha del encabezado Tests ), nombrándola y haciendo clic en ADD .
Una vez añadido, puedes introducir comandos manualmente o hacer clic en el icono de grabación en la parte superior derecha del IDE.
Via Archivo Ejecutable
Puedes agregar una nueva prueba haciendo clic en el menu Tests y haciendo clic en el simbolo verde + en la parte superior del menu de la barra lateral izquierda (a la derecha del signo ? .
Una vez añadido, puedes introducir comandos manualmente o hacer clic en el icono de grabación.
📁 Suites
Las pruebas pueden agruparse en suites. Al crear un proyecto, se crea un Default Suite y tu primera prueba se agrega automáticamente a él.
Via Extension
Para crear y gestionar conjuntos, vaya al panel Test suites . Puede acceder haciendo clic en la lista desplegable del menú de la barra lateral izquierda (por ejemplo, haga clic en la palabra Tests ) y seleccionando Test suites .
Via Archivo Ejecutable
Para crear y gestionar conjuntos, vaya al menu Suites .
Añadir un suite
Via Extension
Para agregar un suite, haga clic en el símbolo + en la parte superior del menú de la barra lateral izquierda, a la derecha del encabezado Test Suites , proporcione un nombre y haga clic en ADD .
Via Archivo Ejecutable
Para agregar un suite, vaya al menu Suites, haga clic en el simbolo + en la parte superior del menú de la barra lateral izquierda.
Agregar una prueba
Via Extension
Para agregar una prueba a una suite, pase el ratón sobre el nombre de la suite y luego haga lo siguiente:
- Haz clic en el icono que aparece a la derecha del encabezado
Test Suites - Haz clic en
Add tests - Selecciona las pruebas que quieres agregar desde el menú
- Haz clic en
Select
Via Archivo Ejecutable
Cuando ya existan varios tests creados, podrá elegir cuáles desea agregar a la suite. Para hacerlo,
- Vaya a la sección
Available tests - Arrastre los tests hacia el área
Drop Tests Here.
Eliminar una prueba
Via Extension
Para eliminar una prueba, coloque el ratón sobre la prueba y haga clic en el X que aparece a la derecha del nombre.
Via Archivo Ejecutable
Para eliminar una prueba, coloque el ratón sobre la prueba y haga clic derecho y seleccione Delete Test(s)
Cambiar el nombre de un conjunto de pruebas
Via Extension
Para cambiar el nombre de un suite, pase el ratón sobre el nombre del suite, haga clic en el icono que aparece a la derecha del nombre, haga clic en Rename , actualice el nombre y haga clic en RENAME .
Via Archivo Ejecutable
Para cambiar el nombre de una suite, coloca el cursor sobre ella, haz doble clic y escribe el nuevo nombre.
⭐ Revisar y Editar Comandos
📝 Ajustar:
clicktypeopenassert textwait for element visible
🎯 Tip: cambiar selectores si están muy largos o inestables.
⭐ Guarda tu trabajo
Via Extension
Para guardar todo lo que acabas de hacer en el IDE, haz clic en el icono de guardar en la esquina superior derecha del IDE.
Te pedirá una ubicación y un nombre para guardar el proyecto. El resultado final es un único archivo con extensión .side .
Via Archivo Ejecutable
Haz clic en File en la parte superior del programa y, en el menú desplegable, selecciona Save Project As.... También puedes usar el atajo Ctrl + Shift + S.
Luego, el sistema te solicitará elegir una ubicación y un nombre para guardar el proyecto.
El resultado final será un único archivo con la extensión .side.
⭐ Playback - Reproduccion
Puedes reprobar pruebas en el IDE seleccionando la prueba o suite que deseas reprobar y haciendo clic en el botón de reproducción de la barra de menú situada por encima del editor de pruebas.
Via Extension
Las pruebas se reproducirán en el navegador. Si una ventana sigue abierta desde la grabación, se utilizará para la reproducción. De lo contrario, se abrirá una nueva ventana y se utilizará.
Via Archivo Ejecutable
Las pruebas se ejecutarán en la ventana de preview del navegador dentro de la aplicación. Si durante la grabación quedó una pestaña abierta, el sistema abrirá automáticamente una nueva pestaña para utilizarla en la reproducción.
❌ Si falla, revisar selector / wait / frame
⭐Ajustar / Documentar Problemas
:puzzle_piece: Si encuentras un error → documentarlo
🧠 Compartir solución si se encuentra
🌟 Buenas Prácticas
⏳ 1. Usar esperas antes de interactuar
wait for element visiblewait for element present
🧭 2. Manejar iframes correctamente
select frame name=…select frame parent
🏷️ 3. Usar selectores estables
-
CSS simples
-
XPath corto
Evito:
-
Selectores enormes generados automáticamente
📂 4. Organización
- Tests con nombres claros
- Suites por funcionalidad
- Agregar notas cuando un selector sea crítico
🪲 Problemas Encontrados y Soluciones
🔹 Problema 1: Menu/Elemento no encontrado
Síntoma:
❌ Element could not be found.
❌ Unable to locate element.
❌ Failed: Implicit Wait timed out after 30000 ms
🤔 Posible causa:
La vista cambia a un iframe o form embebido.
:tools: Solución:
select frame index=0antes del click- Si la página contiene varios iframes, asegúrate de seleccionar el índice correspondiente al que deseas interactuar.
🔹 Problema 2: El DOM carga muy lento
Solución:
⏳ Añadir:
wait for element visiblewait for element present
🔹 Problema 3: Selectores inestables
Solución:
🏷️ Crear selectores más simples y estables:
Ejemplo:
css=button[id='reportsBtn']xpath=//button[text()='Reports']
🔹 Problema 4: "assert alert"
Síntoma:
❌ Aunque en algunas aplicaciones (por ejemplo, PITSMD) se muestran alerts de JavaScript, el comando assert alert no los detecta. Sin embargo, el comando assert confirmation sí funciona correctamente.
Solución:
🏷️ Hacer la interaccion manual
🔹 Problema 5: Botones inaccesibles por IDs dinámicos al recargar la página
Síntoma:
❌ Los botones no se encuentran porque sus IDs cambian cada vez que la página se vuelve a renderizar.
Solución:
Al seleccionar el locator en Selenium IDE, Selenium lo selecciona por ID, pero como los ID son dinámicos y cambian. Es mejor seleccionarlo por xpath.
Ejemplo:
- Al seleccionar el botón, en lugar de usar el ID, abre el menú “▼” que aparece junto al campo Target y elige alguna de las opciones basadas en XPath.
- XPath utilizado para la app QCSTT:
xpath=//fieldset[2]/div/div/div/div[2]/div/div/div[2] - Dado que este XPath hace difícil identificar a qué elemento corresponde, puedes agregar una descripción en el campo Description de Selenium IDE para mantenerlo documentado.
🤝 Notas para el Equipo
- Si encontramos un error → vamos a documentarlo en esta wiki
- Si mejoramos un selector → vamos a compartirlo
- Esta Wiki será nuestro repositorio central de soluciones e informacion