SeleniumWebdriver(node.js)截图并保存测试结果

Question

我开始为一个网站应用程序开发测试，但遇到了一些问题。

我使用的是Node.js、webdriver、chromedriver和selenium-rc。

问题是：1.如何制作屏幕截图并将其保存在与脚本相同的文件夹中。2.有没有办法保存测试用例的测试日志？例如，如果检查页面上的某个元素却没有找到，我该如何输出？

Answer 1

为了保存测试日志，通常使用测试运行程序。当您检查某个元素是否在页面上但找不到它时，您会引发一个异常（通常是断言错误），测试运行程序会记录此异常并将其标记为失败的测试。在文档中，他们建议您使用Mocha。

至于将屏幕截图保存到磁盘，api看起来像这个

driver.takeScreenshot().then(
    function(image, err) {
        require('fs').writeFile('out.png', image, 'base64', function(err) {
            console.log(err);
        });
    }
);

Answer 2

将aychedee的答案转换为一个完整的承诺，该承诺将在写入文件后解决，并在写入失败时拒绝：

const fsp = require('fs').promises
function takeScreenshot(driver, file){
  return driver.takeScreenshot()
    .then(image => fsp.writeFile(file, image, 'base64'))
}

或者在ESM async功能中

import { writeFile } from 'node:fs/promises'
async function takeScreenshot(driver, file){
  let image = await driver.takeScreenshot()
  await writeFile(file, image, 'base64')
}

Answer 3

仅供记录，以下是使用WebdriverJS:进行屏幕截图的方式

var webdriverjs = require('webdriverjs'),
    client = webdriverjs.remote({
        desiredCapabilities: {
            browserName: 'chrome'
        }
    });
client
    .init()
    .url('http://google.com')
    .saveScreenshot(__dirname + '/googleScreenshot.png')
    .end();

您也可以使用WebdriverCSS进行屏幕截图。它是WebdriverJS的一个插件，用于进行CSS回归测试。它与PhantomCSS非常相似。