自定义量角器-html-screenshot-reporter答案

【问题标题】：Customize protractor-html-screenshot-reporter自定义量角器-html-screenshot-reporter
【发布时间】：2023-04-03 15:55:01
【问题描述】：

我正在使用 protractor-html-screenshot-reporter 生成 HTML 报告。我在 Passed 列下得到 false/true，但我想要 Passed/Failed。

Expected - Failed(in red) or Passed(in green)
Actual   - False(in red) or True(in green)

代码片段 -

function defaultMetaDataBuilder(spec, descriptions, results, capabilities) {
                    var metaData = {
                        description: descriptions.join(' ')
                        , passed: results.passed()
                        , os: capabilities.caps_.platform
                        , browser: {
                            name: capabilities.caps_.browserName
                            , version: capabilities.caps_.version
                        }
                        , message: ''
}

如果我用这段代码替换 pass: results.passed() -

passed: results.passed() ? 'Passed' : 'Failed'.

我得到 Passed/Failed 而不是 True/False，但 Failed 也是绿色的。

我应该如何处理这种情况。随时欢迎任何建议

【问题讨论】：

标签： html protractor

【解决方案1】：

您必须更改页面的呈现方式。查看protractor-html-screenshot-reporter 的源代码，我可以看到该页面完全是在 javascript 文件中创建的。

去这个库源码到jsonparser.js(protractor-html-screenshot-reporter/lib/jsonparser.js)，修改function generateHTML(data)。目前它查看data.passed 以查看此布尔值是true 还是false。基于此，它生成颜色并将该值打印到列中。您想将此行编辑为如下内容：

str +=  '<td class="status-col" style="color:#fff;background-color: '+ bgColor+'">' + (data.passed ? "Passed" : "Failed") + '</td>';

如果您希望进一步修改此页面，我建议您将此代码移动到 html 页面中，而不是在 javascript 文件中生成它。

【讨论】：