为 Protractor 设置 Screenshot Reporter

Question

由于我是自动化测试和量角器的新手，我在测试中设置它时遇到了一些问题。

根据guide，每次我创建一个新的screenshot reporter 实例时，我都必须传递一个目录路径。对，这意味着每次我在 spec 文件中创建一个新实例时？

此外，还有一些功能可以对我跳过的和失败的测试进行截图。我应该在哪里使用 takeScreenShotsForSkippedSpecs 和 takeScreenShotsOnlyForFailedSpecs？在我的配置文件中？

这是我的 onPrepare：

onPrepare: function () {
        browser.driver.manage().window().maximize();
        global.dvr = browser.driver;
        global.isAngularSite = function (flag) {
            browser.ignoreSynchronization = !flag;
        }
        jasmine.getEnv().addReporter(new ScreenShotReporter({
            baseDirectory: '/tmp/screenshots',
            takeScreenShotsForSkippedSpecs: true,
            takeScreenShotsOnlyForFailedSpecs: true
        }));

Answer 1

库中的自述文件很容易解释。安装库后，将其添加到量角器配置文件中的量角器 onPrepare。

即 protractorConf.js:

var ScreenShotReporter = require('protractor-screenshot-reporter');

exports.config = {
   // your config here ...

   onPrepare: function() {
      // Add a screenshot reporter and store screenshots to `/tmp/screnshots`:
      jasmine.getEnv().addReporter(new ScreenShotReporter({
         baseDirectory: '/tmp/screenshots',
         takeScreenShotsForSkippedSpecs: true
      }));
   }
}

然后 protractor protractorConf.js 到运行量角器。

Answer 2

注意：如果您使用 jasmine2，请使用 protractor-jasmine2-screenshot-reporter。

对于jasmine1：

我一直在使用 protractor-html-screenshot-reporter 软件包成功使用。它基于 protractor-screenshot-reporter，但也提供了一份不错的 HTML 报告。

这是我在量角器配置中的内容：

var HtmlReporter = require("protractor-html-screenshot-reporter");

exports.config = {
    ...

    onPrepare: function () {
        // screenshot reporter
        jasmine.getEnv().addReporter(new HtmlReporter({
            baseDirectory: "test-results/screenshots"
        }));
    },

    ...
}

在运行测试之后，您将得到一个 HTML 文件，其中包含（示例）：

您可以单击 "view" 在浏览器中查看特定测试用例的屏幕截图。

Answer 3

最近我发布了一个名为 protractor-screenshoter-plugin 的全新插件，它为 每个浏览器实例 捕获一个 屏幕截图 和 控制台日志。快照是为每个 expect 或 spec 选择性制作的。它带有一个漂亮的 angular 和 bootstrap 基于 分析工具 来直观地检查和修复测试结果。

在 https://github.com/azachar/protractor-screenshoter-plugin 查看。

另外，我创建了一个所有可用的列表 alternatives，所以如果您发现其他东西，请不要犹豫添加到那里。

为 Protractor 设置 Screenshot Reporter

Setting up Screenshot Reporter for Protractor

javascript

selenium

screenshot

jasmine

protractor