I have a lot of fields, which has the same xpath, so script execution fails after web recording. I found with help of Chrome DevTools, that all of these have different JS paths, like these:
document.querySelector("#cert-button > span.ui-selectmenu-text")
document.querySelector("#cert\\.type-button > span.ui-selectmenu-text")
How could I record web elements with these identifiers?
document.querySelector("#cert-button > span.ui-selectmenu-text")
document.querySelector("#cert\\.type-button > span.ui-selectmenu-text")
Those are CSS selectors. The second one is broken (remove the “\\”). Did DevTools provide that selector? If it did, Chrome is broken.
I don’t think the recorder can switch to using CSS selectors.
Yes, I just copied these from dev tools. I see the same object in this form in Object spy:
id("cert.type-button")/span[@class="ui-selectmenu-text"]
I am unable to capture objects manually with Object Spy, because object names are also the same, so I can’t capture the second one. So I can’t capture objects with this selector, which is the only unique identifier.
Hey, why don’t you use Xpaths index? In your example if they all have same Xpath the first element would be then:
(//*[@id=‘cert.type-button’]/span[@class=“ui-selectmenu-text”])[1]
The second element would be then:
(//*[@id=‘cert.type-button’]/span[@class=“ui-selectmenu-text”])[2]
And so on, I hope this helps. That’s for Xpath, I’m not using css selectors.
Based on what you have provided (i.e. I can’t see your HTML) the second one could be…
document.querySelector("#cert > span.ui-selectmenu-text")
It’s saying in English, find the element with id cert and then find a first-child descendent HTML element <span> which has a class of ui-selectmenu-text.
You might find this article useful: