我正在OpenLayers
使用Selenium WebDriver
(Java版本)测试API .
我想测试一个使用OpenLayers
.Control.ModifyFeature 的功能.我想点击绘制的特征(SVG),然后拖动并检查它们是否存在,可见或隐藏.
我画了一个多边形,我选择了它.见下图:
这些SVG元素的HTML在这里:
<svg id="OpenLayers_Layer_Vector_161_svgRoot" width="1235" height="495" viewBox="0 0 1235 495" style="display: block;">
<g id="OpenLayers_Layer_Vector_161_root" transform="" style="visibility: visible;">
<g id="OpenLayers_Layer_Vector_161_vroot">
<path id="OpenLayers_Geometry_Polygon_200" d=" M 393.0000000000964,213.9999999999891 486.0000000003338,275.9999999997126 384.00000000036925,284.9999999994434 393.0000000000964,213.9999999999891 z" fill-rule="evenodd" fill="blue" fill-opacity="0.4" stroke="blue" stroke-opacity="1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="none" pointer-events="visiblePainted" cursor="pointer" />
<circle id="OpenLayers_Geometry_Point_619" cx="439.50000000021464" cy="244.99999999985084" r="6" fill="#009900" fill-opacity="0.5" stroke="#ee9900" stroke-opacity="1" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="none" pointer-events="visiblePainted" cursor="inherit" />
<circle id="OpenLayers_Geometry_Point_621" cx="435.00000000035106" cy="280.49999999958163" r="6" fill="#009900" fill-opacity="0.5" stroke="#ee9900" stroke-opacity="1" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="none" pointer-events="visiblePainted" …
Run Code Online (Sandbox Code Playgroud) 我有一个SVG
带有几个矩形元素的对象。使用geckodriver
,我试图单击主要SVG
对象之一。但是,使用xpath-checker我无法检测到正确的xpath
到相同值。
到现在为止,我可以深入了解以下内容xpath
:
id('avg_score_chart')/div/div[1]/*[local-name()='svg' and namespace-uri()='http://www.w3.org/2000/svg']
Run Code Online (Sandbox Code Playgroud)
我的HTML
代码如下:
<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)"> …
Run Code Online (Sandbox Code Playgroud) 我尝试向某些节点添加新的 SVG 元素。为此,要添加元素的节点必须通过包含在文本内容中的字符串找到,例如,找到"id0"
在<text>
标签内具有的任何节点。
这是我的 HTML 层次结构的示例:
<pre>
<svg>
<g>
<g>
<text> id3 </text>
<text> 73% </text>
<svg> ... </svg>
</g>
<g>
<svg> ... </svg>
</g>
<g>
<text> id0 </text>
<text> 11% </text>
<svg> ... </svg>
</g>
<g>
<text> id1 </text>
<text> 66% </text>
<svg> ... </svg>
</g>
<g>
<svg> ... </svg>
</g>
</g>
</svg>
</pre>
Run Code Online (Sandbox Code Playgroud)
我绝对不知道正确的解决方案,但我认为它是这样的:
d3.select('svg').select('g').selectAll('g').each(function (d, i) {})
.select('g').select('text').filter(function () {
return (d3.select(this).text() === 'id0')
})
.select(function () {
return this.parentElement;
})
.append('svg')
.attr('width', …
Run Code Online (Sandbox Code Playgroud)