I have just started working in selenium and stuck at some point and need help from experts.

Here is my html

<div id='d3_tree'>
   <svg>
     <g transform="translate(20,50)>
        <g class='node'>
        </g> 
        <g class='node pe_node'>
        </g>
        <g class='node pe_node'>
        </g> 
     </g>
   </svg>
</div>

I need to have all the <g> having class pe_node and invoke context menu on these <g> I have tried to get the svg like this

node = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/'svg']/g")

then I have read that svg can not be selected directly So I tried this

nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*[name()='svg']/g")

and

  nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*[local-name()='svg']/g")

But it is still not working for me and I am getting [] in result.

Can anyone guide me how to select the <g> with class pe_node inside svg

Any help will be appreciated

Thanks

I have just started working in selenium and stuck at some point and need help from experts.

Here is my html

<div id='d3_tree'>
   <svg>
     <g transform="translate(20,50)>
        <g class='node'>
        </g> 
        <g class='node pe_node'>
        </g>
        <g class='node pe_node'>
        </g> 
     </g>
   </svg>
</div>

I need to have all the <g> having class pe_node and invoke context menu on these <g> I have tried to get the svg like this

node = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/'svg']/g")

then I have read that svg can not be selected directly So I tried this

nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*[name()='svg']/g")

and

  nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*[local-name()='svg']/g")

But it is still not working for me and I am getting [] in result.

Can anyone guide me how to select the <g> with class pe_node inside svg

Any help will be appreciated

Thanks

• javascript
• selenium
• svg
• d3.js

5 Answers 5

You were halfway there, the following should work:

nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*[name()='svg']/*[name()='g']")

Every element inside 'svg' has to be referenced as `/*[name()='']

In this case you can shorten it up a bit with:

nodes = self.driver.find_elements(By.XPATH, "//div[@id='d3_tree']/*/*[name()='g']")

Following xpath should work //div[@id='d3_tree']//g[contains(@class, 'pe_node')]

Could you not select the <svg> element using the tagName?

node = driver.findElement(By.tagName("svg"))
otherNodes = node.findElements(By.Xpath("./g[contains(@class, 'pe_node')]")

You can try this,I am unaware of which language you are using.But the below selenium will might be helpful for you.Nodes will return all the elements under svg tag with having class as "node pe_node".

node = self.driver.find_element(By.XPATH, "//div[@id='d3_tree']/svg]")
nodes = node.find_elements(By.XPATH,"//g[@class='node pe_node']")

You can write like this:

//div[@id='d3_tree']/*[name()='svg']/*[name()='g' and @class='node pe_node']/*[name()='g'][2]