javascript - Grunt 为 mocha 测试提供 html 报告

Question

我使用 grunt 运行我的 Mocha 测试，我在控制台中看到了测试结果，这是正常的，问题是这个任务正在生成报告，但是当你运行这个 HTML 报告时，你只会看到文本中的运行日志。 ..我想要查看测试聚合，并且 Mocha 单元测试运行正常，我在这里缺少什么？

mochaTest: {
    test: {
        options: {
            reporter: 'spec',
            colors: true,
            summery: true,
            captureFile: 'results.html', // Optionally capture the reporter output to a file
            quiet: false, // Optionally suppress output to standard out (defaults to false)
            clearRequireCache: true // Optionally clear the require cache before running tests (defaults to false)
        },
        src: ['test/*spec.js'],
        excludes: ['plugins']
    },
    'travis-cov': {
        options: {
            reporter: 'travis-cov'
        }
    }
},

我使用这个包 grunt.loadNpmTasks('grunt-mocha-test');

https://github.com/pghalliday/grunt-mocha-test

我想要这样的报告或任何其他我可以使用的漂亮的 html 报告...

Answer 1

您可以使用Mochawesome是一个与 Javascript 测试框架 mocha 一起使用的自定义报告器。它生成一个漂亮的 HTML/CSS 报告，帮助可视化您的测试套件:

首先，您需要安装插件:

npm install --save-dev mochawesome

然后你改变你的grunt-mocha-test reporter:

mochaTest: {
    test: {
        options: {
            reporter: 'mochawesome', //You need to change this !
            colors: true,
            summery: true,
            captureFile: 'results.html',
            quiet: false,
            clearRequireCache: true
        },
        src: ['test/*spec.js'],
        excludes: ['plugins']
    },
    'travis-cov': {
        options: {
            reporter: 'travis-cov'
        }
    }
},