Как получить доступ к элементу типа rect через Selenium-Python

Question

В домике есть прямоугольный объект:

<rect class="slv-blank" id="id123" height="8.8" stroke-width="1px" width="18.8" x="59.2" y="37.5"></rect>

Я пытаюсь найти его с помощью следующего кода:

WebDriverWait(driver, 1).until(ec.presence_of_element_located(("xpath", '//rect[@id="id123"]'))).click()

Это не работает.

Но следующее делает:

WebDriverWait(driver, 1).until(ec.presence_of_element_located(("xpath", '//*[name()="rect"][@id="id123"]'))).click()

Есть какие-нибудь подсказки, почему первый не работает?

Answer 1

<rect>

Элемент <rect> является базовой формой SVG , которая создает прямоугольники, определяемые положением их угла, их шириной и их высотой. Прямоугольники могут иметь закругленные углы.

Пример:

<svg viewBox="0 0 220 100" xmlns="http://www.w3.org/2000/svg">
  <!-- Simple rect element -->
  <rect x="0" y="0" width="100" height="100" />

  <!-- Rounded corner rect element -->
  <rect x="120" y="0" width="100" height="100" rx="15" ry="15" />
</svg>

---

Атрибуты

Атрибуты из <rect> элементов следующие:

• x: Этот атрибут определяет координату x прямоугольника.
  • Тип значения: | ; Значение по умолчанию: 0; Анимация: да
• y: Этот атрибут определяет координату y прямоугольника.
  • Тип значения: | ; Значение по умолчанию: 0; Анимация: да
• width: Этот атрибут определяет ширину прямоугольника.
  • Тип значения: авто || ; Значение по умолчанию: авто; Анимация: да
• height: Этот атрибут определяет высоту прямоугольника.
  • Тип значения: авто || ; Значение по умолчанию: авто; Анимация: да
• rx: Этот атрибут определяет радиус горизонтального угла прямоугольника.
  • Тип значения: авто || ; Значение по умолчанию: авто; Оживляемый: да
• ry: Этот атрибут определяет радиус вертикального угла прямоугольника.
  • Тип значения: авто || ; Значение по умолчанию: авто; Анимация: да
• pathLength: Этот атрибут позволяет указать общую длину пути в пользовательских единицах.
  • Тип значения:; Значение по умолчанию: нет; Анимация: да

Примечание : Начиная с SVG2 x, y, width, height, rx и ry - это свойства геометрии, то есть эти атрибуты также можно использовать в качестве свойств CSS для этого элемента.

---

Этот вариант использования

Поскольку элемент <rect> является элементом SVG , чтобы найти такие элементы, необходимо явно указать пространство имен SVG при доступе к элементам с использованием xpath следующим образом:

• Для <svg> элементов:

  //*[name()="svg"]
  

• Для <g> элементов:

  //*[name()="svg"]/*[name()="g"]
  

• Для <rect> элементов:

  //*[name()="svg"]/*[name()="g"]/*[name()="rect"]
  //*[name()="svg"]/*[name()="rect"]
  

---

Ссылки

Вы можете найти пару подробных обсуждений в

• Как нажимать на элементы SVG с помощью XPath и Selenium WebDriver через Java
• Невозможно найти элементы SVG через xpath на графике интерфейса Kendo

Answer 2

Используйте Action класс или JavaScript Исполнитель.

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as ec
from selenium.webdriver.common.action_chains import ActionChains
elememnt=WebDriverWait(driver, 1).until(ec.presence_of_element_located(("xpath", '//*[@id="id123"]')))
ActionChains(driver).move_to_element(elememnt).click().perform()

OR

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as ec
from selenium.webdriver.common.action_chains import ActionChains
elememnt=WebDriverWait(driver, 1).until(ec.presence_of_element_located(("xpath", '//*[@id="id123"]')))
driver.execute_script("arguments[0].click();",elememnt)