我可以在mocha很棒的html报告中添加柏树截图吗

Question

我可以生成mocha很棒的html报告，一切都很好，但我想在html报告中添加屏幕截图，我正在拍摄柏树屏幕截图，但想在html报表中添加。有什么方法可以添加它们吗？

Answer 1

考虑mochawesome addContext。这将为报告注入大约任何值。我确信生成的html报告会显示给定路径的图像。这可能需要进一步阅读addContext。

const { expect } = require('chai');
const addContext = require('mochawesome/addContext');
describe('Cypress tests.', function () {
before(function () {
// Perform Cypress things.
// Take screenshots.
};
after(function () {
const title = 'Screenshot of thing.';
const value = 'path/to/screenshot.png';
addContext(this, {
title,
value,
};
it('Foo should equal batz.', function () {
// Expect some things.
};
};

Answer 2

我使用以下代码将屏幕截图自动添加到任何(且仅限于(失败的测试中：

import addContext from 'mochawesome/addContext'
Cypress.on('test:after:run', (test, runnable) => {
if (test.state === 'failed') {
addContext({ test }, {title: 'Screenshot', value: `<path/to/screenshots/folder>/${Cypress.spec.name}/${runnable.parent.title.replace(':', '')} -- ${test.title} (failed).png`})
addContext({ test }, {title: 'Video', value: `<path/to/videos/folder>/${Cypress.spec.name}.mp4`})
}
});

将其放入support/index.js中，因为在任何测试之前都会加载此文件。

确保将上面的<path/to/.../folder>更新到您保存屏幕截图/视频的任何位置。该路径是相对于生成的html报告的。