无法在Kendo UI图表上通过xpath定位SVG元素

Question

我确实尝试了一些xpath但似乎没有运气。

我想点击国家然后图表，如下截图：

网站网址是：https://demos.telerik.com/kendo-ui/bar-charts/column

我试过xpaths：

//text(text()='India')


 //g//text(text()='India')

Answer 1

由于所需的元素是SVG Elements，您需要考虑命名空间并诱导WebDriverWait以使所需元素可单击，并单击图形中的第一个条，您可以使用以下解决方案：

• 代码块：

  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.common.by import By
  from selenium.webdriver.support import expected_conditions as EC
  
  options = webdriver.ChromeOptions()
  options.add_argument("start-maximized")
  options.add_argument("disable-infobars")
  options.add_argument("--disable-extensions")
  driver = webdriver.Chrome(chrome_options=options, executable_path=r'C:\Utility\BrowserDrivers\chromedriver.exe')
  driver.get("https://demos.telerik.com/kendo-ui/bar-charts/column")
  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH, "//div[@id='chart']//*[name()='svg']//*[name()='g']//*[text()='India']//following::*[name()='path']"))).click()
  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH, "//div[@id='chart']//*[name()='svg']//*[name()='g'][contains(@clip-path, 'url')]//*[name()='path']"))).click()

• 浏览器快照：

Answer 2

您好，您可以使用以下Xpath //*[text()='India']单击印度

这是一个非常有用的resource

我通常打开chrome检查器，然后点击ctrl + F打开一个交互方式来测试我的xpath：

您可以使用他们的笔划来定位svgs，但请注意这些可能会经常更改。例如：//*[@d='M54.5 164.5 L 70.5 164.5 70.5 236.5 54.5 236.5Z' and @stroke='#03a9f4']

Answer 3

图表上的元素来自SVG-namespace，因此您无法使用通用语法来选择这些元素（您无法通过其标记名称选择元素，例如//svg或//path等）

你可以尝试下面用文本text选择"India"节点：

//*[name()="text" and text()="India"]