在浏览器中查看 Karma 测试输出？答案

【问题标题】：View Karma Test Output in a Browser?在浏览器中查看 Karma 测试输出？
【发布时间】：2013-04-26 23:57:29
【问题描述】：

我是 Karma 的新手，但我想知道如何在浏览器中查看它的输出（很像与 Jasmine 交互的方式，当存在 runner.html 文件时）。

我观看了介绍性截屏视频，并且了解如何在控制台窗口中查看测试输出，但在我的浏览器中，我几乎没有看到 Karma 的内容，除了

业力 - 连接

请指教！我想避免维护单独的 runner.html 文件，因为 Karma 配置文件已经要求我包含所有必要的脚本链接。

【问题讨论】：

在我的 Linux 机器上，Karma 也会打开 Chromium 并说它已连接，但随后它会立即关闭浏览器。是的，在 Karma 配置中 singleRun 是错误的。
我看到了同样的问题@StephaneEybert，你解决了吗？
@ChrisFletcher 我在 test/karma.conf.js 文件中从 Chrome 更改为 PhantomJS，有： browsers: [ 'PhantomJS' // 'Chrome' ],

标签： karma-runner

【解决方案1】：

嗨，在我的情况下，我通过安装 karma-jasmine-html-reporter 并将其放入记者数组中解决了这个问题。

安装npm i -D karma-jasmine-html-reporter
在您的报告器中添加“kjhtml”。
添加client:{clearContext:false}

var gulpConfig = require('./build/build.conf')();
module.exports = function (config) {
    config.set({
        browsers: ['Chrome'],
        basePath: './',
        plugins: [
          // all other plugins
          'karma-jasmine-html-reporter'
        ],
        colors: true,
        client: {
            clearContext: false    // will show the results in browser once all the testcases are loaded
        },
        frameworks: ['jasmine', 'jasmine-sinon', 'sinon'],
        files: [].concat(
            gulpConfig.deps.lib,
            'js/**/*mother*.js',
            'js/**/*mother.*.js',
            'js/**/*.tests.js'
        ),
        logLevel: config.LOG_INFO,
        reporters: ['kjhtml', 'progress', 'coverage'],
    });
};

【讨论】：

【解决方案2】：

我想在 Karma 中显示 HTML5 Web Notifications，所以我快速写了一些东西来让它与 Karma 0.11 版一起使用。可能与其他版本略有不同。我将此脚本与我的其余应用程序脚本一起加载，它将存储业力测试结果，完成后它将确定测试是否成功，然后重置为原始业力函数，因此当此脚本运行时它们不会更改再次。

// store all my test results
var results = [];
// Wrap the karma result function
var resultFunc = window.__karma__.result;
window.__karma__.result = function(result){
    // run the original function
    resultFunc(result);
    // push each result on my storage array
    results.push(result);
}

// wrap the karma complete function
var completeFunc = window.__karma__.complete;
window.__karma__.complete = function(result){
    // run the original function
    completeFunc(result);
    // determine success
    var success = results.every(function(r){ return r.success });

    if (success) {
        // display a success notification
    }
    else {
        // display a test failure notification
    }

    // reset the result function
    window.__karma__.result = resultFunc;
    // reset the complete function
    window.__karma__.complete = completeFunc;
}

【讨论】：

【解决方案3】：

AFAIK，前两个答案是正确的，因为您需要在浏览器中运行测试；点击 DEBUG 并在控制台中查看输出。

礼貌地反驳之前的答案，我经常这样做，并使用 Karma 进行全变量交互的逐步调试。

您的问题的正确答案是“否”，因为您想要的是基于 HTML 的漂亮输出。然而，这个 karma 插件可能会给你想要的结果。

https://npmjs.org/package/karma-html-reporter

【讨论】：

谢谢我应该提到你需要打开控制台才能看到任何东西，而不仅仅是调试测试。我应该去看看那个记者。

【解决方案4】：

您需要在karma.conf.js 中使用singleRun = false 运行它，然后单击右上角的“DEBUG”按钮。然后你应该看到输出，它不会消失或关闭。您还可以使用控制台进行调试。

值得注意的是，调试 e2e 测试并不是那么容易，因为它们是基于“未来”的，因此您将无法拦截值 (afaik)。

【讨论】：

这对我不起作用@Chris，我知道这是一个旧答案，但您对为什么会出现这种情况有任何建议吗？
对不起，已经有一段时间了，我最近没有经常使用 Karma。很多地方都可能发生了变化。

【解决方案5】：

一种选择是在浏览器中打开 Javascript 控制台。 Karma 为每个测试创建一个日志条目，包括结果。

【讨论】：