chore(testing): karma config files support multiple builtPaths (#2917)

* karma.config + karma-test-shim can handle multiple spec source paths;
  see quickstart issue: angular/quickstart#294
* cosmetic `karma.config.js` changes

Author: wardbell

public/docs/_examples/testing/ts/karma-test-shim.js

@@ -7,7 +7,10 @@ Error.stackTraceLimit = 0; // "No stacktrace"" is usually best for app testing.
 
 jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
 
-var builtPath = '/base/app/';
+// builtPaths: root paths for output ("built") files
+// get from karma.config.js, then prefix with '/base/' (default is 'app/')
+var builtPaths = (__karma__.config.builtPaths || ['app/'])
+                 .map(function(p) { return '/base/'+p;});
 
 __karma__.loaded = function () { };
 
@@ -19,8 +22,12 @@ function isSpecFile(path) {
   return /\.spec\.(.*\.)?js$/.test(path);
 }
 
+// Is a "built" file if is JavaScript file in one of the "built" folders
 function isBuiltFile(path) {
-  return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
+  return isJsFile(path) &&
+         builtPaths.reduce(function(keep, bp) {
+           return keep || (path.substr(0, bp.length) === bp);
+         }, false);
 }
 
 var allSpecFiles = Object.keys(window.__karma__.files)

public/docs/_examples/testing/ts/karma.conf.js

@@ -1,23 +1,28 @@
 // #docregion
 module.exports = function(config) {
 
-  var appBase    = 'app/';       // transpiled app JS and map files
-  var appSrcBase = 'app/';       // app source TS files
+  var appBase    = 'app/';      // transpiled app JS and map files
+  var appSrcBase = 'app/';      // app source TS files
   var appAssets  = 'base/app/'; // component assets fetched by Angular's compiler
 
-  var testBase    = 'testing/';       // transpiled test JS and map files
-  var testSrcBase = 'testing/';       // test source TS files
+  var testingBase    = 'testing/'; // transpiled test JS and map files
+  var testingSrcBase = 'testing/'; // test source TS files
 
   config.set({
     basePath: '',
     frameworks: ['jasmine'],
+
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'), // click "Debug" in browser to see it
-      require('karma-htmlfile-reporter') // crashing w/ strange socket error
+      require('karma-jasmine-html-reporter')
     ],
 
+    client: {
+      builtPaths: [appSrcBase, testingBase], // add more spec base paths as needed
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+
     customLaunchers: {
       // From the CLI. Not used here but interesting
       // chrome setup for travis CI using chromium
@@ -26,6 +31,7 @@ module.exports = function(config) {
         flags: ['--no-sandbox']
       }
     },
+
     files: [
       // System.js for module loading
       'node_modules/systemjs/dist/system.src.js',
@@ -49,28 +55,28 @@ module.exports = function(config) {
 
       // Paths loaded via module imports:
       // Angular itself
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+      { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false },
 
-      {pattern: 'systemjs.config.js', included: false, watched: false},
-      {pattern: 'systemjs.config.extras.js', included: false, watched: false},
-      'karma-test-shim.js',
+      { pattern: 'systemjs.config.js', included: false, watched: false },
+      { pattern: 'systemjs.config.extras.js', included: false, watched: false },
+      'karma-test-shim.js', // optionally extend SystemJS mapping e.g., with barrels
 
       // transpiled application & spec code paths loaded via module imports
-      {pattern: appBase + '**/*.js', included: false, watched: true},
-      {pattern: testBase + '**/*.js', included: false, watched: true},
+      { pattern: appBase + '**/*.js', included: false, watched: true },
+      { pattern: testingBase + '**/*.js', included: false, watched: true },
 
 
       // Asset (HTML & CSS) paths loaded via Angular's component compiler
       // (these paths need to be rewritten, see proxies section)
-      {pattern: appBase + '**/*.html', included: false, watched: true},
-      {pattern: appBase + '**/*.css', included: false, watched: true},
+      { pattern: appBase + '**/*.html', included: false, watched: true },
+      { pattern: appBase + '**/*.css', included: false, watched: true },
 
       // Paths for debugging with source maps in dev tools
-      {pattern: appSrcBase + '**/*.ts', included: false, watched: false},
-      {pattern: appBase + '**/*.js.map', included: false, watched: false},
-      {pattern: testSrcBase + '**/*.ts', included: false, watched: false},
-      {pattern: testBase + '**/*.js.map', included: false, watched: false}
+      { pattern: appSrcBase + '**/*.ts', included: false, watched: false },
+      { pattern: appBase + '**/*.js.map', included: false, watched: false },
+      { pattern: testingSrcBase + '**/*.ts', included: false, watched: false },
+      { pattern: testingBase + '**/*.js.map', included: false, watched: false}
     ],
 
     // Proxied base paths for loading assets
@@ -81,18 +87,7 @@ module.exports = function(config) {
 
     exclude: [],
     preprocessors: {},
-    // disabled HtmlReporter; suddenly crashing w/ strange socket error
-    reporters: ['progress', 'kjhtml'],//'html'],
-
-    // HtmlReporter configuration
-    htmlReporter: {
-      // Open this file to see results in browser
-      outputFile: '_test-output/tests.html',
-
-      // Optional
-      pageTitle: 'Unit Tests',
-      subPageTitle: __dirname
-    },
+    reporters: ['progress', 'kjhtml'],
 
     port: 9876,
     colors: true,

public/docs/ts/latest/guide/change-log.jade

@@ -5,6 +5,11 @@ block includes
   The Angular documentation is a living document with continuous improvements.
   This log calls attention to recent significant changes.
 
+  ## Testing: karma file updates (2016-11-30)
+  * karma.config + karma-test-shim can handle multiple spec source paths;
+  see quickstart issue: [angular/quickstart#294](https://github.com/angular/quickstart/issues/294)
+  * Displays Jasmine Runner output in the karma-launched browser
+
   ## QuickStart Rewrite (2016-11-18)
   The QuickStart is completely rewritten so that it actually is quick.
   It references a minimal "Hello Angular" app running in Plunker.