1

For some websites Selenium IDE will record a CSS selector in a different way than the one I get when you copy the selector from the developer tools. Here's an example page :

https://www.barnesandnoble.com/w/the-woman-they-could-not-silence-kate-moore/1138489968?ean=9781728242576

Price selector on Selenium IDE

id=pdp-cur-price

Price selector from dev tools

div.price-current-old-details:nth-child(3) > span:nth-child(1)

or

span#pdp-cur-price.price.current-price.ml-0

Add to cart button from IDE

css=.add-to-cart-button

Add to cart button from dev tools

form.focus > input:nth-child(5)

or

input.add-to-cart-button.btn-addtocart.btn-pdp-addtocart.btn.btn--commerce.mr-xs

This of course doesn't help when running the selenium script.

What solutions worked for you in getting accurate CSS selectors?

undetected Selenium
  • 183,867
  • 41
  • 278
  • 352
Tlink
  • 875
  • 2
  • 14
  • 30
  • The one written by a human which is customized is more reliable than this dev tool auto generated or generated by selenium IDE. – cruisepandey Feb 26 '22 at 18:09

2 Answers2

1

The locators you get by IDE are correct while automatically generated locators from the dev tools are far from being so effective.
I advice you to learn how to create correct and effective locators.
There are many tutorials describing that, for example these

Prophet
  • 32,350
  • 22
  • 54
  • 79
1

Despite the fact Selenium IDE and Developer Tools suggests near perfect locator strategies, it is always advisable to formulate more canonical locator strategies tweaking the element attributes, so the desired WebElements are uniquely identified within the DOM Tree.

You can find a couple of relevant detailed discussions in:

undetected Selenium
  • 183,867
  • 41
  • 278
  • 352
  • In the case of this link, the selector seems to be correct, but it's never found by ChromeHeadless https://stackoverflow.com/questions/71282185/page-elements-seen-in-the-browser-dev-tools-are-not-retrieved-by-chromeheadless – Tlink Feb 28 '22 at 20:36