是否可以使用WebDriver直接捕获webelement的屏幕截图？

Question

在Interface TakesScreenshot页面,我发现了这个:

捕获屏幕截图并将其存储在指定位置.对于扩展TakesScreenshot的WebDriver,这取决于浏览器的最大努力,以优先顺序返回以下内容: - 整个页面 - 当前窗口 - 当前帧的可见部分 - 包含浏览器的整个显示的屏幕截图

对于扩展TakesScreenshot的WebElement,这取决于浏览器的最大努力,以优先顺序返回以下内容: - HTML元素的整个内容 - HTML元素的可访问部分.

所以我想知道它应该支持截取webelement的截图,但是现在找不到任何与此支持相关的文档.不确定它是否真的支持.

有人知道更多细节吗？谢谢.

Answer 1

文档表明它受支持，但实际上它不起作用（至少不适用于 .Net 绑定）：

var screenshotTaker = element as ITakesScreenshot;
var image = screenshotTaker.GetScreenshot();
image.SaveAsFile(fileName, ImageFormat.Jpeg); // << null exception thrown here

有一个对我有用的解决方法 - 在页面上执行 javascript 以获取元素的位置：

const string javascript = "return arguments[0].getBoundingClientRect()";
var obj = (Dictionary<string, object>)((IJavaScriptExecutor)_core.Driver).ExecuteScript(javascript, element);
var rect = new Rectangle((int)double.Parse(obj["left"].ToString()),
                         (int)double.Parse(obj["top"].ToString()),
                         (int)double.Parse(obj["width"].ToString()),
                         (int)double.Parse(obj["height"].ToString()));

这将为您提供元素在视口中的位置，此时您可以截取整个页面的屏幕截图并将其裁剪到元素的边界。

希望这有帮助...