How to click on SVG elements using XPath and Selenium WebDriver through Java

问题

I have an SVG object with a few rectangle elements. Using geckodriver, I am trying to click on one of the main SVG object. However with xpath-checker I am unable to detect the proper xpath for the same.

Till now, I am able to drilldown through xpath upto:

id(\'avg_score_chart\')/div/div[1]/*[local-name()=\'svg\' and namespace-uri()=\'http://www.w3.org/2000/svg\']

My HTML code is as follows:

<div id=\"avg_score_chart\" class=\"chart\" style=\"height: 250px; color: black ! important; overflow: hidden; text-align: left;\">
<div class=\"amcharts-main-div\" style=\"position: relative;\">
<div class=\"amcharts-chart-div\" style=\"overflow: hidden; position: relative; text-align: left; width: 525px; height: 212px; padding: 0px;\">
<svg version=\"1.1\" style=\"position: absolute; width: 525px; height: 212px; top: 0.450012px; left: -0.5px;\">
<desc>JavaScript chart by amCharts 3.17.1</desc>
<g>
<g>
<g>
<g>
<g>
<g>
<g transform=\"translate(60,52)\">
<g transform=\"translate(96,41)\">
<g transform=\"translate(96,123)\">
<g transform=\"translate(96,123)\">
<path cs=\"100,100\" d=\"M0.5,0.5 L0.5,-81.5 L30.5,-81.5 L30.5,0.5 L0.5,0.5 Z\" fill=\"rgb(242,244,28)\" stroke=\"rgb(242,244,28)\" fill-opacity=\"0.8\" stroke-width=\"1\" stroke-opacity=\"0.8\">
</g>
<g transform=\"translate(318,123)\">
<g transform=\"translate(318,123)\">
<g transform=\"translate(318,123)\">
</g>
</g>
<g>
<g>
<g>
<g>
<g>
<g>
<g>
<g>
<g>
<g>
<g>
</svg>

Can anyone help me out please?

回答1:

Try following XPath and let me know if problem still persist:

//div[@id="avg_score_chart"]//*[name()="svg"]

For <g> elements:

//div[@id="avg_score_chart"]//*[name()="svg"]/*[name()="g"]

Update

Finally, this should be nearly the best option:

//div[@class="portlet light boxshadow"][contains(.,"Store Wise Performance")]/div//div[@class="amcharts-chart-div"]/*[name()="svg"]//*[name()="g"]/*[name()="path" and @fill="rgb(242,244,28)"]