Xpath et CssSelectors pour même balise, les attributs et les éléments

Je suis en train de créer des tests Selenium pour un bouton qui a le même code pour 4 boutons (le code HTML suivant répète 4 fois):Xpath et CssSelectors pour même balise, les attributs et les éléments

<div class="item"> 
<div class="head"> 
    <a class="title caps_style primary-color-text"href="https://www.www.www/link/link-link-complex-api-testing" target="_blank">Rake Athlete Complex API TESTING</a> 
</div> 
<div class="middle"> 
    <div class="photo_square"> 
     <a class="" href="https://www.www.www/link/link-link-complex-api-testing" target="_blank"><img src="/assets/2.png"></a> 
    </div> 
    <span class="stats"> 
     <span class="title caps_style votes">salvations</span> 
     <span class="amt caps_style primary-color-text"> 
     <i class="heart"></i><!-- react-text: 58 -->240 
     <!-- /react-text --> 
     </span> 
    </span> 
    <div class="stats"> 
     <span class="title caps_style">Pickles Grazed</span> 
     <span class="amt caps_style primary-color-text"> 
     <span class="fastack"><i class="fastack2x"></i> 
     <i class="fainverse"></i></span> 
     <i class="usb"></i><!-- react-text: 66 -->184 k<!-- /react-text --> 
     </span> 
    </div> 
</div> 
<div class="bottom"> 
    <span class="snippit">latin fillin text</span> 
</div> 
<div class="inline-b"> 
    <div> 
     <button class="vote-btn primary-color-background"> 
     <img src="//www.www.www/assets/pic.png"> 
     <span class="primary-color-background">Give</span> 
     </button> 
    </div> 
</div>

Voici la C# code Je tente de courir pour le premier bouton (cssSelector et XPath):

driver.FindElement(By.CssSelector("button.vote-btn.primary-color-background")).Click();

et:

driver.FindElement(By.XPath("//*[@id='Sections-react-component-0']/div/div[3]/div/div[1]/div[1]/div[4]/div/button").Click();

Je reçois le message d'erreur suivant lorsque je test Selenium:

Message: System.InvalidOperationException : unknown error: Element <button class="vote-btn primary-color-background">...</button> is not clickable at point (286, 1233). 
Other element would receive the click: <p>...</p> 
     (Session info: chrome=61.0.3163.100) 
     (Driver info: chromedriver=2.32.498550

Serait-il possible de sélectionner une option spécifique à l'aide cssSelector? par exemple en utilisant [2] ou [4] quelque part dans le code?

Source

2017-09-28 Lgalan90

1. pour le sélecteur css, il a une caractéristique similaire à celle de xpath [index]. mais plus strict que xpath. Dans le sélecteur css, vous pouvez utiliser: nth-child (index) index> = 1 ou nième-de-type (index) index> = 1. mais nth-child() requiert qu'ils aient le même noeud parent, mais pas xpath. – yong

de votre code, le sélecteur css est bon. mais vous avez rencontré l'erreur: 'élément non cliquable, l'autre élément recevrait le clic'. cette erreur signifie qu'il y a des choses qui couvrent le bouton que vous voulez cliquer, le bouton sur le calque inférieur, donc l'élément sur le calque supérieur recevra le clic. vous pouvez vérifier qu'il y a un peu plus sur le bouton pendant la course. Si ce n'est pas le cas, vous devez compléter le chargement de la page, car lorsque la page est en cours de chargement, la position du bouton change peut-être, vous cliquerez donc sur un ancien point qui n'est pas la dernière position du bouton. – yong

Pourquoi ne pas simplement utiliser un index? S'il y a 4 boutons, alors "sameCode [1], sameCode [2], sameCode [3], sameCode [4]". Évidemment, cela utilise xPath, mais vous pouvez faire quelque chose de similaire dans CssSelector, je pense que c'est "sameCode (1) .. etc etc" en utilisant nth-child. – IamBatman

Vous devriez essayer d'utiliser "className" sélecteur comme,

driver.FindElement(By.className("vote-btn")).Click();

Vous pouvez également essayer d'utiliser "sélecteur de css" comme,

driver.FindElement(By.CssSelector(".vote-btn.primary-color-background")).Click();

Source

2017-09-28 13:37:18

Merci Pratik, le problème auquel je suis confronté est que j'ai 4 sections qui ont le même code exact et j'ai besoin de trouver un moyen de spécifier quel bouton je veux cibler. ATM Je n'ai pas le moyen de pointer chacun d'eux. – Lgalan90

@ Lgalan90 Ensuite, utilisez le pilote. ** findElements ** et utilisez un itérateur/boucle pour obtenir un bouton spécifique en utilisant la condition et la valeur d'index. J'espère que cela résout votre problème. –

Si vous avez plusieurs sections avec le même bouton - le meilleur choix est d'aller en haut> en bas dans le locator et de spécifier la section et de trouver le bouton dedans.

Comme le bouton [n] ne vous indique rien du bouton exact que vous recherchez. Et que se passera-t-il si un autre bouton sera ajouté? Spécifiez la section aussi, pas seulement le bouton.

Et dans css locator il est impossible d'identifier un élément par numéro de position. Exemple de page avec des sections nous aidera beaucoup à construire un localisateur efficace.

Source

2017-09-28 14:07:04

J'ai édité ma réponse et je me pencherai sur nth-child comme mentionné par yong et IamBatman. – Lgalan90

Xpath et CssSelectors pour même balise, les attributs et les éléments

Répondre

Questions connexes