Heading

Localización de un elemento

Una de las técnicas más fundamentales que hay que aprender cuando se utiliza WebDriver es cómo encontrar elementos en la página. WebDriver ofrece una serie de tipos de selectores incorporados, entre los que se encuentra encontrar un elemento por su atributo ID:

Como se ve en el ejemplo, la localización de elementos en WebDriver se realiza sobre el objeto de instancia WebDriver. El método findElement(By) devuelve otro tipo de objeto fundamental, el WebElement.

• WebDriver representa el navegador
• WebElement representa un nodo DOM concreto(un control, por ejemplo, un enlace o campo de entrada, etc.)

Una vez que tenga una referencia a un elemento web que ha sido «encontrado», puede reducir el alcance de su búsqueda utilizando la misma llamada en esa instancia de objeto:

Puede hacer esto porque tanto los tipos WebDriver como WebElementimplementan la interfaz SearchContext. En WebDriver, esto se conoce como una interfaz basada en roles.Las interfaces basadas en roles permiten determinar si una implementación particular de WebDriver admite una función determinada. Estas interfaces están claramente definidas e intentan ceñirse a un único rol de responsabilidad. Puede leer más sobre el diseño de WebDriver y qué roles se admiten en qué controladores en la sección Some Other Section WhichMust Be Named.

En consecuencia, la interfaz By utilizada anteriormente también admite una serie de estrategias de localización adicionales. Una búsqueda anidada podría no ser la estrategia de localización de quesos más efectiva, ya que requiere que se emitan dos comandos separados al navegador; primero buscando en el DOM un elemento con ID «cheese», y luego una búsqueda de «cheddar» en un contexto más estrecho.

Para mejorar ligeramente el rendimiento, deberíamos intentar utilizar un localizador más específico: WebDriver soporta la búsqueda de elementosmediante localizadores CSS, lo que nos permite combinar los dos localizadores anteriores en una sola búsqueda:

Localización de múltiples elementos

Es posible que el documento con el que estamos trabajando resulte tener una lista ordenada de los quesos que más nos gustan:

<ol id=cheese> <li id=cheddar>… <li id=brie>… <li id=rochefort>… <li id=camembert>…</ol>

Dado que más queso es indiscutiblemente mejor, y sería engorroso tener que recuperar cada uno de los elementos individualmente, una técnica superior para recuperar el queso es hacer uso de la versión pluralizada findElements(By). Este método devuelve una colección de elementos web. Si sólo se encuentra un elemento, devolverá igualmente una colección (de un elemento). Si ningún elemento coincide con el localizador, se devolverá una lista vacía.

Estrategias de selección de elementos

Hay ocho estrategias diferentes de localización de elementos incorporadas en WebDriver:

Consejos sobre el uso de selectores

En general, si los ID de HTML están disponibles, son únicos y consistentemente predecibles, son el método preferido para localizar un elemento en una página. Tienden a funcionar muy rápidamente, y a renunciar a gran parte del procesamiento que conllevan los complicados recorridos del DOM.

Si los IDs únicos no están disponibles, un selector CSS bien escrito es el método preferido para localizar un elemento. XPath funciona tan bien como los selectores CSS, pero la sintaxis es complicada y a menudo difícil de depurar. Aunque los selectores XPath son muy flexibles, los proveedores de navegadores no suelen probar su rendimiento y tienden a ser bastante lentos.

Las estrategias de selección basadas en linkText y partialLinkText tienen el inconveniente de que sólo funcionan en elementos de enlace. Además, recurren a selectores XPath internamente en WebDriver.

El nombre de la etiqueta puede ser una forma peligrosa de localizar elementos. Frecuentemente hay múltiples elementos de la misma etiqueta presentes en la página.Esto es principalmente útil cuando se llama al método findElements(By) que devuelve una colección de elementos.

La recomendación es mantener sus localizadores tan compactos y legibles como sea posible. Pedirle a WebDriver que recorra la estructura del DOM es una operación costosa, y cuanto más pueda reducir el alcance de su búsqueda, mejor.

Localizadores relativos

Selenium 4 trae localizadores relativos que antes se llamaban localizadores amigables. Esta funcionalidad fue añadida para ayudarle a localizar elementos que están cerca de otros elementos.Los localizadores relativos disponibles son:

• arriba
• abajo
• a la izquierda
• a la derecha
• cerca

El método FindElement ahora acepta un nuevo método withTagName() que devuelve un RelativeLocator.

Cómo funciona

Selenium utiliza la función de JavaScriptgetBoundingClientRect()para encontrar los elementos relativos. Esta función devuelvepropiedades de un elemento como derecha, izquierda, abajo y arriba.

Consideremos el siguiente ejemplo para entender los localizadores relativos.



arriba()

Devuelve el WebElement que aparece por encima del elemento especificado

abajo()

Devuelve el WebElement que aparece por debajo del elemento especificado

toLeftOf()

Devuelve el WebElement que aparece a la izquierda del elemento especificado

toRightOf()

Devuelve el WebElement que aparece a la derecha del elemento especificado

near()

Devuelve el WebElement que está como máximo 50px lejos del elemento especificado.