Open Karma debug.html page on startup

Question

The short version:

How do I start up Karma and have it open the debug.html file automatically in the same browser as the Karma start page?

Answer 1

I found a way that makes it permanent although it is not perfect.. You can inject into the context a javascript:

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

and put inside the file this code:

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

this will ensure that the window is open only the first time the tests are run and it will be executed only in context.html.

You can add any init code you wish inside that block.

Answer 2

You can use a customLauncher browser definition:

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

And use this browser in your karma config.

Answer 3

I couldn't figure out a classy way to do it, so here's a dirty, low-down, no-good, rotten, totally shameful cheat, but it works. :)

In node_modules > karma > static > karma.js I added the following lines:

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

Shown below in context, starting around line 366 (in version 0.13.19):

  var updateBanner = function (status) {
    return function (param) {
      var paramStatus = param ? status.replace('$', param) : status
      titleElement.innerHTML = 'Karma v' + VERSION + ' - ' + paramStatus
      bannerElement.className = status === 'connected' ? 'online' : 'offline'
    }
  }

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

  socket.on('connect', updateBanner('connected'))
  socket.on('disconnect', updateBanner('disconnected'))
  socket.on('reconnecting', updateBanner('reconnecting in $ ms...'))
  socket.on('reconnect', updateBanner('connected'))
  socket.on('reconnect_failed', updateBanner('failed to reconnect'))
  socket.on('info', updateBrowsersInfo)
  socket.on('disconnect', function () {
    updateBrowsersInfo([])
  })
}

Enjoy. You rebel, you.