From 43f6a1ab9941dce9dc8cc7b2d0abde79e3edd3c6 Mon Sep 17 00:00:00 2001
From: Todd Wolfson <todd@twolfson.com>
Date: Thu, 14 Apr 2016 18:33:34 -0500
Subject: [PATCH] refactor(context): Future-proofed context.html and debug.html
 for modularity

BREAKING CHANGE:

Our `context.html` and `debug.html` structures have changed to lean on `context.js` and `debug.js`.
This is in preparation for deeper `context.js` changes in #1984.

As a result, all `customContextFile` and `customDebugFile` options much update their format
to match this new format.
---
 gruntfile.js                           |  2 ++
 lib/middleware/karma.js                | 12 ++++-----
 static/context.html                    | 11 +++------
 static/context.js                      | 13 ++++++++++
 static/debug.html                      | 34 +++-----------------------
 static/debug.js                        | 29 ++++++++++++++++++++++
 test/e2e/support/context/context2.html | 11 +++------
 7 files changed, 60 insertions(+), 52 deletions(-)
 create mode 100644 static/context.js
 create mode 100644 static/debug.js

diff --git a/gruntfile.js b/gruntfile.js
index 2e7282e08..6d644cf4d 100644
--- a/gruntfile.js
+++ b/gruntfile.js
@@ -76,6 +76,8 @@ module.exports = function (grunt) {
         '<%= files.grunt %>',
         '<%= files.scripts %>',
         '<%= files.client %>',
+        'static/context.js',
+        'static/debug.js',
         'test/**/*.js',
         'gruntfile.js'
       ]
diff --git a/lib/middleware/karma.js b/lib/middleware/karma.js
index 9c3168d72..cbedf28e2 100644
--- a/lib/middleware/karma.js
+++ b/lib/middleware/karma.js
@@ -114,8 +114,10 @@ var createKarmaMiddleware = function (
       })
     }
 
-    // serve karma.js
-    if (requestUrl === '/karma.js') {
+    // serve karma.js, context.js, and debug.js
+    var jsFiles = ['/karma.js', '/context.js', '/debug.js']
+    var isRequestingJsFile = jsFiles.indexOf(requestUrl) !== -1
+    if (isRequestingJsFile) {
       return serveStaticFile(requestUrl, response, function (data) {
         return data.replace('%KARMA_URL_ROOT%', urlRoot)
           .replace('%KARMA_VERSION%', VERSION)
@@ -195,11 +197,7 @@ var createKarmaMiddleware = function (
             return util.format("  '%s': '%s'", filePath, file.sha)
           })
 
-          var clientConfig = ''
-
-          if (requestUrl === '/debug.html') {
-            clientConfig = 'window.__karma__.config = ' + JSON.stringify(client) + ';\n'
-          }
+          var clientConfig = 'window.__karma__.config = ' + JSON.stringify(client) + ';\n'
 
           mappings = 'window.__karma__.files = {\n' + mappings.join(',\n') + '\n};\n'
 
diff --git a/static/context.html b/static/context.html
index 1269eea7c..2da2d0d52 100644
--- a/static/context.html
+++ b/static/context.html
@@ -15,14 +15,11 @@
        to have already been created so they can insert their magic into it. For example, if loaded
        before body, Angular Scenario test framework fails to find the body and crashes and burns in
        an epic manner. -->
+  <script src="context.js"></script>
   <script type="text/javascript">
-    // sets window.__karma__ and overrides console and error handling
-    // Use window.opener if this was opened by someone else - in a new window
-    if (window.opener) {
-      window.opener.karma.setupContext(window);
-    } else {
-      window.parent.karma.setupContext(window);
-    }
+    // Configure our Karma and set up bindings
+    %CLIENT_CONFIG%
+    window.__karma__.setupContext(window);
 
     // All served files with the latest timestamps
     %MAPPINGS%
diff --git a/static/context.js b/static/context.js
new file mode 100644
index 000000000..49f48f4db
--- /dev/null
+++ b/static/context.js
@@ -0,0 +1,13 @@
+// Define a placeholder for Karma to be defined via the parent window
+// DEV: This is a placeholder change for upcoming edits in https://github.com/karma-runner/karma/pull/1984
+window.__karma__ = {
+  setupContext: function (contextWindow) {
+    // sets window.__karma__ and overrides console and error handling
+    // Use window.opener if this was opened by someone else - in a new window
+    if (contextWindow.opener) {
+      contextWindow.opener.karma.setupContext(contextWindow)
+    } else {
+      contextWindow.parent.karma.setupContext(contextWindow)
+    }
+  }
+}
diff --git a/static/debug.html b/static/debug.html
index b39c2610d..7d4c45461 100644
--- a/static/debug.html
+++ b/static/debug.html
@@ -17,38 +17,10 @@
    (Angular Scenario, for example) need the body to be loaded so that it can insert its magic
    into it. If it is before body, then it fails to find the body and crashes and burns in an epic
    manner. -->
+  <script src="context.js"></script>
+  <script src="debug.js"></script>
   <script type="text/javascript">
-    window.__karma__ = {
-      info: function(info) {
-        if (info.dump && window.console) window.console.log(info.dump);
-      },
-      complete: function() {
-        if (window.console) window.console.log('Skipped ' + this.skipped + ' tests');
-      },
-      store: function() {},
-      skipped: 0,
-      result: window.console ? function(result) {
-        if (result.skipped) {
-          this.skipped++;
-          return;
-        }
-        var msg = result.success ? 'SUCCESS ' : 'FAILED ';
-        window.console.log(msg + result.suite.join(' ') + ' ' + result.description);
-
-        for (var i = 0; i < result.log.length; i++) {
-          //throwing error without loosing stack trace
-          (function (err) {
-            setTimeout(function() {
-              throw err;
-            });
-          })(result.log[i])
-        }
-      } : function() {},
-      loaded: function() {
-        this.start();
-      }
-    };
-
+    // Configure our Karma
     %CLIENT_CONFIG%
 
     // All served files with the latest timestamps
diff --git a/static/debug.js b/static/debug.js
new file mode 100644
index 000000000..0cbd64f2f
--- /dev/null
+++ b/static/debug.js
@@ -0,0 +1,29 @@
+// Override the Karma setup for local debugging
+window.__karma__.info = function (info) {
+  if (info.dump && window.console) window.console.log(info.dump)
+}
+window.__karma__.complete = function () {
+  if (window.console) window.console.log('Skipped ' + this.skipped + ' tests')
+}
+window.__karma__.store = function () {}
+window.__karma__.skipped = 0
+window.__karma__.result = window.console ? function (result) {
+  if (result.skipped) {
+    this.skipped++
+    return
+  }
+  var msg = result.success ? 'SUCCESS ' : 'FAILED '
+  window.console.log(msg + result.suite.join(' ') + ' ' + result.description)
+
+  for (var i = 0; i < result.log.length; i++) {
+    // Throwing error without losing stack trace
+    (function (err) {
+      setTimeout(function () {
+        throw err
+      })
+    })(result.log[i])
+  }
+} : function () {}
+window.__karma__.loaded = function () {
+  this.start()
+}
diff --git a/test/e2e/support/context/context2.html b/test/e2e/support/context/context2.html
index a4cfc9f55..b95b037a7 100644
--- a/test/e2e/support/context/context2.html
+++ b/test/e2e/support/context/context2.html
@@ -16,14 +16,11 @@
        before body, Angular Scenario test framework fails to find the body and crashes and burns in
        an epic manner. -->
   <div id="custom-context"></div>
+  <script src="context.js"></script>
   <script type="text/javascript">
-    // sets window.__karma__ and overrides console and error handling
-    // Use window.opener if this was opened by someone else - in a new window
-    if (window.opener) {
-      window.opener.karma.setupContext(window);
-    } else {
-      window.parent.karma.setupContext(window);
-    }
+    // Configure our Karma and set up bindings
+    %CLIENT_CONFIG%
+    window.__karma__.setupContext(window);
 
     // All served files with the latest timestamps
     %MAPPINGS%