Creating XPATH for svg tag

Question

Below is the html for SVG, pls help me with creating XPATH for same

<svg data-reactid=".1q.0.3.1.0" version="1.1" class="svg-connector">
   <circle data-reactid=".1q.0.3.1.0.0" r="7" cy="11" cx="11" class="inner-circle"/>
</svg>

Stelle

Answer 1

For svg nodes you need to use below syntax:

//*[name()="svg" and @class="svg-connector"]

This is because common HTML nodes and svg nodes belongs to different namespaces

Outbid

Answer 2

The <svg> elements are not from the XHTML namespace but belongs to SVG namespace. Hence you have to specify name()="svg" while constructing the xpath as follows :

//*[name()="svg" and @class="svg-connector"]//*[name()="circle" and @class="inner-circle"]

You can find a detailed discussion in Selenium WebDriver [Java]: How to Click on elements within an SVG using XPath

Supervise

Answer 3

Other suggestions didn't work for me. Here is what did:

//*[name() = 'svg'][contains(@class, 'input-class-name-here')]

Cote

Answer 4

Try the following xpath :

//svg[@class='svg-connector']

Whisler

Answer 5

This is like Andersson's suggestion, but seeks local-name nodes:

//*[local-name()='svg' and @class="input-class-name-here"]

Encore