使用 k6 JSON 输出生成 html 报告答案

【问题标题】：Generate an html report using k6 JSON output使用 k6 JSON 输出生成 html 报告
【发布时间】：2020-08-04 16:44:10
【问题描述】：

是否有现成的插件可以从 K6 生成的 JSON 输出生成 html 报告？我正在尝试构建一个简单的 HTML 报告，但生成的输出 JSON 无效且无法解析。下面是 K6 的 JSON 输出。

{"type":"Metric","data":{"name":"data_received","type":"counter","contains":"data","tainted":null,"thresholds":[],"submetrics":null,"sub":{"name":"","parent":"","suffix":"","tags":null}},"metric":"data_received"}
{"type":"Point","data":{"time":"2020-07-30T21:06:05.6026767Z","value":0,"tags":{"group":"::setup"}},"metric":"data_received"}
{"type":"Metric","data":{"name":"iteration_duration","type":"trend","contains":"time","tainted":null,"thresholds":[],"submetrics":null,"sub":{"name":"","parent":"","suffix":"","tags":null}},"metric":"iteration_duration"}
{"type":"Point","data":{"time":"2020-07-30T21:06:05.6026767Z","value":0.09,"tags":{"group":"::setup"}},"metric":"iteration_duration"}

【问题讨论】：

那是四行有效的 JSON；要将它们一起使用，您需要创建一个数组。您可能可以使用 const data = output.split("\n").map(JSON.parse); 之类的东西，但理想情况下，应将单个数据对象推入一个数组，然后将该数组编码为 JSON。

标签： javascript load-testing k6

【解决方案1】：

https://github.com/benc-uk/k6-reporter

此 K6 扩展旨在通过添加到您的 K6 测试代码 (JavaScript) 中使用，并利用添加到 K6 v0.30.0 的 handleSummary 回调挂钩。当您的测试完成时，一个 HTML 文件将被写入文件系统，其中包含一个格式化且易于使用的测试摘要数据版本

要使用，请将此模块添加到您的测试代码中。

从 GitHub 上远程托管的捆绑模块中导入 htmlReport 函数

import { htmlReport } from "https://raw.githubusercontent.com/benc-uk/k6-reporter/main/dist/bundle.js";

注意。将 main 替换为版本标记（例如 2.2.0）以使用特定版本

然后在测试的默认函数之外，用K6在任何测试结束时调用的handleSummary(data)函数包装它，如下：

export function handleSummary(data) {
  return {
    "summary.html": htmlReport(data),
  };
}

返回对象中使用的键是要写入的文件名，可以是任何有效的文件名或路径笔记。这是 v2.1.1 版本的变化

htmlReport 函数接受可选的选项映射作为第二个参数，具有以下属性

title string // 报告的标题，默认为当前日期多个输出如果您想对生成的输出进行更多控制或将摘要输出到多个位置（包括标准输出），只需将 htmlReport 的结果与其他摘要生成器结合起来，如下所示：

// 这将作为文件名“result.html”导出到 HTML 并使用文本摘要导出到标准输出

import { htmlReport } from "https://raw.githubusercontent.com/benc-uk/k6-reporter/main/dist/bundle.js";
import { textSummary } from "https://jslib.k6.io/k6-summary/0.0.1/index.js";

export function handleSummary(data) {
  return {
    "result.html": htmlReport(data),
    stdout: textSummary(data, { indent: " ", enableColors: true }),
  };
}

【讨论】：