selenium玩转svg操作

Posted 2020-10-05 久曲健

今天写脚本发现页面有svg结构，里面的元素无法定位，查找很多资料，然后就记录下来

初步尝试直接在页面中获取svg中包含元素的xpath，直接利用selenium方法访问，无法捕获到相关元素信息。

SVG包含一些图形元素，比如line，rect，circle等，很多情况下我们可以点击SVG上的元素触发一些event，比如打开context menu、在一个pie里选择一个portion等。但是SVG在html看来是一个单独的元素，我们怎么点击svg里的元素呢？下面记录下 Firefox和Chrome上的方法（其他browsers没有试）

解决方案：

用xpath找到元素，新建一个Actions点击就好了，要注意的是定位svg元素要用xpath的name（）函数，比如这个locator：//svg/line[2]，要用//*[name()=‘svg‘]/*[name()=‘line‘][2]"代替

代码示例：

WebElement element = driver.findElement(By.xpath(sLocator)); //sLocator like "//*[name()=‘svg‘]/*[name()=‘line‘][2]"

　　new Actions(driver).click(element).build().perform();