Question

关注Protractor API documentation应该有一种方法来截取整个页面，而不仅仅是可见帧。实际上它应该是默认行为。

调用takeScreenshot()时

browser.takeScreenshot().then(function (png) {
    // writing down image
});

然后在文件中保存选项3.从文档 - '当前帧的可见部分'。如何强制webdriver获取整页截图？

Answer 1

这与相应的浏览器驱动程序服务器有关。例如，如果您使用的是chrome，则chromedriver服务器负责提供整个页面的屏幕截图。

它与WebDriver客户端库或量角器无关。

Answer 2

这是一个黑客攻击，但您可以将onPrepare中的浏览器高度设置为2000像素或其他一些高值：

browser.driver.manage().window().setSize(320, 2000);

Answer 3

将以下代码添加到规范中。文件：

var fs = require('fs');

browser.takeScreenshot().then(function(png) {
  writeScreenShot(png, 'exception.png');
});

function writeScreenShot(data, filename) {
  var stream = fs.createWriteStream(filename);
  stream.write(new Buffer(data, 'base64'));
  stream.end();
}

这将获取页面的屏幕截图，并将作为exception.png添加到项目文件夹中。

Answer 4

您可以使用以下代码获取完整的屏幕截图：

browser.driver.manage().window().setSize(width, height);

您可以根据html页面调整宽度和高度。

Answer 5

Chrome出现错误。 https://bugs.chromium.org/p/chromium/issues/detail?id=45209 https://bugs.chromium.org/p/chromedriver/issues/detail?id=294
更改浏览器高度（browser.driver.manage().window().setSize(320, 2000);后，Firefox将获取整个页面的屏幕截图，而不是Chrome。

Answer 6

我在这里使用 jasmine-reporter （节点包）。

将代码写入conf文件中。

onPrepare: function () {
jasmine.getEnv().addReporter({
            specDone: function (result) {
                if (result.status === 'failed') {
                    browser.getCapabilities().then(function (caps) {
                        var browserName = caps.get('browserName');
                        browser.takeScreenshot().then(function (png) {
                            var stream = fs.createWriteStream('screenshots/' + browserName + '-' + result.fullName + '.png');
                            stream.write(new Buffer(png, 'base64'));
                            stream.end();
                        });
                    });
                }
            }
        });
}

上面的代码在出现故障时会截取屏幕截图，然后将其存储在名为screenshots的文件夹中，文件名为： -

browsername-errorItBlockName.png

示例： -

it('user signup', function () {
// error here
}

屏幕截图名称： chrome-user signup.png

如何在Protractor中截取整页的屏幕截图？

6 个答案: