Merge pull request #2318 from dotch/fix-crossorigin

fix(runner): Fix loading of external scripts without cors headers

docs/config/01-configuration-file.md

@@ -262,6 +262,15 @@ upon the completion of running the tests. Setting this to false is useful when e
 
 Especially on services like SauceLabs and Browserstack, it makes sense only to launch a limited amount of browsers at once, and only start more when those have finished. Using this configuration, you can specify how many browsers should be running at once at any given point in time.
 
+## crossOriginAttribute
+
+**Type:** Boolean
+
+**Default:** `true`
+
+**Description:** When true, this will append the crossorigin attribute to generated script tags, which enables better error reporting for JavaScript files served from a different origin.
+Disable this when you need to load external scripts that are served without the necessary `Access-Control-Allow-Origin` header.
+
 
 ## customContextFile
 **Type:** string
@@ -598,8 +607,8 @@ Note: Just about all additional reporters in Karma (other than progress) require
 **CLI:** `--format-error ./path/to/formatFunction.js`
 
 **Arguments:**
-  
-  * `msg` - The entire assertion error and stack trace as a string. 
+
+  * `msg` - The entire assertion error and stack trace as a string.
 
 **Returns:** A new error message string.
 

lib/config.js

@@ -325,6 +325,7 @@ var Config = function () {
   this.failOnEmptyTestSuite = true
   this.retryLimit = 2
   this.detached = false
+  this.crossOriginAttribute = true
 }
 
 var CONFIG_SYNTAX_HELP = '  module.exports = function(config) {\n' +

lib/middleware/karma.js

@@ -27,7 +27,8 @@ var urlparse = function (urlStr) {
 var common = require('./common')
 
 var VERSION = require('../constants').VERSION
-var SCRIPT_TAG = '<script type="%s" src="%s" crossorigin="anonymous"></script>'
+var SCRIPT_TAG = '<script type="%s" src="%s" %s></script>'
+var CROSSORIGIN_ATTRIBUTE = 'crossorigin="anonymous"'
 var LINK_TAG_CSS = '<link type="text/css" href="%s" rel="stylesheet">'
 var LINK_TAG_HTML = '<link href="%s" rel="import">'
 var SCRIPT_TYPE = {
@@ -89,6 +90,7 @@ var createKarmaMiddleware = function (
     var customContextFile = injector.get('config.customContextFile')
     var customDebugFile = injector.get('config.customDebugFile')
     var jsVersion = injector.get('config.jsVersion')
+    var includeCrossOriginAttribute = injector.get('config.crossOriginAttribute')
 
     var requestUrl = request.normalizedUrl.replace(/\?.*/, '')
     var requestedRangeHeader = request.headers['range']
@@ -187,7 +189,8 @@ var createKarmaMiddleware = function (
               scriptType += ';version=' + jsVersion
             }
 
-            return util.format(SCRIPT_TAG, scriptType, filePath)
+            var crossOriginAttribute = includeCrossOriginAttribute ? CROSSORIGIN_ATTRIBUTE : ''
+            return util.format(SCRIPT_TAG, scriptType, filePath, crossOriginAttribute)
           })
 
           // TODO(vojta): don't compute if it's not in the template

test/unit/middleware/karma.spec.js

@@ -34,12 +34,16 @@ describe('middleware.karma', () => {
 
   var handler = serveFile = filesDeferred = nextSpy = response = null
 
-  var clientConfig = {foo: 'bar'}
+  var clientConfig = {
+    foo: 'bar'
+  }
   var injector = {
     get (val) {
       switch (val) {
         case 'config.client':
           return clientConfig
+        case 'config.crossOriginAttribute':
+          return true
         default:
           return null
       }