I have seen a lot of people asking about how they can generate Xpath or some sort of locators for locating SVG elements.
well, its very simple but first lets have a look at how SVG elements look like, Have you come across this elements ever. Check out the picture below.
If you have come across these elements but you don't know how to locate them or for people who have not yet come across these elements,how would you locate the highlighted text element using Xpath. Generate a Xpath in your mind.Is it something similar to -
.//div[@id='chartPanelContainer']//span//svg/g[contains(@class,'red-axisbottom')]/g[contains(@class,'red-x-axis-labels')]/text[1]
well this is how you select normal elements right?But this does not work for SVG elements.
for SVG elements you have to use the format /*[name()='svg'] instead of /svg. Look at the below picture to understand how it works-
well, its very simple but first lets have a look at how SVG elements look like, Have you come across this elements ever. Check out the picture below.
 |
| Click to enlarge |
If you have come across these elements but you don't know how to locate them or for people who have not yet come across these elements,how would you locate the highlighted text element using Xpath. Generate a Xpath in your mind.Is it something similar to -
.//div[@id='chartPanelContainer']//span//svg/g[contains(@class,'red-axisbottom')]/g[contains(@class,'red-x-axis-labels')]/text[1]
well this is how you select normal elements right?But this does not work for SVG elements.
for SVG elements you have to use the format /*[name()='svg'] instead of /svg. Look at the below picture to understand how it works-
 |
| Click to enlarge |
No comments:
Post a Comment