1

I like to verify that the label 'Name' displays # times on our page and was wondering how can I use cssSelector to find that element?

This is the element:

<div class="entity-label ng-binding" ng-bind-html="entity.Label">Name</div>

This is what I currently have, but not sure how to add 'Name' to it.

private By lblNameField = By.cssSelector("[class='entity-label ng-binding'][ng-bind-html='entity.Label'");

Image of my source

2
  • The Name in div is the text not the name, you can using xpath with the div[contains(text(), "Name")] Commented Jul 22, 2017 at 0:55
  • This post may help you Commented Jul 22, 2017 at 1:01

2 Answers 2

1

Technically you can do the search using a CSS selector but the locator alone would not find the elements you want. You would have to loop through all the elements and look for contained text using .getText(). The below is an example

List<WebElement> labels = driver.findElements(By.cssSelector("div.entity-label.ng-binding[ng-bind-html='entity.Label']"));
int count = 0;
for (WebElement label : labels)
{
    if (label.getText().equals("Name"))
    {
        count++;
    }
}
System.out.println(count);

The more efficient way to do it (and the only way to locate an element with containing text) is to use an XPath. The XPath would contain the text you are looking for so that with only the locator you would find all the desired elements. The code below would return the count of elements that you are looking for.

driver.findElements(By.xpath("//div[.='Name'][ng-bind-html='entity.Label']")).size();
Sign up to request clarification or add additional context in comments.

3 Comments

It still doesn't seem to find that xpath, I still get a count of 0 public int countName() { int nameCount; nameCount = driver.findElements(By.xpath("//div[.='Name'][ng-bind-html='entity.Label']")).size(); System.out.println(nameCount); return nameCount; }
I think I figured it out, I had to switch your xpath around to driver.findElements(By.xpath("//*[@class='entity-label ng-binding'][.='Name']")).size(); and that seemed to work.
That's odd... the HTML you provided in the question shows a DIV so that should work. I would double check that the elements you are getting are the ones you expect. You might double check the HTML and update the question if something has changed also.
1

No, you cannot. The only way is using Xpath. Use text()='your text' or contains(text(),'your text') as a condition to find the element.

private By lblNameField = By.xpath("//*[@class='entity-label ng-binding' and text()='Name']");

4 Comments

I've also tried your xpath and it couldn't find the Name field. If I used Chrome Dev and do an xpath I'm able to find it but it just looks messy - //*[@id="ResultsData"]/div/ol/li[*]/ol/li[1]/div[1]
@class='entity-label ng-binding' is bad practice, as these are two different classes and they are not guaranteed to appear in this order.
@JeffreyNg I forgot to mention that the xpath is case sensitive. You may need to change 'name' to 'Name'.
@SiKing I know. I know how to use template in Angular. The value in 'class' depends on the implementation, only the developers know about that certainty. I can't say that it is a random order. So I intend to use the same xpath as the questioner.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.