Encontrar elementos en la página web puede ser una pesadilla debido a la complejidad de los elementos web. Sin embargo, los elementos web juegan un papel vital en el desarrollo y prueba de cualquier aplicación. Para facilitar las cosas a los testers, este artículo ofrecerá algunos conocimientos sobre Selenium findElement y findElements con la ayuda de un ejemplo.
Esto es lo que cubrirá el artículo:
- Introducción a Selenium findElement
- Diferencia entre findElement y findElements
- Sintaxis de Selenium findElement
- Tipos de localizadores
- Utilización de localizadores. Estrategia para findElement
Introducción a Selenium findElement
La interacción con una página web requiere que el controlador localice un elemento web y desencadene un evento JavaScript como un clic, enter, select, etc. o escribir el valor del campo. Por lo general, uno comienza las pruebas automatizadas de cualquier aplicación web con la búsqueda de elementos web relevantes en la página web. La mayoría de las veces, estas pruebas automatizadas se ejecutan utilizando frameworks como Selenium WebDriver.
Selenium define dos métodos para identificar elementos web:
- findElement: Un comando utilizado para identificar de forma única un elemento web dentro de la página web.
- findElements: Un comando utilizado para identificar una lista de elementos web dentro de la página web.
Entendamos la diferencia entre estos dos métodos con más detalle.
Diferencia entre findElement y findElements
| findElement | findElements |
| Devuelve el primer elemento web coincidente si el localizador descubre varios elementos web | Devuelve una lista de múltiples elementos web coincidentes |
| Lanza la excepción NoSuchElementException si no se encuentra el elemento | Devuelve una lista vacía si no se encuentra ningún elemento coincidente |
| Detecta un único elemento web element | Devuelve una colección de elementos coincidentes |
Para entender algunos comandos fundamentales de Selenium, eche un vistazo a Comandos básicos de Selenium Webdriver.
Sintaxis de Selenium findElement
El comando findElement devuelve un objeto de tipo WebElement. Puede utilizar varias estrategias de localización como ID, Name, ClassName, link text, XPath, etc.
A continuación se muestra la sintaxis:
WebElement elementName = driver.findElement(By.LocatorStrategy("LocatorValue"));
La estrategia de localización comprende los siguientes valores.
- ID
- Nombre
- Nombre de la clase
- Nombre de la etiqueta
- Texto del enlace
- XPath
El valor del localizador es el método único con el que se puede identificar fácilmente el elemento web.
Ejemplo:
driver.findElement(By.xpath("//input")).sendKeys("Guitar");
Sintaxis de Selenium findElements
El comando findElements devuelve una lista vacía si no hay elementos encontrados utilizando la estrategia de localizador y el valor de localizador dados. A continuación se muestra la sintaxis del comando findElements.
List<WebElement> elementName = driver.findElements(By.LocatorStrategy("LocatorValue"));
Ejemplo:
List<WebElement> listOfElements = driver.findElements(By.xpath("//div"));
Prueba Selenium Testing gratis
Ahora, vamos a profundizar en la comprensión de cómo encontrar elementos web con la ayuda de varios localizadores. Uno puede referirse a diferentes tipos de localizadores en Selenium.
Entendamos cómo usar Selenium findElement de varias maneras:
Buscar por ID
El ID se define de forma única para cada elemento y es la forma más común de localizar elementos usando el localizador ID. Si un sitio web tiene ids generados dinámicamente, entonces esta estrategia no se puede utilizar para encontrar un elemento de forma única. Sin embargo, devolverá el primer elemento web que coincida con el localizador.
Ejemplo: Tomemos www.amazon.com para automatizar y encontrar los elementos. Cuando uno navega a través de la caja de búsqueda e inspecciona el elemento, podrá ver varios elementos web como se muestra en la captura de abajo.
Como se puede ver, comprende un localizador ID cuyo valor es twotabsearchtextbox. El fragmento de abajo utiliza el mismo valor del localizador para escribir un programa.
Buscar por nombre
Esto es similar a Buscar por ID excepto que el controlador localizará un elemento por el atributo «nombre» en lugar de «id».
Ejemplo: Consideremos la misma página web de amazon. El cuadro de búsqueda también tiene un localizador de nombre cuyo valor es «field-keywords» como se muestra en la captura de abajo.
Todo el código sigue siendo similar al del localizador por ID, excepto que la diferencia estará en la sintaxis de findElement.
elementName = driver.findElement(By.name("field-keywords"))
Buscar por LinkText
LinkText es útil para encontrar enlaces en una página web. Es la forma más eficiente de encontrar elementos web que contengan enlaces.
Ahora, localiza un enlace Returns como se muestra a continuación.
Cuando el probador golpea ese enlace e inspecciona, localiza el texto del enlace Returns como se muestra en la captura de abajo.
Esto se puede localizar simplemente utilizando Selenium findElement con la sintaxis que se muestra a continuación:
elementLinktext = driver.findElement(By.linkText("Returns”))
Buscar por Selector CSS
El Selector CSS se utiliza para proporcionar reglas de estilo para las páginas web y también se puede utilizar para identificar uno o más elementos web.
Ejemplo: Consideremos la misma caja de búsqueda de la página de Amazon. Tiene un atributo class cuyo valor es nav-search-input. Utilizando el mismo valor, el método findElement de Selenium puede localizar el elemento.
elementcss= driver.findElement(By.cssSelector('div.nav-search-input'))
Búsqueda por XPath
XPath es una técnica de Selenium para navegar por la estructura HTML de una página. XPath permite a los probadores navegar a través de la estructura XML de cualquier documento y se puede utilizar tanto en documentos HTML como XML.
Ejemplo: Intentemos localizar la misma barra de búsqueda en Amazon con la ayuda de XPath. El código de abajo muestra que contiene un localizador ID. Observe que el XPath relativo comienza con ‘//’.
En la imagen de abajo, se puede ver una etiqueta input. Comienza con //input. Aquí //input implica un nombre de etiqueta. Haga uso del atributo id y pase twotabsearchtextbox entre comillas simples como su valor. Esto dará la expresión XPath que se muestra a continuación:
//input
Ahora, usando el método Selenium findElement, ejecuta el código que se muestra a continuación:
elementxpath = driver.findElement(By.xpath("//input"))
Ejecuta pruebas de Selenium gratis en dispositivos reales
La localización de elementos web es la base de las pruebas automatizadas de Selenium de sitios web y aplicaciones web. Para saber más sobre los fundamentos de Selenium, echa un vistazo a Selenium WebDriver Tutorial.