Selenium WebDriver - Ricerca elementi utilizzando cssSelector e nth child

Question

<ul> 
<li class="active"> 
    <a href="#"> 
    <i class="fa fa-home"></i><br> 
    <span class="title">Home</span> 
    </a> 
</li> 

<li> 
    <a href="#"> 
    <i class="fa fa-rss-square"></i><br> 
    <span class="title">Posts</span> 
    </a> 
</li> 

<li> 
    <a href="#"> 
    <i class="fa fa-calendar"></i><br> 
    <span class="title">Events</span> 
    </a> 
</li> 

<li> 
    <a href="#"> 
    <i class="fa fa-bar-chart-o"></i><br> 
    <span class="title">My Activity</span> 
    </a> 
</li> 

<li> 
    <a href="#"> 
    <i class="fa fa-edit"></i><br> 
    <span class="title">Assessments</span> 
    </a> 
</li> 
</ul> 

Desidero localizzare il rispettivo elemento di span. Voglio controllare l'ordine degli elementi span usando il selettore CSS. Quindi quando uso l'IDE del selenio, lo verificherò come di seguito (usando l'ennesimo concetto di bambino).

verifyText | css = .title: nth (0) | Home
verifyText | css = .title: nth (1) | Messaggi
verifyText | css = .title: nth (2) | Eventi
verifyText | css = .title: nth (3) | Attività
verifyText | css = .title: nth (4) | Valutazioni

Ma quando faccio la stessa cosa in Selenium WebDriver non riesco a localizzare gli elementi con l'ordine che ho fatto usando l'IDE Selenium.

Di seguito sono riportati i codici che ho utilizzato in WebDriver e funziona.

driver.findElement(By.cssSelector(".title:nth(0)")); // to locate the "Home" element 

driver.findElement(By.cssSelector(".title:nth-of-type(0)")); // to locate the "Home" element 

driver.findElement(By.cssSelector(".title:nth-child(0)")); // to locate the "Home" element 

Qualcuno potrebbe aiutarmi.

Answer 1

È possibile generare il css selettore da ul come ul > li:nth-child(1) per la casa. Vedi sotto:

arco

driver.findElement(By.cssSelector("ul > li:nth-child(1)")); >> home 
driver.findElement(By.cssSelector("ul > li:nth-child(2)")); >> posts 
driver.findElement(By.cssSelector("ul > li:nth-child(3)")); >> events 

anche reachin è lo stesso:

driver.findElement(By.cssSelector("ul > li:nth-child(1) > a > span")); >> home 

Answer 2

hai bisogno di CSS in particolare? in caso contrario, si può anche andare per XPath, che secondo la mia opinione "si legge" migliore/più chiaro:

driver.findElement(By.xpath("(//span[@class='title'])[0]")); // home 
driver.findElement(By.xpath("(//span[@class='title'])[1]")); // posts 
...