Obtenir un élément par XPath en utilisant JavaScript

Tahseen Tauseef 12 octobre 2023
  1. Qu’est-ce qu’un sélénium
  2. Qu’est-ce que Selenium-WebDriver
  3. Qu’est-ce que XPath dans Selenium
  4. Obtenir Element par XPath en utilisant JavaScript dans Selenium WebDriver
Obtenir un élément par XPath en utilisant JavaScript

Cet article explique comment obtenir des éléments par XPath en utilisant JavaScript dans Selenium WebDriver.

Qu’est-ce qu’un sélénium

Selenium est un framework de test automatisé utilisé pour tester les applications de site Web dans plusieurs navigateurs tels que Google Chrome, Mozilla Firefox, Safari, etc.

Plusieurs langages de programmation tels que JavaScript, Java, Python et C# peuvent créer des scripts de test dans Selenium. Si vous utilisez des outils fournis par Selenium, cela peut être appelé test de sélénium.

Selenium n’est pas un outil unique mais se compose de plusieurs logiciels qui peuvent être utilisés pour différents types de tests, tels que :

  • Selenium Grid
  • Selenium WebDriver
  • Selenium Remote Control (RC)
  • Selenium Integrated Development Environment (IDE)

Qu’est-ce que Selenium-WebDriver

Selenium-Webdriver est utilisé pour effectuer des tests en exécutant des scripts de test sur plusieurs navigateurs à l’aide de divers langages de programmation tels que JavaScript, Java, Python, C#, etc.

Selenium-Webdriver est utilisé pour s’assurer que l’application Web fonctionne correctement en production. Il peut créer un environnement factice pour tester l’application.

Le pilote Web Selenium comporte quatre parties principales.

  • Navigateur
  • Pilotes de navigateur
  • Bibliothèque client Selenium
  • Protocole filaire JSON

Qu’est-ce que XPath dans Selenium

XPath est utilisé pour parcourir la structure XML et HTML de la page Web.

XPath peut trouver un élément sur la page Web s’il n’utilise pas de sélecteurs CSS tels que id, class, etc. XPath peut être utilisé pour trouver les éléments statiques et dynamiques (dont les attributs peuvent changer en raison de certains événements).

Il y a deux XPath dans Selenium.

  • Chemin absolu
  • Chemin relatif

Chemin absolu

Vous spécifieriez l’élément que vous souhaitez cibler dans un chemin absolu, en commençant par la balise racine, la balise HTML. Ensuite, vous pouvez avancer en ciblant l’élément enfant et en les ajoutant tous les deux à l’aide d’une barre oblique.

<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>

Jetez un oeil au code source ci-dessus; il faut donner le chemin pour cibler la première entrée.

html/body/form/input[1]

Cela accédera d’abord à l’élément HTML, à l’élément body, puis au form avant de passer au troisième élément d’entrée à l’intérieur du formulaire.

Chemin relatif

Un chemin relatif diffère du chemin absolu en ce sens qu’il peut cibler directement un élément HTML. Ainsi, dans le code source ci-dessus, nous écrirons des doubles barres obliques (indiquant qu’il s’agit d’un chemin relatif), puis traverserons à partir de là, comme vous le feriez dans un chemin absolu.

///form/input[1]

Obtenir Element par XPath en utilisant JavaScript dans Selenium WebDriver

Le document.evaluate peut obtenir un résultat XPath en lui passant une expression 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);

Le code source ci-dessus ciblera chaque élément de paragraphe cible (en raison du XPath fourni). Il supprimera le contenu textuel de chaque paragraphe, l’ajoutera à une variable et déconnectera les résultats.