feat(karma): Simplify karma configuration. Enable 'karma start conf/karma.js' to work (without Grunt). Enable watch:true in karma:debug to enable on-the-fly code/test reload

Author: christopherthielen

Gruntfile.js

@@ -86,33 +86,18 @@ module.exports = function (grunt) {
     karma: {
       options: {
         configFile: 'config/karma.js',
-        singleRun: true,
-        exclude: [],
-        frameworks: ['systemjs', 'jasmine'],
-        reporters: 'dots', // 'dots' || 'progress'
-        port: 8080,
-        colors: true,
-        autoWatch: false,
-        autoWatchInterval: 0,
         // Serve and load angular files using regular Karma mode
-        files: files.karmaServedFiles('1.4.1'),
-        systemjs: {
-          configFile: 'config/system.config.js',
-          // These files are served by Karma, but loaded using SystemJS
-          files: ['src/**/*.ts'].concat(files.testUtils, files.test),
-          // This is turned into a regexp and used to load specs into Karma
-          testFileSuffix: "/test/\\S+.[tj]s"
-        },
         browsers: [ grunt.option('browser') || 'PhantomJS' ]
       },
       // Same as karma:base
       unit: {
-        browsers: [ grunt.option('browser') || 'PhantomJS' ]
       },
       // Launch Karma in Chrome, click debug button, debug tests
       debug: {
         singleRun: false,
         background: false,
+        autoWatch: true,
+        autoWatchInterval: 1,
         browsers: [ grunt.option('browser') || 'Chrome' ]
       },
       // Test with angular 1.2
@@ -128,12 +113,10 @@ module.exports = function (grunt) {
         options: { files: files.karmaServedFiles('1.4.1') }
       },
       background: {
-          background: true,
-          browsers: [ grunt.option('browser') || 'PhantomJS' ]
+          background: true
       },
       // PhantomJS in the console; watch for changes to tests/src
       watch: {
-        configFile: 'config/karma.js',
         singleRun: false,
         autoWatch: true,
         autoWatchInterval: 1

config/karma.base.js

@@ -1,7 +1,51 @@
 // Karma configuration file
-var config = require("./karma.base");
+
+var files = require('../files').files;
 
 module.exports = function (karma) {
-  config.logLevel = karma.LOG_DEBUG;
-  karma.set(config)
+  var config = {
+
+    singleRun: true,
+    autoWatch: false,
+    autoWatchInterval: 0,
+
+    // level of logging
+    // possible values: LOG_DISABLE, LOG_ERROR, LOG_WARN, LOG_INFO, LOG_DEBUG
+    logLevel: karma.LOG_DEBUG,
+    // 'dots', 'progress'
+    reporters: 'dots',
+    colors: true,
+
+    port: 8080,
+
+    // base path, that will be used to resolve files and exclude
+    basePath: '..',
+
+    // Start these browsers, currently available:
+    // Chrome, ChromeCanary, Firefox, Opera, Safari, PhantomJS
+    browsers: ['PhantomJS'],
+
+    frameworks: ['systemjs', 'jasmine'],
+    plugins: [
+      require('karma-systemjs'),
+      require('karma-jasmine'),
+      require('karma-phantomjs-launcher'),
+      require('karma-chrome-launcher')
+    ],
+
+    // Karma files available to serve is overridden using files.karmaServedFiles() in some grunt tasks (e.g., karma:ng12)
+    files: files.karmaServedFiles('1.4.1'),
+    // Actual tests to load is configured in systemjs.files block
+    systemjs: {
+      // Set up systemjs paths
+      configFile: 'config/system.config.js',
+      // These files are served by Karma, but loaded using SystemJS
+      files: ['src/**/*.ts'].concat(files.testUtils, files.test),
+      // karma-systemjs kludge: This is turned into a regexp and used to load specs into Karma
+      testFileSuffix: "/test/\\S+.[tj]s"
+    },
+    exclude: []
+  };
+
+  karma.set(config);
 };

config/karma.js

@@ -41,12 +41,13 @@ routerFiles = {
   // This returns a Karma 'files configuration' for the files served by the Karma web server
   // http://karma-runner.github.io/0.8/config/files.html
   karmaServedFiles: function(version) {
-    return [
-      routerFiles.angular(version),
+    return routerFiles.angular(version).map(function (pattern) {
+      return { watched: false, included: true, nocache: true, pattern: pattern };
+    }).concat([
       { watched: true, included: false, nocache: true, pattern: 'src/**/*.ts' },
       { watched: true, included: false, nocache: true, pattern: 'test/**/*.ts' },
       { watched: true, included: false, nocache: true, pattern: 'test/**/*.js' }
-    ]
+    ]);
   }
 };