selenium-webdriver => Localisation d'éléments Web

Syntaxe

ByChained (params By [] bys)

Remarques

Les objets se trouvent dans Selenium grâce à l'utilisation de localisateurs et de la classe By . Afin de réaliser un projet d'automatisation robuste avec Selenium, il convient d'utiliser intelligemment les localisateurs pour Web Elements. Les localisateurs doivent être descriptifs, uniques et peu susceptibles de changer . Par exemple, vous n'obtiendrez pas de faux positifs dans les tests. La priorité est d'utiliser:

ID - puisqu'il est unique et que vous obtenez exactement l'élément souhaité.
Nom de classe - Il est descriptif et peut être unique dans un contexte donné.
CSS ( meilleures performances que xpath ) - Pour les sélecteurs plus compliqués.
XPATH - Où CSS ne peut pas être utilisé ( axe XPATH ), par exemple div::parent .

Les autres localisateurs sont sujets à des changements ou à un rendu, et sont de préférence évités.

Règle de base: si votre code ne peut pas localiser un élément particulier, l'une des raisons pourrait être que votre code n'a pas attendu tous les éléments DOM à télécharger. Envisagez de dire à votre programme d’attendre pendant une courte période (essayez 3 à 5 secondes, puis augmentez lentement si nécessaire) avant de rechercher cet élément. Voici un exemple en Python, tiré de cette question :

from selenium import webdriver
import time

browser = webdriver.Firefox()
browser.get("https://app.website.com")

reports_element = browser.find_element_by_xpath("//button[contains(text(), 'Reports')]")

# Element not found! Try giving time for the browser to download all DOM elements:
time.sleep(10)

reports_element = browser.find_element_by_xpath("//button[contains(text(), 'Reports')]")
# This returns correct value!

Localisation des éléments de page à l'aide de WebDriver

Pour interagir avec WebElements dans une page Web, nous devons d'abord identifier l'emplacement de l'élément.

Par est le mot-clé disponible en sélénium.

Vous pouvez localiser les éléments par ..

Par identifiant
Par nom de classe
Par tagName
Par nom
Par lien texte
Par texte de lien partiel
Par sélecteur CSS
Par XPath
Utiliser JavaScript

Considérons l'exemple de script ci-dessous

<form name="loginForm">
Login Username: <input id="username" name="login" type="text" />
Password: <input id="password" name="password" type="password" />
<input name="login" type="submit" value="Login" />

Dans le code ci-dessus, le nom d'utilisateur et le mot de passe sont définis à l'aide des identifiants. Maintenant, vous allez identifier les éléments avec id.

driver.findElement(By.id(username));

driver.findElement(By.id(password));

Comme le sélénium supporte 7 langues différentes, ce document vous donne une idée pour localiser les éléments dans toutes les langues.

Par identifiant

Exemple de recherche d'un élément à l'aide de l'ID:

<div id="coolestWidgetEvah">...</div>

Java       -  WebElement element = driver.findElement(By.id("coolestWidgetEvah"));
C#         -  IWebElement element = driver.FindElement(By.Id("coolestWidgetEvah"));
Python     -  element = driver.find_element_by_id("coolestWidgetEvah")
Ruby       -  element = driver.find_element(:id, "coolestWidgetEvah")
JavaScript/Protractor -  var elm = element(by.id("coolestWidgetEvah"));

Par nom de classe

Exemple de recherche d'un élément en utilisant le nom de classe:

<div class="cheese"><span>Cheddar</span></div>

Java       -  WebElement element = driver.findElement(By.className("cheese"));
C#         -  IWebElement element = driver.FindElement(By.ClassName("cheese"));
Python     -  element = driver.find_element_by_class_name("cheese")
Ruby       -  cheeses = driver.find_elements(:class, "cheese")
JavaScript/Protractor -  var elm = element(by.className("cheese"));

Par nom de tag

Exemple de recherche d'un élément en utilisant le nom de tag:

<iframe src="..."></iframe>

Java       -  WebElement element = driver.findElement(By.tagName("iframe"));
C#         -  IWebElement element = driver.FindElement(By.TagName("iframe"));
Python     -  element = driver.find_element_by_tag_name("iframe")
Ruby       -  frame = driver.find_element(:tag_name, "iframe")
JavaScript/Protractor -  var elm = element(by.tagName("iframe"));

De nom

Exemple de recherche d'un élément en utilisant name:

<input name="cheese" type="text"/>

Java       -  WebElement element = driver.findElement(By.name("cheese"));
C#         -  IWebElement element = driver.FindElement(By.Name("cheese"));
Python     -  element = driver.find_element_by_name("cheese")
Ruby       -  cheese = driver.find_element(:name, "cheese")
JavaScript/Protractor -  var elm = element(by.name("cheese"));

Par lien texte

Exemple de recherche d'un élément à l'aide du texte du lien:

<a href="http://www.google.com/search?q=cheese">cheese</a>>

Java       -  WebElement element = driver.findElement(By.linkText("cheese"));
C#         -  IWebElement element = driver.FindElement(By.LinkText("cheese"));
Python     -  element = driver.find_element_by_link_text("cheese")
Ruby       -  cheese = driver.find_element(:link, "cheese")
JavaScript/Protractor -  var elm = element(by.linkText("cheese"));

Par texte de lien partiel

Exemple de recherche d'un élément à l'aide d'un texte de lien partiel:

<a href="http://www.google.com/search?q=cheese">search for cheese</a>>

Java       -  WebElement element = driver.findElement(By.partialLinkText("cheese"));
C#         -  IWebElement element = driver.FindElement(By.PartialLinkText("cheese"));
Python     -  element = driver.find_element_by_partial_link_text("cheese")
Ruby       -  cheese = driver.find_element(:partial_link_text, "cheese")
JavaScript/Protractor -  var elm = element(by.partialLinkText("cheese"));

Par sélecteurs CSS

Exemple de recherche d'un élément à l'aide des sélecteurs CSS:

<div id="food" class="dairy">milk</span>

Java       -  WebElement element = driver.findElement(By.cssSelector("#food.dairy")); //# is used to indicate id and . is used for classname.
C#         -  IWebElement element = driver.FindElement(By.CssSelector("#food.dairy"));
Python     -  element = driver.find_element_by_css_selector("#food.dairy")
Ruby       -  cheese = driver.find_element(:css, "#food span.dairy.aged")
JavaScript/Protractor -  var elm = element(by.css("#food.dairy"));

Voici un article sur la création de sélecteurs CSS: http://www.w3schools.com/cssref/css_selectors.asp

Par XPath

Exemple de recherche d'un élément à l'aide de XPath:

<input type="text" name="example" />

Java       -  WebElement element = driver.findElement(By.xpath("//input"));
C#         -  IWebElement element = driver.FindElement(By.XPath("//input"));
Python     -  element = driver.find_element_by_xpath("//input")
Ruby       -  inputs = driver.find_elements(:xpath, "//input")
JavaScript/Protractor -  var elm = element(by.xpath("//input"));

Voici un article sur XPath: http://www.w3schools.com/xsl/xpath_intro.asp

Utiliser JavaScript

Vous pouvez exécuter un javascript arbitraire pour trouver un élément et tant que vous retournez un élément DOM, il sera automatiquement converti en objet WebElement.

Exemple simple sur une page chargée en jQuery:

Java       -  WebElement element = (WebElement) 
((JavascriptExecutor)driver).executeScript("return $('.cheese')[0]");

C#         -  IWebElement element = (IWebElement)
((IJavaScriptExecutor)driver).ExecuteScript("return $('.cheese')[0]");

Python     -  element = driver.execute_script("return $('.cheese')[0]");
Ruby       -  element = driver.execute_script("return $('.cheese')[0]")
JavaScript/Protractor -

Remarque: cette méthode ne fonctionnera pas si votre WebDriver particulier ne prend pas en charge JavaScript, tel que SimpleBrowser .

Sélection par plusieurs critères [C #]

Il est également possible d'utiliser des sélecteurs ensemble. Cela se fait à l'aide de l'objet OpenQA.Selenium.Support.PageObjects.ByChained :

element  = driver.FindElement(new ByChained(By.TagName("input"), By.ClassName("class"));

Un nombre quelconque de By s peuvent être chaînés et sont utilisés comme sélection de type ET (tous les By s sont mis en correspondance)

Sélection d'éléments avant que la page ne se charge

Lorsque vous appelez driver.Navigate().GoToUrl(url); , l'exécution du code s'arrête jusqu'à ce que la page soit complètement chargée. Cela est parfois inutile lorsque vous souhaitez simplement extraire des données.

Remarque: Les exemples de code ci-dessous peuvent être considérés comme des hacks. Il n'y a pas de moyen "officiel" de le faire.

Créer un nouveau fil de discussion

Créez et lancez un thread pour charger une page Web, puis utilisez Wait .

C #

using (var driver = new ChromeDriver())
{
    new Thread(() =>
    {
        driver.Navigate().GoToUrl("http://stackoverflow.com");
    }).Start();

    new WebDriverWait(driver, TimeSpan.FromSeconds(10))
      .Until(ExpectedConditions.ElementIsVisible(By.XPath("//div[@class='summary']/h3/a")));
}

Utiliser les délais d'attente

En utilisant un WebDriverTimeout, vous pouvez charger une page et, après un certain temps, elle lancera une exception, ce qui arrêtera le chargement de la page. Dans le bloc catch, vous pouvez utiliser Wait .