Analyse HTML avec xpath ou cssSelector?

Question

Comment analyser uniquement les portions de texte de ces blocs de code? J'utilise des pilotes clients Selenium en Java.

<li id="NOT_PUT_PREF_STORE" style=""> 
<span id="STORE_AVAIL" class="BodyLBoldGrey StockStat">Out of stock</span> <span id="InYourLocal">in your local</span> <span id="storeRollover_2"><span id="STORE_CITY" class="BodyLBoldLtgry VIBSStore1">West Hills</span></span> store<span id="notSelectOptionSOI">.</span> 
</li> 

ou

<li id="NOT_PUT_PREF_STORE" style=""> 
<span id="STORE_AVAIL" class="BodyLLtgry StockStat">Not carried</span> <span class="BodyLLtgry" id="InYourLocal">in your local</span> <span id="storeRollover_2"><span id="STORE_CITY" class="BodyLBoldLtgry VIBSStore1">West Hills</span></span> store<span id="notSelectOptionSOI">.</span> 
</li> 

ou

<li id="NOT_PUT_PREF_STORE" style=""> 
<span id="STORE_AVAIL" class="BodyMBold StockStatGreen">In stock</span> <span id="InYourLocal">in your local</span> <span id="storeRollover_2"><span id="STORE_CITY" class="BodyLBoldLtgry VIBSStore1">West Hills</span></span> store<span id="notSelectOptionSOI">.</span> 
</li> 

Je suis en train d'analyser pour la partie de texte dans chacune de ces variations dans le WebElement (ie: Non portée, En stock, Out de stock). Je suis un nouvel utilisateur de l'analyse du sélénium et du html, donc c'est vraiment difficile pour moi de devenir fonctionnel.

je pensais que ce serait quelque chose comme

WebElement driver = new FirefoxDriver(profile); 
driver.get(Url); 
System.out.println(driver.getElement(By.id("STORE_AVAIL").getText()); 

Je ne sais pas comment je le ferais avec cssSelector mais les gens me disent qui est plus rapide. Est-ce que cela fonctionnerait?

driver.getElement(By.xpath("//li[@id='NOT_PUT_PREF_STORE']./span[@id='STORE_AVAIL']").getText() 

Answer 1

Lorsque je tente de trouver des éléments sur la page que je construis toujours mes localisateurs par:

1. id = driver.getElement(By.id("STORE_AVAIL").getText());
2. sélecteur css = driver.getElement(By.css("span#STORE_AVAIL").getText());
3. XPath = driver.getElement(By.xpath("//span[@id='STORE_AVAIL']").getText());

L'id semble être le plus rapide et le plus facile, à la fois pour webdriver et pour moi. id devrait être unique sur la page.

CSS prend un peu plus de travail d'investigation de ma part, mais webdriver le gère très bien. Enfin, xpath est parfois inévitable (à moins que vous n'achetiez les devs une bière et que vous demandiez à changer d'application pour que vous puissiez les localiser plus rapidement - après tout, vous les testez quand même). La localisation par xpath avec IE est terriblement lente et l'écriture de xpaths complexes est un glissement.

Xpath est également fragile, un petit changement à la dom peut rendre votre xpath inutilisable. Ensuite, vous pouvez déboguer/réécrire votre xpath (c'est aussi amusant que ça en a l'air).

Ma suggestion est d'utiliser les addons Firebug et FirePath pour Firefox pour vous aider à créer vos localisateurs.

Answer 2

Lorsque vous affichez «Source de la page», seule la source HTML d'origine s'affiche. Il va pas afficher les modifications apportées par les appels AJAX, ce qui ressemble à la mise à jour de la section/élément par la page Walmart. Cette question fournit une meilleure explication.

En supposant que vous utilisez Firefox (en fonction du pilote que vous utilisez), vous pouvez accéder à la page et cliquer sur Ctrl + Maj + I pour faire apparaître l'outil Inspecteur. Sélectionnez l'élément qui vous intéresse. Cliquez ensuite sur le bouton [HTML] (dans le menu Inspecteur) pour afficher la source actuelle.

Notez que lorsque vous obtenez l'élément à l'aide de Webdriver Selenium, il obtiendra la valeur actuelle plutôt que la valeur d'origine vue dans la source de la page. Vous n'avez donc pas à vous soucier de ce que vous voyez dans la source de la page.

Answer 3

J'ai essayé avec le code html suivant snipet

<li id="NOT_PUT_PREF_STORE" style=""> 
 
<span id="STORE_AVAIL" class="BodyLBoldGrey StockStat">Out of stock</span> <span id="InYourLocal">in your local</span> <span id="storeRollover_2"><span id="STORE_CITY" class="BodyLBoldLtgry VIBSStore1">West Hills</span></span> store<span id="notSelectOptionSOI">.</span> 
 
</li>

J'utilise le code suivant pour le résoudre. J'obtiens les éléments de l'arbre des span en utilisant XPath et j'analyse chacun de ces éléments pour obtenir le texte des éléments.

driver.navigate().to("file:///C:/Users/abc/Desktop/test.html"); 
    List<WebElement> spanEle = driver.findElements(By.xpath("//li/span")); 
    for (int i = 0; i < spanEle.size(); i++) { 
      System.out.println(spanEle.get(i).getText());