Невозможно найти элементы SVG через xpath на графике интерфейса Kendo

Question

Я попробовал некоторые xpaths, но мне не повезло.

Я хочу нажать на страну, а затем на график, приведенный ниже скриншот:

URL-адрес веб-сайта: https://demos.telerik.com/kendo-ui/bar-charts/column

Я пробовал xpaths:

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


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

Answer 1

Элементы на диаграмме относятся к SVG-namespace , поэтому вы не можете использовать общий синтаксис для выбора этих элементов (вы не сможете выбрать элемент по имени тега, например //svg или //path и т. Д.)

Вы можете попробовать ниже выбрать text узел с текстом "India":

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

Answer 2

Поскольку желаемыми элементами являются SVG Elements , вам необходимо рассмотреть пространство имен и заставить WebDriverWait для желаемого элемента быть активным для клика и нажать на first bar в графе вы можете использовать следующее решение:

• Кодовый блок:

  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 3

Привет, вы можете нажать на Индию со следующим Xpath //*[text()='India']

Это действительно полезный ресурс

Обычно я открываю Chrome Inspector, а затем нажимаю Ctrl + F, чтобы открыть интерактивный способ проверки моих путей:

Вы можете нацелить svgs, используя их удары, но учтите, что они могут часто меняться. пример: //*[@d='M54.5 164.5 L 70.5 164.5 70.5 236.5 54.5 236.5Z' and @stroke='#03a9f4']