Holen Element durch XPath mit JavaScript

Tahseen Tauseef 12 Oktober 2023
  1. Was ist ein Selenium
  2. Was ist Selenium-WebDriver
  3. Was ist XPath in Selenium
  4. Holen Sie sich Element by XPath mit JavaScript in Selenium WebDriver
Holen Element durch XPath mit JavaScript

In diesem Artikel wird erläutert, wie Elemente von XPath mithilfe von JavaScript in Selenium WebDriver abgerufen werden.

Was ist ein Selenium

Selenium ist ein automatisiertes Testframework, das zum Testen von Website-Anwendungen in mehreren Browsern wie Google Chrome, Mozilla Firefox, Safari usw. verwendet wird.

Mehrere Programmiersprachen wie JavaScript, Java, Python und C# können Testskripts in Selenium erstellen. Wenn Sie von Selenium bereitgestellte Tools verwenden, kann dies als Selentest bezeichnet werden.

Selenium ist kein einzelnes Tool, sondern besteht aus mehreren Softwareprogrammen, die für verschiedene Arten von Tests verwendet werden können, wie zum Beispiel:

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

Was ist Selenium-WebDriver

Selenium-Webdriver wird verwendet, um Tests durchzuführen, indem Testskripte auf mehreren Browsern mit verschiedenen Programmiersprachen wie JavaScript, Java, Python, C# usw. ausgeführt werden.

Selenium-Webdriver wird verwendet, um sicherzustellen, dass die Webanwendung in der Produktion korrekt funktioniert. Es kann eine Dummy-Umgebung erstellen, in der Sie die Anwendung testen können.

Der Selenium-Webtreiber besteht aus vier Hauptteilen.

  • Browser
  • Browsertreiber
  • Selenium-Client-Bibliothek
  • JSON-Wire-Protokoll

Was ist XPath in Selenium

XPath wird verwendet, um die XML- und HTML-Struktur der Webseite zu durchlaufen.

XPath kann ein Element auf der Webseite finden, wenn es keine CSS-Selektoren wie ID, Klasse usw. verwendet. XPath kann verwendet werden, um die statischen und dynamischen Elemente zu finden (deren Attribute sich aufgrund bestimmter Ereignisse ändern können).

Es gibt zwei XPath in Selenium.

  • Absoluter Pfad
  • Relativer Pfad

Absoluter Pfad

Sie würden das Element, auf das Sie abzielen möchten, in einem absoluten Pfad angeben, beginnend mit dem Root-Tag, dem HTML-Tag. Dann können Sie vorwärts gehen, indem Sie auf das untergeordnete Element zielen und beide mit einem Schrägstrich anhängen.

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

Schauen Sie sich den Quellcode oben an; Wir müssen den Pfad angeben, um die erste Eingabe anzuvisieren.

html/body/form/input[1]

Dadurch wird zuerst auf das HTML-Element, das body-Element und dann auf das form zugegriffen, bevor zum dritten Eingabeelement innerhalb des Formulars übergegangen wird.

Relativer Pfad

Ein relativer Pfad unterscheidet sich vom absoluten Pfad dadurch, dass er direkt auf ein HTML-Element zielen kann. Im obigen Quellcode würden wir also doppelte Schrägstriche schreiben (um anzuzeigen, dass es sich um einen relativen Pfad handelt) und dann von dort aus weitergehen, ähnlich wie Sie es bei einem absoluten Pfad tun würden.

///form/input[1]

Holen Sie sich Element by XPath mit JavaScript in Selenium WebDriver

Das document.evaluate kann ein XPath-Ergebnis erhalten, indem es einen XPath-Ausdruck übergibt.

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

Der obige Quellcode zielt auf jedes Zielabsatzelement ab (aufgrund des bereitgestellten XPath). Es wird den Textinhalt jedes Absatzes herausnehmen, an eine Variable anhängen und die Ergebnisse ausloggen.