Javascript 启动时打开Karma debug.html页面

短版本：

如何启动Karma并让它在Karma起始页所在的浏览器中自动打开debug.html文件

长版本：

我不太喜欢在Karma中使用控制台报告器，所以我一直在使用哪个输出到Karma的localhost:9876/debug.html文件。问题是，每次启动调试会话时，我都必须单击karma打开的网页中的“调试”按钮

我想找到一种方法，让karma通过一个吞咽任务自动打开debug.html页面。我在多个浏览器中运行测试，因此我希望debug.html页面作为Karma打开的每个浏览器中的第二个选项卡打开。我还希望在karma关闭时能够关闭debug.html选项卡。我尝试了很多事情，但都没有成功

这是我的吞咽任务。“watch”任务监视我的源TypeScript文件并将它们编译成javascript…没什么特别的

gulp.task('watch-test', ['watch'], function (done) {
    //start a livereload server so that the karma html 
    //reporter knows to reload whenever the scripts change
    livereload.listen(35729);
    gulp.watch('dist/src/**/*.js').on('change', livereload.changed);

    new KarmaServer({
        configFile: __dirname + '/karma.conf.js',
        singleRun: false
    }, done).start();
});

---

我想不出一个优雅的方法来做这件事，所以这里有一个肮脏的、卑鄙的、没有好处的、腐朽的、完全可耻的欺骗，但它是有效的

在node_modules>karma>static>karma.js中，我添加了以下行：

var debugWin = window.open('http://localhost:7676/debug.html','Debugme');
debugWin.focus();

如下文所示，从第366行开始（在版本0.13.19中）：

---

享受。你反叛，你。

我找到了一种方法，使它永久化，尽管它并不完美。。您可以将javascript注入到上下文中：

files: [
    "test/init.js",
    ...
]

并将以下代码放入文件中：

(function (window) {
    if (!window.parent.initDone && window.location.pathname === '/context.html') {
         window.parent.initDone = true;
         window.open('/debug.html', '_blank');
    }
})(window)

这将确保窗口仅在第一次运行测试时打开，并且仅在context.html中执行

---

您可以在该块中添加任何所需的初始代码。

您可以使用

customLauncher

浏览器定义：

  customLaunchers: {
    ChromeDebugging: {
      base: 'Chrome',
      flags: [ '--remote-debugging-port=9333', '--auto-open-devtools-for-tabs', 'http://localhost:9876/debug.html' ]
    }
  }

---

并在您的karma配置中使用此浏览器。

我同意，每次都要点击它很烦人，尤其是在使用karma jasmine html reporter livereload时。我一直在想同样的事情。你能把你已经尝试过的东西贴出来吗？这样我就不会重新发明你的轮子了。非常有创意。：）不幸的是，这并没有我所期待的持久性。如果我清除了我的node_modules文件夹，或者我的团队中的另一个人取出代码并运行它，除非我也签入了node_modules文件夹，其中至少有这个文件。down&dirty，如我所说。如果你有更持久的想法，一定要把它贴在这里！仍然有一点点的黑客，但这正是我需要的！很好的是，我可以签入该文件，现在团队中的每个人都可以通过零配置获得该功能。谢谢我将其与karma的

customLaunchers

设置结合使用，以传递

--自动打开选项卡的devtools

和

'--用户数据目录='+路径.resolve（uu dirname，./.chrome'））

标记为Chrome，导致在同一位置打开一个窗口，该窗口在每次运行时都会向“调试”选项卡打开相同的devtools布局。这将同时打开debug.html页面和默认页面。

  customLaunchers: {
    ChromeDebugging: {
      base: 'Chrome',
      flags: [ '--remote-debugging-port=9333', '--auto-open-devtools-for-tabs', 'http://localhost:9876/debug.html' ]
    }
  }