3

Which css selector's correct for the following HTML code ?

<li class="active editing" data-index="0">
   <div class="view">
   <input class="edit"/>
</li> 

I'm trying to get the edit field but my selector doesn't work:

find(Condition.cssClass("active editing")).find(".input").setValue(...) 
3
  • Which of the three elements do you want to target, the LI, DIV or INPUT? and why are you having trouble with it? Currently you do not give enough information to help you. Oct 10, 2015 at 9:36
  • Im interested in "edit" and as the result in input Oct 10, 2015 at 11:05
  • find(Condition.cssClass("active editing")).find(".input").setValue(...) not works for me Oct 10, 2015 at 11:46

3 Answers 3

4

If your edit class is unique on the page, then you can do .edit If you need to be a bit more specific, you could do more along the lines of .active.editing input.edit

The point is, theres no "right" answer here, there are often many different css selectors you can build that can point to the same element. You want to find the balance between being short, concise and unique.

An example using this with webdriver could be
driver.findElement(By.cssSelector(".edit"));

1

If you are using Chrome: open DevTools, find you element in the DOM explorer, right-click the element and select 'Copy CSS Path'. You can test this using Selenium IDE and setting the target to "css=path_from_chrome".

1

Julian brought up good points, i.e. make sure your element is unique and does not change. If it is not, then make sure you talk to your developer to add an attribute that is unique and unchanging.

You can do

driver.findElement(By.cssSelector("li input[class='edit']"));

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.