Menú

Tutorial de hoja de trucos de escritura XPath Ultimate con sintaxis y ejemplos

ultimate xpath writing cheat sheet tutorial with syntax

cómo declarar una lista en java

Pruebe Nuestro Instrumento Para Eliminar Los Problemas

Las 20 formas principales de escribir Ultimate XPATH para CUALQUIER tipo de elemento web (XPATH nunca será inválido):

Una aplicación web se compone de diferentes tipos de elementos web, como un elemento web para hacer clic en un botón, un elemento web de entrada para escribir texto, un menú desplegable, botones de opción, etc.

Estos elementos web también se denominan etiquetas o nodos.

Cuando se trata de automatizar aplicaciones web, comienza con escribir un script de automatización que encontrará el elemento web, realizará una acción en él, como hacer clic en un botón, ingresar texto en el cuadro de entrada, seleccionar una casilla de verificación, seleccionar un botón de radio, desplácese hacia arriba o hacia abajo y finalmente verifique el comportamiento esperado en el turno de la acción.

20 MANERAS DE ESCRIBIR XPATH PARA CUALQUIER TIPO DE ELEMENTO WEB

Lo que vas a aprender:

¿Qué es XPath y cómo se ve?

Encontrar un elemento es como encontrar la casa de alguien en el mapa. La única forma en que podemos encontrar la casa de un amigo sin ayuda externa es que deberíamos tener un mapa y saber qué encontrar (casa).

Para poner esta analogía en nuestro caso, el mapa se utilizará como DOM (etiquetas HTML, JavaScript, etc.) donde existen todos los elementos web, junto con el elemento web específico que queremos encontrar.

Una vez que se encuentra la dirección o ruta única de un elemento, el script de automatización realizará algunas acciones en él según el escenario de prueba. Por ejemplo, desea verificar la URL de la página que se abre después de hacer clic en un botón.

Sin embargo, no es sencillo encontrar una dirección / ruta única de un elemento web, ya que puede haber etiquetas similares, los mismos valores de atributos, rutas idénticas que dificultan la creación de una dirección única exacta para un elemento web llamado 'XPATH'.

Aquí, profundizaremos en algunas técnicas excelentes y efectivas para generar XPATH válido y único para cualquier tipo de elemento web.

Lectura recomendada => Identificar elementos web mediante XPath en Selenium

A veces puede crear fácilmente XPaths usando extensiones de navegador, pero en mi pruebas de automatización profesional, me he enfrentado a innumerables situaciones en las que las extensiones de navegador tradicionales no funcionan y debes crear tus propios XPath personalizados utilizando tu propia creatividad. Estoy seguro de que tienes o te enfrentarás a situaciones similares.

En este tutorial, echaremos un vistazo a las 20 mejores formas de crear XPath definitivo para un elemento web de tal manera que incluso cuando se cambie su código, su XPath seguirá siendo válido todo el tiempo (a menos que el desarrollador reescriba todo el característica / módulo).

Al conocer todas estas técnicas, se convertirá en un maestro en la escritura de su propio XPath y podrá escribir XPaths asesinos con muy pocas posibilidades de volverse inválido.

Primero, comencemos por comprender la sintaxis XPath y definir cada una de sus partes.

La siguiente imagen mostrará cómo se verá XPath junto con una descripción de cada parte:

Sintaxis XPATH

  • // : Seleccione el nodo actual como entrada, div, etc.
  • Nombre de etiqueta: Nombre de etiqueta del elemento web / nodo
  • @: Seleccionar atributo
  • Atributo: Nombre de atributo del nodo / elemento web particular
  • Valor: Valor del atributo

Solo quiero compartir un par de consejos aquí que el 80% de las veces mi script de prueba de automatización falló debido a XPath. Esto se debe a que hay varios elementos web para el XPath proporcionado o XPath no es válido o la página aún no se ha cargado.

Entonces, siempre que su caso de prueba falle:

  1. Copie su XPath.
  2. Búscalo en el navegador (F12 o ventana de la herramienta del desarrollador) en el DOM para verificar si es válido o no (ver la imagen de abajo).

Ventana F12

Pro Tipo 1: Asegúrese de que sea único y que no aparezca ningún otro elemento web cuando busque dos veces en el DOM.

Pro Tipo 2: A veces hay un problema de tiempo, lo que significa que su elemento web / página aún no se ha cargado mientras el script lo estaba buscando, por lo tanto, agregue un tiempo de espera y vuelva a probar.

Pro Tipo 3: Intente imprimir el DOM completo antes de buscar el elemento web. De esta manera, puede saber si busca en Console si su elemento web existe en el DOM o no.

Antes de profundizar en la búsqueda de XPath, una cosa importante que quiero compartir es que si tiene acceso directo al equipo de desarrollo o si su equipo está ubicado donde usted está, pida a su equipo de desarrollo que le proporcione ID únicos en cada elemento web o al menos los que desee utilizar para la Automatización y esto le ahorrará mucho tiempo.

Si esta no es la posibilidad, entonces es posible que deba usar su creatividad y crear sus propios XPaths personalizados y eso es lo que vamos a aprender ahora.

Las 20 mejores formas de escribir XPath para cualquier elemento web

Profundicemos en la creación de las 20 mejores formas de lograr un XPath increíble.

# 1) Búsqueda inversa

Supongamos que desea hacer clic en un botón y hay un botón similar. Ambos botones tienen atributos de identificación, pero son dinámicos y ninguno de los atributos es único en ambos elementos del botón.

En el siguiente escenario, queremos hacer clic en el botón 'Configuración' de la 'Prueba interactiva'.

Revers mirar hacia arriba

Código

Revers Buscar código

Si observa los botones de 'Configuración', ambos códigos son similares. Al usar formas tradicionales como id, nombre, valor, contiene, etc., ninguna de ellas funcionará, por ejemplo.

// * (contiene (texto (), 'Configuración')), Esto dará como resultado dos elementos web. Por tanto, no es único.

Así que aquí está la estrategia final,

>> Primero, busque la etiqueta más cercana que sea única y, en este caso, es

|_+_|

>> En segundo lugar, busque el elemento web más cercano al elemento web deseado que en este caso contiene (text (), 'TEST Interactive'). Ahora estamos en el mismo lugar donde existe el botón 'Configuración', pero para hacer clic en él, primero debemos ir a la página principal usando puntos dobles como se muestra a continuación.

|_+_|

Encuentra el elemento web más cercano

>> Como puede ver, estamos en el nivel que tiene el segundo elemento web como botón 'Configuración'. Esto tiene dos botones y queremos ir al segundo botón, que es el botón 'Configuración'. Al agregar '/ botón (2)' al final, podemos obtener nuestro XPATH único para el botón 'Configuración' como se muestra a continuación.

agregando

XPATH final:

|_+_|

Aquí hay otra forma de generar si cree que podrían cambiar el tipo de elemento web de 'botón' a otra cosa.

|_+_|

o usando 'siguiente hermano'

|_+_|

# 2) Uso de variables y valores personalizados

Supongamos que hay una aplicación web que tiene la función FTP ('Protocolo de transferencia de archivos') para cargar / descargar archivos y tiene un caso de prueba para descargar un archivo específico haciendo clic en el enlace de descarga.

Primero, podemos definir el nombre del archivo que estamos buscando como variable.

String WaitfileName = 'Prueba1';

convertidor de youtube a wav gratis en línea

Ahora, usando XPATH, podemos encontrar el nombre del archivo real.

|_+_|

En el XPath anterior, ... '/ tr / td (1) .getAttribute (' título ')' irá a la fila específica y la primera columna y obtendrá el valor del atributo del título. Podemos almacenar el nombre del archivo real en otra variable.

Una vez que tengamos los nombres de archivo esperados y reales, podemos comparar ambos y si ambos coinciden, simplemente podemos hacer clic en su enlace de descarga.

|_+_|

También podemos crear un bucle a través de cada fila y seguir verificando el nombre del archivo hasta que lo encuentre.

|_+_|

# 3) Uso de etiquetas 'XML', 'Y', etc.

Podemos generar XPATH único usando etiquetas personalizadas y agregar otras condiciones.

Por ejemplo, digamos que nuestro elemento web previsto existe en la etiqueta principal y hay varias etiquetas de dirección, pero solo desea encontrar una específica. Todas las etiquetas de dirección tienen un atributo de clase, por lo que podemos comenzar con.

|_+_|

Notamos que nuestro elemento web previsto está en una etiqueta que tiene un texto llamado 'Prueba'.

|_+_|

Descubrimos que hay varios elementos web encontrados como resultado. Por lo tanto, para hacerlo más único, podemos agregar las otras condiciones como 'id' que finalmente nos dirigirá al elemento web que estamos buscando.

|_+_|

# 4) Uso de atributos y tabla XPATH

Supongamos que queremos escribir en un elemento web que se coloca dentro de una tabla y la tabla se coloca dentro de un elemento de formulario.

Podemos encontrar todos los formularios dentro de DOM con el nombre 'myForm'.

|_+_|

Ahora, en todas las formas, busque la tabla con id 'tbl_testdm'.

|_+_|

Dentro de la tabla, vaya a una fila y columna específicas.

|_+_|

Dentro de la celda, si hay varias entradas, busque una entrada donde value = 'Open RFS', y esto nos dará el XPath final del campo.

|_+_|

# 5) Uso de atributos, tablas y texto

Suponga que su elemento web deseado se encuentra en la tabla del panel y tiene algún texto en común.

Primero, comience con un panel que tenga un atributo único que en este caso es 'TÍTULO'.

|_+_|

Ahora navegue por todas las etiquetas de la tabla.

|_+_|

Dentro de todas las tablas, busque la columna que tiene el texto 'Autor'.

XPath final sería como:

|_+_|

# 6) Generación de XPATH usando atributos anidados

El XPath del elemento web de destino también se puede generar utilizando los atributos anidados. Por ejemplo, en este caso, buscará un atributo específico en DOM y luego buscará otro atributo dentro de él.

|_+_|

# 7) Generación XPath combinando atributos, Divs y Button

Por ejemplo, en el XPath a continuación, pude encontrar el elemento web de destino usando una identificación (XPath relativa), algunas etiquetas div y un botón.

|_+_|

# 8) Generación de XPATH usando CONTAINS, REVERSE BÚSQUEDA, etc.

Una vez tuve un menú desplegable sin identificación directa. Tuve que usar CONTAINS, REVERSE, DIVs, atributos para llegar al XPATH final como se muestra a continuación.

|_+_|

# 9) Generación XPath usando Relative, CONTAINS, REVERSE, SIGUIENTE HERMANO, etc.

Tuve una situación en la que la aplicación muestra un gráfico y cada valor de gráfico tenía que ser validado. Pero, desafortunadamente, cada valor no tenía una identificación única, por lo que se me ocurrió el XPATH final como se muestra a continuación para un valor de gráfico que combina etiquetas relativas, contiene, reversa, siguiente-hermano y div.

|_+_|

# 10) Generación XPath usando Atributos, Contiene, Reverse, Preceding-Sibling, Divs y Span

Una vez tuve que validar diferentes datos de alarma y cada valor de alarma se mostró en función de un cálculo o tiempos específicos. Para capturar cada valor, tuve que crear el XPATH a continuación que usa atributos, contiene, inverso, hermano anterior, divs y etiquetas de intervalo.

|_+_|

# 11) Uso de atributos, etiquetas XML, etc.

En el XPATH, los atributos y las etiquetas XML que se muestran a continuación, se utiliza una secuencia para obtener la dirección única final de un elemento web.

|_+_|

# 12) Generación XPath al no buscar en toda la página, sino en todos los enlaces y contiene

El siguiente XPath buscaría solo enlaces en una página completa que contenga el texto como 'Entrada manual de datos de parámetros'.

|_+_|

# 13) Uso de contenidos y atributos

|_+_|

# 14) Usando atributos, siguiendo a hermanos y descendientes

|_+_|

# 15) Uso de atributos, seguimiento de hermanos, descendiente y texto

|_+_|

# 16) Uso de encabezado y texto

Si el elemento web es un encabezado con algún texto específico, entonces el XPath podría ser como se muestra a continuación:

|_+_|

# 17) Uso de texto de encabezado, seguimiento de hermanos, ruta, etc.

|_+_|

# 18) Uso de atributos, contiene y hermanos anteriores

Una vez que tuve un intervalo que no tenía ningún atributo único, creé XPATH combinando absoluto, Contiene, hermanos anteriores y otra ruta absoluta.

|_+_|

# 19) Buscando el menú desplegable usando el atributo de identificación, un texto específico y búsqueda inversa

|_+_|

# 20) Combinando el atributo 'id' y buscando un enlace con texto específico

|_+_|

Conclusión

Cuando se trata de escribir un XPATH asesino, realmente depende de lo bien que comprenda y analice el código. Cuanto más comprenda el código, mayor será la cantidad de formas que encontrará al escribir XPATH efectivos.

El primer paso para escribir XPath es encontrar el elemento web único más cercano a su elemento web de destino y seguir acercándose utilizando las diferentes técnicas mencionadas anteriormente, como atributos, DIV, seguimiento, contenido, etc.

Al final, diríamos esto nuevamente que realmente le facilitará la vida si solicita a su equipo de desarrollo que agregue identificadores únicos en todos los elementos web que le interesan.

Cada vez que comienza un ciclo de sprint o trabajo en un nuevo requisito y el equipo se comparte con nuevas maquetas, siempre reviso todas las maquetas y pienso en posibles casos de prueba de automatización en mi mente, preparo una lista de todos los elementos web potenciales que se utilizarán en pruebas de automatización y preparo mis propios identificadores.

Una vez que se complete una lista de todos los elementos web junto con mis ID sugeridos, la compartiría con el desarrollador de antemano para usarla en el código de desarrollo. De esta manera, siempre obtendría identificaciones únicas al facilitar mi batalla de escritura XPATH.

A continuación se muestra una lista combinada de diferentes formas de escribir XPATH:

  1. '// * (@ id =’ rcTEST ’) // * (contiene (texto (),‘ TEST Interactive ’)) /../ button (2)”
  2. '// * (@ id =’ rcTEST ’) // * (contiene (texto (), 'PRUEBA interactivo')) /..//* (contiene (texto (), 'Configuración'))'
  3. '// * (@ id =’ rcTEST ’) // * (contiene (texto (),‘ TEST Interactive ’)) / siguiente-hermano :: botón'
  4. 'String actualFileName = WebDriverAccess.getDriver (). FindElement (By.xpath (' // * '+ fileName +' / tr / td (1) ')). GetAttribute (' título ');'
  5. WebDriverAccess.getDriver (). FindElement (By.xpath (“// *” + fileName + ”/ tr / td (4)”)). Click ();
  6. '// dirección (@ class = 'ng-scope ng-isolate-scope') // div (contiene (., Testing ') y @ id =' msgTitle ')'
  7. “// * (@ name =’ myForm ’) // tabla (@ id =’ tbl_ testdm ’) / tbody / tr / td (6) /
  8. input (@ value = ’Open RFS’) '
  9. “// * (@ title =’ Subprograma de lista de canciones ’) // tabla // td (contiene (texto (),’ Autor ’))”
  10. “// * (@ id =’ parámetros ’) // * (@ id =’ testUpdateTime ’)”) ”
  11. “// * (@ id = 'MODELO / PLAN') / div (1) / div (2) / div (1) / div (1) / widget / section / div (1) / div / div (1) / div / div / button (1) ”
  12. '// * (contiene (texto (),’ Watch Dial)) /../ div / select (@ data-ng-model = ’context.questions (subqts.subHandleSubId)’) '),'
  13. “// * (@ id = 'INVESTIGACIÓN / PLAN') // * (contiene (@id, 'A4')) /../../ siguiente-hermano :: div (1) / div (1) / intervalo (1) / intervalo (1) '
  14. “// * (@ id = 'ALARMDATA') // * (contiene (@id, 'AFC2')) /../../ previous-sibling :: div (1) / div (1) / span ( 1) / intervalo (1) ”
  15. “// * (@ id = 'INVESTIGACIÓN / REVISIÓN') // widget / sección / div (1) / div / div (2) / div (1) / div (3) / div (1) // intervalo ( @ class = 'detalles') ”
  16. '//A(contains(.,’Parameter Data Manual Entry’)) '
  17. “// * (contiene (@ style,’ display: block; top: ’)) // input (@ name =’ daterangepicker_end ’)”
  18. '// * (@ id =’ dropdown-filter-serviceTools ’) / following-sibling :: ul / descenddant :: a (text () =’ Notepad ’)”
  19. '// * (@ id =’ dropdown-filter-serviceTools ’) / following-sibling :: ul / descenddant :: a (text () =’ Trigger Dashboard ’)”
  20. '// h3 (text () =’ Informe interno ’)'
  21. '// h3 (contiene (texto (), 'Nivel de helio')) / siguiente-hermano :: div / etiqueta / entrada'
  22. '// div (div (p (contiene (texto (), 'Estado')))) / hermano-anterior :: div / div / span (3) / span'
  23. “// * (@ id =’ ACOPLAMIENTO ’) // * (contiene (texto (),’ Tendencia PAREJA ’)) /../ div / select”
  24. '// * (@ id =’ ffaHeaderDropdown ’) // a (contiene (texto (),’ Iniciar flujo de trabajo ’))”

Espero que este artículo informativo haya enriquecido sus conocimientos sobre la escritura de XPath.

estructura de datos de pila c ++

Biografía del autor: Este artículo fue escrito por Adnan Arif, un profesional de TI con experiencia y habilidades diversas en su carrera que abarca más de 9 años.

Lectura recomendada

^