Sélectionnez l'élément parent de l'élément connu dans Selenium

J'ai un certain élément que je peux sélectionner avec Selenium 1.

Malheureusement, je dois cliquer sur l'élément parent pour obtenir le comportement souhaité. L'élément que je peux facilement localiser a un attribut non sélectionnable, ce qui le rend mort pour un clic. Comment naviguer vers le haut avec XPath ?

Il y a quelques options ici. L'exemple de code est en Java, mais un portage vers d'autres langues doit être simple.

JavaScript:

WebElement myElement = driver.findElement(By.id("myDiv"));
WebElement parent = (WebElement) ((JavascriptExecutor) driver).executeScript(
                                   "return arguments[0].parentNode;", myElement);

XPath:

WebElement myElement = driver.findElement(By.id("myDiv"));
WebElement parent = myElement.findElement(By.xpath("./.."));

Obtention du pilote du WebElement

Remarque: comme vous pouvez le voir, pour la version JavaScript, vous aurez besoin du driver. Si vous n'y avez pas d'accès direct, vous pouvez le récupérer à l' WebElementaide de:

WebDriver driver = ((WrapsDriver) myElement).getWrappedDriver();

Un peu plus sur XPath axes

Disons que nous avons la HTMLstructure ci-dessous :

<div class="third_level_ancestor">
    <nav class="second_level_ancestor">
        <div class="parent">
            <span>Child</span>
        </div>
    </nav>
</div>

1. //span/parent::*- renvoie tout élément qui est un parent direct.

Dans ce cas, la sortie est <div class="parent">

2. //span/parent::div[@class="parent"]- renvoie l'élément parent uniquement du type de nœud exact et uniquement si le prédicat spécifié est True.

Production: <div class="parent">

3. //span/ancestor::*- renvoie tous les ancêtres (y compris le parent).

Sortie: <div class="parent">, <nav class="second_level_ancestor">, <div class="third_level_ancestor">...

4. //span/ancestor-or-self::*- renvoie tous les ancêtres et l'élément courant lui-même.

Sortie: <span>Child</span>, <div class="parent">, <nav class="second_level_ancestor">, <div class="third_level_ancestor">...

5. //span/ancestor::div[2]- renvoie le deuxième ancêtre (à partir du parent) de type div.

Production: <div class="third_level_ancestor">

Considérons votre DOM comme

<a>
    <!-- some other icons and texts -->
    <span>Close</span>
</a>

Maintenant que vous devez sélectionner la balise parent «a» en fonction du <span>texte, utilisez

driver.findElement(By.xpath("//a[.//span[text()='Close']]"));

Explication: Sélectionnez le nœud en fonction de la valeur de son nœud enfant

Jetez un œil aux axes XPath possibles que vous recherchez probablement parent. En fonction de la manière dont vous trouvez le premier élément, vous pouvez simplement ajuster le xpath pour cela.

Vous pouvez également essayer la syntaxe à double point , ..qui sélectionne le parent du nœud actuel.

Cela peut être utile pour quelqu'un d'autre: Utilisation de cet exemple de code HTML

<div class="ParentDiv">
    <label for="label">labelName</label>
    <input type="button" value="elementToSelect">
</div>
<div class="DontSelect">
    <label for="animal">pig</label>
    <input type="button" value="elementToSelect">
</div>

Si par exemple, je veux sélectionner un élément dans la même section (par exemple div) comme étiquette, vous pouvez utiliser ceci

//label[contains(., 'labelName')]/parent::*//input[@value='elementToSelect'] 

Cela signifie simplement, recherchez une étiquette (il pourrait quelque chose comme a, h2) a appelé labelName. Accédez au parent de cette étiquette (c'est-à-dire div class="ParentDiv"). Recherchez dans les descendants de ce parent pour trouver tout élément enfant avec la valeurelementToSelect . Avec cela, il ne sélectionnera pas le second elementToSelectavec DontSelectdiv comme parent.

L'astuce est que vous pouvez réduire les zones de recherche pour un élément en accédant d'abord au parent, puis en recherchant le descendant de ce parent pour l'élément dont vous avez besoin. D'autres syntaxes following-sibling::h2peuvent également être utilisées dans certains cas. Cela signifie l'élément suivant frère h2. Cela fonctionnera pour les éléments au même niveau, ayant le même parent.

Vous pouvez le faire en utilisant / parent :: node () dans xpath. Ajoutez simplement / parent :: node () aux éléments enfants xpath.

Par exemple: Soit xpath de l'élément enfant soit childElementXpath .

Alors xpath de son ancêtre immédiat serait childElementXpath / parent :: node () .

Xpath de son prochain ancêtre serait childElementXpath / parent :: node () / parent :: node ()

etc..

Vous pouvez également accéder à un ancêtre d'un élément à l'aide de 'childElementXpath/ancestor::*[@attr="attr_value"]'. Cela serait utile lorsque vous avez un élément enfant connu qui est unique mais qui a un élément parent qui ne peut pas être identifié de manière unique.

Nous pouvons sélectionner la balise parent à l'aide de Selenium comme suit:

driver.findElement(By.xpath("//table[@id='abc']//div/nobr[.='abc']/../.."));

cela vous aidera à trouver le grand-parent de l'élément connu. Retirez simplement un (/ ..) pour trouver l'élément parent immédiat.

Comme:

driver.findElement(By.xpath("//table[@id='abc']//div/nobr[.='abc']/..));

Il existe d'autres moyens de l'implémenter, mais cela a bien fonctionné pour moi.