javascript - 如何在 Python selenium webdriver 中点击 HTML5 Canvas 上的一个点

Question

我正在尝试在 python 中使用 Selenium webdriver(在 linux 中使用 Firefox)来自动使用网站上的简单 HTML5 应用程序。我需要我的 Python 程序单击位于 HTML5 Canvas 上特定位置的按钮，然后在按下按钮后单击并拖动 Canvas 周围的一个或两个对象。

似乎 selenuim 目前无法在 HTML5 Canvas 上实际定位按钮或任何其他对象。首先，我试图在页面上找到 HTML5 按钮出现的坐标，计算出它与页面上某个对象的偏移量(以像素为单位)，selenium 可以通过 ID 找到它，然后使用 move_to_element_with_offset，如下所示:

from selenium.webdriver.common.action_chains import ActionChains
actions = ActionChains(driver)
move_to_element_with_offset(elem, 50, -250)
actions.click()
actions.perform()

这似乎没有用。它没有引发错误，但什么也没发生。我突然想到我可能弄错了坐标，但我不知道如何查看页面上的实际点击位置以检查这一点。各种论坛上的很多人似乎认为 selenium 中的点击操作无论如何都不可靠。接下来，我发现有人声称能够通过运行一个 javascript 来完成我正在尝试做的事情，该 javascript 在给定页面坐标的情况下模拟点击。看这里:http://chariotsolutions.com/blog/post/automated-testing-of-html5-canvas/

我非常擅长 Python，但对 javascript 几乎一无所知。我尝试了一些与本文中出现的非常相似的东西:

x = '675'
y = '450'
driver.execute_script("var evt = $.Event('click', { pageX: " + x +", pageY: " + y + " } );" + "$('#diagramCanvas').trigger(evt);")

这导致了一个错误:

WebDriverException: $.Event is not a function

如何让 Python Selenium webdriver 在给定坐标的情况下点击 HTML5 Canvas 中的特定位置？是否有一个 javascript 脚本不会像上面那样引发错误，或者有其他方法可以做到这一点？

Answer 1

您尝试使用 javascript 的是使用 JQuery。这就是为什么如果你想使用它，你应该将 jquery 添加到你的页面。

至于 Selenium，它绑定(bind)到 DOM，这就是它无法定位任何不存在的东西的原因 - 如您所知， Canvas 只是浏览器的图像。假设我们在“canvas”var 中有 canvas 元素:

canvas = self.driver.find_element_by_id("canvas")
drawing = ActionChains(self.driver)\
    .move_by_offset(-10, -15)\
    .click(canvas)\
    .release()
drawing.perform()

如果它不起作用，您正在点击其他地方 :) 您可以尝试确定您正在点击的坐标。