Make Karma output look nicer for CI (!9165)

changelogs/unreleased/beautiful-karma-output.yml

+---
+title: Make Karma output look nicer for CI
+merge_request: 9165
+author: winniehell

config/karma.config.js

@@ -4,6 +4,7 @@ var ROOT_PATH = path.resolve(__dirname, '..');
 
 // Karma configuration
 module.exports = function(config) {
+  var progressReporter = process.env.CI ? 'mocha' : 'progress';
   config.set({
     basePath: ROOT_PATH,
     browsers: ['PhantomJS'],
@@ -15,7 +16,7 @@ module.exports = function(config) {
     preprocessors: {
       'spec/javascripts/**/*.js?(.es6)': ['webpack', 'sourcemap'],
     },
-    reporters: ['progress', 'coverage-istanbul'],
+    reporters: [progressReporter, 'coverage-istanbul'],
     coverageIstanbulReporter: {
       reports: ['html', 'text-summary'],
       dir: 'coverage-javascript/',

package.json

@@ -25,6 +25,7 @@
     "jquery-ui": "github:jquery/jquery-ui#1.11.4",
     "jquery-ujs": "1.2.1",
     "js-cookie": "^2.1.3",
+    "karma-mocha-reporter": "^2.2.2",
     "mousetrap": "1.4.6",
     "pikaday": "^1.5.1",
     "select2": "3.5.2-browserify",