使用Intern JS获取整页屏幕截图

时间:2017-11-20 11:38:18

标签: javascript selenium intern

在UI自动化方面,我对JavaScript编程很陌生,并且来自基于Java的Selenium背景。我目前正试图了解Intern JS以及如何使用它来获取我希望的任何网址和任何设备上的整页屏幕截图。最终目标是在多个设备上截取特定网站的屏幕截图,以进行手动可视化验证并使用Sauce Labs帐户。

我能够将takeScreenshot()功能分离为可重复使用的方法,如下所示:

MyFile.prototype.takeScreenshotAndWriteToFile = function (fileName) {
  return function () {
    return this.parent
      .takeScreenshot()
      .then(function (fileAsBuffer) {
        fileSystem.writeFile(fileName, fileAsBuffer, 'base64');
      })
      .catch(function (error) {
        console.log(error);
      });
  };
};

但是当我通过我们的Sauce Labs帐户在各种设备/浏览器上运行时,我得到以下结果:

  • 使用Chrome和Firefox的桌面(Windows 10上的最新版本)仅截取我提出请求时在浏览器窗口中立即显示的内容的屏幕截图。
  • 与上述相同的结果适用于移动设备和平板电脑的测试。
  • 奇怪的是,Safari版本11(在Mac上)确实采取整页截图。同样的方法。相同的实现。结果不同。

我完全感到困惑的是,为什么一些如此简单的事情想要拍一整页的截图被证明是一个如此复杂的问题......有谁能指出我正确的方向我能做什么实现我的目标?

或者,如果有人知道在这种情况下更好的替代Intern JS?我现阶段对任何想法/建议持开放态度。

1 个答案:

答案 0 :(得分:1)

正如Florent所指出的,屏幕截图实际上是由与浏览器连接的驱动程序(例如chromedriver)处理的,而不是与驱动程序连接的Intern。根据{{​​3}},屏幕截图只能是视口,而不是整页。 JSON有线协议(WebDriver的前身)在这个主题上有点模糊。在任何情况下,不同的浏览器驱动程序在许多情况下可以并且确实表现不同。

任何使用WebDriver / Selenium来管理浏览器的测试系统(大多数是受欢迎的开源浏览器)都将受到驱动程序功能的限制,并且可能不支持此功能。开箱。但是,它可能在测试系统中实现(比WebDriver更高级别),因此如果看起来值得,可以使用Intern(或者您可能正在使用的任何基于WebDriver的测试系统)提交功能请求。