Not being able to locate an element using contains() in xpath

Question

I want to locate the element using Reject from the below:

<span ng-click="moderatePost(post,'R')" role="button" tabindex="0">
    <i class="icon-delete-cross f-s-20 show-hide"/i>
    Reject                       
</span>

I tried using //*[contains(text(),'Reject')] but it could not locate the element. Please advise.

Answer 1

contains() -

• Very useful, when we wanted to search with substring of available text

• Below is the example how to implement:

  driver.findElement(By.xpath("//label[contains(@id,'id_of_an_element')]"))
  

Answer 2

Can you try the following;

 .//span[contains(text(),'Reject')]
 .//*[@ng-click="moderatePost(post,'R')"]

I would also suggest you read more on generating xpaths here

Angularjs applications are usually tricky to automate with native Selenium Webdriver, I would also suggest looking at using ProtractorJs which is a test framework that wraps around Selenium JSON protocol for AngularJS applications.

Answer 3

You can't use xpath contains(text(), ...) in html that's structured like yours.

I was able to get around this in a similar problem by moving the text in the html to be placed before the inner html content (in your case, the <i> icon).

<span ng-click="moderatePost(post,'R')" role="button" tabindex="0">
    Reject                       
    <i class="icon-delete-cross f-s-20 show-hide"/i>
</span>

This should yield you the same results, (CSS can change this!) however, you should now be able to use an xpath selector to find your element again.