Obtener elemento por XPath usando JavaScript
- ¿Qué es Selenium?
- ¿Qué es Selenium-WebDriver?
- ¿Qué es XPath en Selenium?
- Obtener elemento por XPath usando JavaScript en Selenium WebDriver
Este artículo discutirá cómo obtener elementos por XPath usando JavaScript en Selenium WebDriver.
¿Qué es Selenium?
Selenium es un marco de prueba automatizado que se utiliza para probar aplicaciones de sitios web en múltiples navegadores como Google Chrome, Mozilla Firefox, Safari, etc.
Múltiples lenguajes de programación como JavaScript, Java, Python y C# pueden crear scripts de prueba en Selenium. Si está utilizando herramientas proporcionadas por Selenium, puede denominarse prueba de Selenium.
Selenium no es una herramienta única, sino que consta de múltiples software que se pueden usar para diferentes tipos de pruebas, como:
- Selenium Grid
- Selenium WebDriver
- Selenium Remote Control (RC)
- Selenium Integrated Development Environment (IDE)
¿Qué es Selenium-WebDriver?
Selenium-Webdriver se usa para realizar pruebas mediante la ejecución de scripts de prueba en múltiples navegadores usando varios lenguajes de programación como JavaScript, Java, Python, C#, etc.
Selenium-Webdriver se utiliza para garantizar que la aplicación web funcione correctamente en producción. Puede crear un entorno ficticio para que pruebe la aplicación.
El controlador web de selenio tiene cuatro partes principales.
- Navegador
- Controladores de navegador
- Biblioteca de cliente de selenio
- Protocolo de conexión JSON
¿Qué es XPath en Selenium?
XPath se utiliza para atravesar la estructura XML y HTML de la página web.
XPath puede encontrar un elemento en la página web si no está usando selectores CSS como id, clase, etc. XPath puede usarse para encontrar elementos estáticos y dinámicos (cuyos atributos pueden cambiar debido a ciertos eventos).
Hay dos XPath en Selenium.
- Ruta absoluta
- Ruta Relativa
Ruta absoluta
Debe especificar el elemento al que desea apuntar en una ruta absoluta, comenzando con la etiqueta raíz, la etiqueta HTML. Luego, puede avanzar apuntando al elemento secundario y agregándolos a ambos con una barra inclinada.
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Absoulte Path</title>
</head>
<body>
<form id="login-form">
<input name="name" type="text" />
<input name="email" type="text" />
<input name="password" type="password" />
<button>Login</button>
</form>
</body>
</html>
Eche un vistazo al código fuente anterior; necesitamos dar la ruta para apuntar a la primera entrada.
html/body/form/input[1]
Esto accederá primero al elemento HTML, al elemento body y luego al form antes de pasar al tercer elemento de entrada dentro del formulario.
Camino relativo
Una ruta relativa se diferencia de la ruta absoluta en que puede apuntar directamente a un elemento HTML. Entonces, en el código fuente anterior, escribiríamos barras diagonales dobles (que indican que es una ruta relativa) y luego seguiríamos desde allí, de manera similar a como lo haría en una ruta absoluta.
///form/input[1]
Obtener elemento por XPath usando JavaScript en Selenium WebDriver
El document.evaluate puede obtener un resultado XPath pasándole una expresión XPath.
let HeadingElements = document.evaluate(
'/html/body//p', document, null, XPathResult.ANY_TYPE, null);
let NextHeading = HeadingElements.iterateNext();
let HeadingTexts = '';
while (NextHeading) {
HeadingTexts += NextHeading.textContent + '\n';
NextHeading = NextHeading.iterateNext();
}
console.log(HeadingTexts);
El código fuente anterior apuntará a cada elemento de párrafo de destino (debido al XPath proporcionado). Extraerá el contenido de texto de cada párrafo, lo agregará a una variable y cerrará la sesión de los resultados.