Selenium 截取元素截图 - Google Chrome

Question

我正在尝试使用 selenium web 驱动程序和 python 从谷歌浏览器截取<canvas>标签元素的屏幕截图。

我尝试使用以下代码，

driver.find_element_by_css('#canvas-xyz').save_screenshot('canvas.png')

它回来了

AttributeError: 'WebElement' object has no attribute 'save_screenshot'

我也在开发工具中尝试过这个，

document.querySelector('#canvas-xyz').toDataURL()

它返回了以下 DATA URI，该 URI 为空。

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABq8AAAAhCAYAAABHnTGeAAAEQ0lEQVR4Xu3ZMREAAAwCseLfdG38kCrgUjZ2jgABAgQIECBAgAABAgQIECBAgAABAgQIECBAgEBEYJEcYhAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBA445USECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIZASMV5lXCEKAAAECBAgQIECAAAECBAgQIECAAAECBAgQIGC80gECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIGMgPEq8wpBCBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIEjFc6QIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgkBEwXmVeIQgBAgQIECBAgAABAgQIECBAgAABAgQIECBAgIDxSgcIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQyAsarzCsEIUCAAAECBAgQIECAAAECBAgQIECAAAECBAgQMF7pAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAQEbAeJV5hSAECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQLGKx0gQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBDICBivMq8QhAABAgQIECBAgAABAgQIECBAgAABAgQIECBAwHilAwQIECBAgAABAgQIECBAgAABAgQIECBAgAABAhkB41XmFYIQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgYr3SAAAECBAgQIECAAAECBAgQIECAAAECBAgQIEAgI2C8yrxCEAIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAeOVDhAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECGQEjFeZVwhCgAABAgQIECBAgAABAgQIECBAgAABAgQIECBgvNIBAgQIECBAgAABAgQIECBAgAABAgQIECBAgACBjIDxKvMKQQgQIECAAAECBAgQIECAAAECBAgQIECAAAECBIxXOkCAAAECBAgQIECAAAECBAgQIECAAAECBAgQIJARMF5lXiEIAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQICA8UoHCBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIEMgLGq8wrBCFAgAABAgQIECBAgAABAgQIECBAgAABAgQIEDBe6QABAgQIECBAgAABAgQIECBAgAABAgQIECBAgEBGwHiVeYUgBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECxisdIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQyAgYrzKvEIQAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQMB4pQMECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIZAeNV5hWCECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIGK90gAABAgQIECBAgAABAgQIECBAgAABAgQIECBAICPwDiwAIhIPZYcAAAAASUVORK5CYII=

是否可以在 python 中使用 chromedriver 和 selenium 截取元素的屏幕截图。 我知道 chrome 开发工具允许我们截取特定元素的屏幕截图。 即使它是一个 JavaScript 方法，我也可以使用driver.execute_script()命令获取数据 URI。

Answer 1

WebElement没有save_screenshot 。 您可以使用screenshot_as_png （属性）并保存它

element = driver.find_element_by_css('#canvas-xyz')
scrrenshot = element.screenshot_as_png
with open('canvas.png', 'wb') as f:
    f.write(scrrenshot)

Answer 2

使用WebElement.screenshot()方法：

def screenshot(self, filename):
    """
    Saves a screenshot of the current element to a PNG image file. Returns
       False if there is any IOError, else returns True. Use full paths in
       your filename.

    :Args:
     - filename: The full path you wish to save your screenshot to. This
       should end with a `.png` extension.

    :Usage:
        element.screenshot('/Screenshots/foo.png')
    """

所以，在你的例子中，那将是：

driver.find_element_by_css('#canvas-xyz').screenshot('canvas.png')