从 Allure 生成 HTML 报告

---

---

在 WebdriverIO 中，我们有一个报告程序插件来生成 Allure 测试报告。Allure 是一款轻量级的测试报告工具，它根据自动化运行的测试结果创建简明且记录良好的报告。

要安装 Allure 并将其条目创建到 package.json 文件中，我们需要运行以下命令：

npm install @wdio/allure-reporter --save-dev

有关 package.json 的详细信息在标题为“package.json 文件”的章节中进行了讨论。

您的计算机上将显示以下屏幕：

安装 Allure 后，我们需要在配置文件 wdio.conf.js 中的 reporter 选项中配置输出目录，方法是添加以下代码。

有关如何创建配置文件的详细信息在标题为“wdio.conf.js 文件”和“配置文件生成”的章节中进行了详细讨论。

reporters: [['allure', {
   outputDir: 'allure-results',
   disableWebdriverScreenshotsReporting: false,
}]],

您的计算机上将显示以下屏幕：

这里，outputDir 具有默认目录 /allure-results。自动化完成后，我们将发现此目录已生成。它将包含 specs 文件夹中每个测试文件（包含在运行中）的 .xml 文件以及 .txt、.png 和其他文件。

此外，为了附加失败测试的屏幕截图，我们已将参数 disableWebdriverScreenshotsReporting 设置为 false。

但是，我们还需要在 wdio.conf.js 文件中添加一个 afterStep 钩子，代码如下所示：

afterStep: function (test, scenario, { error, duration, passed }) {
   if (error) {
      browser.takeScreenshot();
   }
}

您的计算机上将显示以下屏幕：

使用以下命令运行配置文件 - wdio.conf.js 文件：

npx wdio run wdio.conf.js

有关如何创建配置文件的详细信息在标题为“wdio.conf.js 文件”和“配置文件生成”的章节中进行了详细讨论。

您的计算机上将显示以下屏幕：

成功执行命令后，将在 WebdriverIO 项目中生成一个名为 allure-results（如 wdio.conf.js 中指定）的文件夹。它包含 xml 格式的报告。

接下来，我们需要将这些报告转换为 HTML 格式。为此，我们将首先安装 Allure 命令行工具，用于从测试结果生成 Allure 报告。

这是通过运行以下命令完成的：

npm install -g allure-commandline --save-dev

安装完成后，我们可以使用以下命令以 HTML 格式生成结果：

allure generate [allure_output_dir] && allure open

要覆盖现有结果，我们需要运行以下命令：

allure generate [allure_output_dir] --clean && allure open

您的计算机上将显示以下屏幕：

成功执行命令后，将打开一个包含测试结果的浏览器。您的计算机上将显示以下屏幕：

单击失败的测试（用红色标记），我们将获得测试的详细信息，包括预期输出、实际输出和失败的屏幕截图（在展开“响应”后获得）。

您的计算机上将显示以下屏幕：