My application has a lot of selectors that have a dynamic ID inside. When that dynamic ID is at the end of the selector, I use [id^='staticPart']
inside of every selector. For example:
#tab-10 > svg > tspan
becomes:
[id^='tab-'] > svg > tspan
I works perfectly, but I can’t figure out what to do with selectors like this:
#tab-t0-1
where 0 is a dynamic number and everything else is static. I am trying the following, but I get an invalid selector error:
[id^='tab-']-1
Advertisement
Answer
To identify an element with dynamic id
e.g. #tab-t0-1 where 0 is a dynamic number and everything else is static you can use cssSelector with the following wildcards :
^ : To indicate an attribute value starts with
$ : To indicate an attribute value ends with
So the most granular locator would include the strategy to lookout for the initial letters i.e. tab-t and the ending letters i.e. -1 and should be :
[id^='tab-t'][id$='-1']
References
You can find a couple of relevant detailed discussions in: