如何使用 Selenium Webdriver 在 svg 标签中显示工具提示

Question

我正在尝试将 Selenium Webdriver 与 Python 一起使用以在 svg 标签中显示工具提示，但失败了。

下面是html:

<body class="DA_SKINNED DA_GECKO DA_MAC">
<div id="email-server-admin-target" data-qradar-locale="en">
<div>
<div id="header-container" class="spacing-md-y">
<header class="header">
<h4 class="ibm-helvetica header-title">Email Server Management</h4>
<button class="header-action icon-button" type="button">
<svg class="header-action header-action-icon" fill-rule="evenodd" height="24" name="help" role="help" viewBox="0 0 24 24" width="24" aria-label="Email server configuration help" alt="Email server configuration help">
<title>Email server configuration help</title>
<path d="M10.84 17h2.15v-2.11h-2.15V17zm-2.21-6.62h2.01c0-.25.03-.48.09-.69.05-.22.14-.4.25-.56.11-.16.26-.29.44-.39.18-.09.39-.14.64-.14.36 0 .64.1.85.3.2.2.31.51.31.93.01.25-.04.45-.13.62-.1.16-.22.31-.38.45-.15.14-.32.27-.51.41-.18.14-.35.3-.51.49-.17.18-.31.41-.44.67-.12.27-.19.6-.22.99v.61h1.85v-.52c.03-.27.12-.5.26-.68.14-.18.3-.34.49-.49.18-.14.37-.28.58-.42.2-.14.39-.31.56-.51.17-.2.31-.45.42-.73.12-.28.18-.64.18-1.08 0-.26-.06-.55-.18-.86-.11-.3-.3-.58-.56-.85a3.2 3.2 0 0 0-1.05-.66c-.43-.18-.97-.27-1.62-.27-.5 0-.96.08-1.36.25-.41.17-.76.41-1.04.71-.29.3-.51.65-.67 1.06-.16.42-.25.87-.26 1.36zM23 12c0 6.08-4.93 11-11 11S1 18.08 1 12 5.93 1 12 1s11 4.92 11 11z"></path>
</svg>
</button>
</header>
</div>
</div>
</div>
</body>

在网页上，<button> 标签中有一个帮助图标，将鼠标移到它上面时，会弹出工具提示 "Email server configuration help"。我想用 Selenium Webdriver 重新生成工具提示弹出窗口。

下面是我的代码：

helpIcon = self.wfx("/html/body/div/div/div[1]/header/button")
tooltip = ActionChains(self.browser)
tooltip.move_to_element(helpIcon).perform()

我上面的代码，当它运行到tooltip.move_to_element(helpIcon).perform()时，我可以看到图标变了颜色，就像将鼠标悬停在它上面一样，但是工具提示没有弹出，也没有错误发生。

我也尝试过将元素设置为下面的两个xpath，但是都找不到：

helpIcon = self.wfx("/html/body/div/div/div[1]/header/button/svg")

helpIcon = self.wfx("/html/body/div/div/div[1]/header/button/svg/path")

如何使用Selenium Webdriver 弹出svg 标签中的tooltip？

Answer 1

我遇到了类似的问题，然后我使用 sikuli 工具悬停鼠标光标，我也能够看到工具提示弹出窗口。

Answer 2

使用 you have to induce WebDriverWait for the visibility_of_element_located() and you can use either of the following 显示工具提示：

使用CSS_SELECTOR:

ActionChains(self.browser).move_to_element(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.CSS_SELECTOR, "body.DA_SKINNED.DA_GECKO.DA_MAC div#header-container button.header-action.icon-button")))).perform()

使用XPATH:

ActionChains(self.browser).move_to_element(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//h4[@class='ibm-helvetica header-title' and contains(.,'Email Server Management')]//following::button[1]")))).perform()

注意：您必须添加以下导入：

from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC

You can find a relevant discussion in

更新

似乎我们需要到达 <svg> 标签才能触发工具提示，您可以使用以下解决方案：

使用XPATH:

ActionChains(self.browser).move_to_element(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//h4[@class='ibm-helvetica header-title' and contains(.,'Email Server Management')]//following::button[1]/*[name()='svg'][@class='header-action header-action-icon' and @name='help]")))).perform()

Answer 3

我终于使用了一种完全不同的方法 PyAutoGUI 来触发工具提示：

import pyautogui

pyautogui.moveTo('The X and Y integer coordinates')

这可能不是一个完美的方法，但在我自己的例子中，标签的位置是固定的，所以这对我有用。

注意：如果工具提示仍然无法显示，请尝试移动或单击页面上的其他任何位置，然后返回。

如何使用 Selenium Webdriver 在 svg 标签中显示工具提示

How to display a tooltip in svg tag with Selenium Webdriver

python

selenium

svg

action

tooltip

更新