wdio-video-reporter 是一个第三方包，更多信息请参见GitHub | npm

Logo

这是一个用于Webdriver IO v6 及更高版本的报告器，它可以生成 wdio 测试执行的视频。如果您使用 allure，那么测试用例也会自动添加视频。（对于 Webdriver IO v5，请使用 wdio-video-reporter 版本 ^2.0.0。）

视频最终存储在 wdio.config.outputDir 中

在此处查看包含失败测试视频的示例 Allure 报告：https://presidenten.github.io/wdio-video-reporter-example-report/

example-allure-report

优点

在您的 allure 报告中提供清晰的视频
即使测试速度很快，也能提供清晰的人类速度视频
适用于 Selenium 网格
适用于所有支持 saveScreenshot 的网络驱动程序
已在以下使用 Selenium 3.141.59 的桌面浏览器上验证
- Chrome
- Firefox
- Safari
- Internet Explorer 11
- Microsoft Edge
已在以下使用Appium 1.13.0-beta3 的 iOS 和 Android 设备上验证
- iPhone 8
- iPad 第 6 代
- 三星 Galaxy S9
- 三星 Galaxy Tab A10

缺点

通过在“操作”后截取屏幕截图来工作，这会使测试速度稍微变慢。可以通过仔细选择哪些jsonWireProtocol 消息应该导致屏幕截图来缓解这个问题
Selenium 驱动程序在屏幕截图中不包含警报框和弹出窗口，因此它们在视频中不可见

快速入门

查看wdio-template 中的简单模板，快速上手。

克隆其中一个存储库，并使用 yarn 或 npm install 安装依赖项。然后在演示目录中运行 yarn e2e 或 npm run e2e，最后运行 yarn report 或 npm run report 以查看 allure 报告。

安装

安装 Reporter

yarn add wdio-video-reporter 或 npm install wdio-video-reporter

将 Reporter 添加到配置

在 wdio.conf.js 文件的顶部，导入库

const video = require('wdio-video-reporter');

然后将视频 Reporter 添加到 reporters 属性中的配置中

 reporters: [
    [video, {
      saveAllVideos: false,       // If true, also saves videos for successful test cases
      videoSlowdownMultiplier: 3, // Higher to get slower videos, lower for faster videos [Value 1-100]
    }],
  ],

与 Allure 结合使用

添加 Allure Reporter 也会自动更新带有视频的报告，无需任何配置 :-)

 reporters: [
    [video, {
      saveAllVideos: false,       // If true, also saves videos for successful test cases
      videoSlowdownMultiplier: 3, // Higher to get slower videos, lower for faster videos [Value 1-100]
    }],
    ['allure', {
      outputDir: './_results_/allure-raw',
      disableWebdriverStepsReporting: true,
      disableWebdriverScreenshotsReporting: true,
    }],
  ],

配置

普通配置参数

大多数用户可能希望设置这些参数

saveAllVideos 设置为 true 以保存通过测试的视频。默认值：false
videoSlowdownMultiplier [1-100] 之间的整数。如果视频播放速度过快，请增加此值。默认值：3
videoRenderTimeout 等待视频渲染的最长时间（秒）。默认值：5
outputDir 如果未设置，则使用 wdio.config.outputDir。默认值：未定义
outputDir 如果未设置，则使用 wdio.config.outputDir。默认值：未定义
maxTestNameCharacters 测试名称的最大长度。默认值：250

高级配置参数

想要更改引擎何时截取屏幕截图的高级用户可以编辑这些参数。这些数组可以使用jsonWireProtocol 消息的最后一个单词填充，例如 /session/：sessionId/buttondown。

addExcludedActions 添加不需要屏幕截图的操作。默认值：[]
addJsonWireActions 添加缺少屏幕截图的操作。默认值：[]
recordAllActions 跳过过滤并截取所有内容。（不推荐）默认值：false

要查看已处理的消息，请设置 wdio.config.logLevel: 'debug' 并检查 outputDir/wdio-X-Y-Video-reporter.log。这也会保留屏幕截图输出目录以供查看

要完全避免额外的日志记录并只获取视频文件，请设置 wdio.config.logLevel: 'silent'。

Cucumber 支持

如果您使用的是 Allure Reporter，则需要确保执行以下操作

使用 chai 而不是内置的节点断言，否则失败的测试将在步骤定义中报告为已中断
在 wdio.conf.js 文件中将 useCucumberStepReporter: true 添加到 Allure 选项中，典型的配置如下所示

  reporters: [
    [video, {
      saveAllVideos: false,       // If true, also saves videos for successful test cases
      videoSlowdownMultiplier: 3, // Higher to get slower videos, lower for faster videos [Value 1-100]
    }],
    ['allure', {
      outputDir: './_results_/allure-raw',
      disableWebdriverStepsReporting: true,
      disableWebdriverScreenshotsReporting: true,
      useCucumberStepReporter: true
    }],
  ],

有关完整示例，请查看wdio-template 中的 cucumber 分支

Appium 设置

从 wdio-video-reporter v1.2.4 开始，支持帮助 Allure 区分桌面和设备上的 Safari 和 Chrome 浏览器。Reporter 使用自定义属性 deviceType 来识别不同的设备。推荐的值为 phone 和 tablet。建议为所有浏览器都包含 browserVersion，以避免在使用与桌面 Chrome 浏览器相同的 Selenium 网格中的设备时出现 Chrome 驱动程序中的错误。

生成的视频文件也会在浏览器名称中添加 deviceType。

示例 Appium 配置

  "capabilities": [
    {
      ...
      "deviceType": "phone",
      "browserVersion": "73.0-phone-1",
      ...
    }
  ],

以及 wdio-config.json

  "capabilities": [
    {
      ...
      "appium:deviceType": "phone",
      "browserVersion": "73.0-phone-1",
      ...
    },
  ],

贡献

Fork，进行更改，编写一些测试，lint，运行测试，构建，并在演示中验证更改是否按预期工作，然后创建 PR。

演示文件夹与库的构建版本一起使用，因此如果您添加了新功能并希望试用，请确保进行构建。

致谢

感谢Johnson E 修复了 Cucumber 支持，许多用户都对此提出了请求。

安装

安装 Reporter​

将 Reporter 添加到配置​

与 Allure 结合使用​

配置

普通配置参数​

高级配置参数​

Cucumber 支持​

Appium 设置​

贡献

致谢