Merge pull request #85 from ember-fastboot/shoebox-encoding

JSON escape rendered shoebox content

Author: tomdale

src/ember-app.js

@@ -310,7 +310,10 @@ function createShoebox(doc, fastbootInfo) {
     if (!shoebox.hasOwnProperty(key)) { continue; }
 
     let value = shoebox[key];
-    let scriptText = doc.createTextNode(JSON.stringify(value));
+    let textValue = JSON.stringify(value);
+    textValue = escapeJSONString(textValue);
+
+    let scriptText = doc.createRawHTMLSection(textValue);
     let scriptEl = doc.createElement('script');
 
     scriptEl.setAttribute('type', 'fastboot/shoebox');
@@ -322,6 +325,22 @@ function createShoebox(doc, fastbootInfo) {
   return RSVP.resolve();
 }
 
+const JSON_ESCAPE = {
+  '&': '\\u0026',
+  '>': '\\u003e',
+  '<': '\\u003c',
+  '\u2028': '\\u2028',
+  '\u2029': '\\u2029'
+};
+
+const JSON_ESCAPE_REGEXP = /[\u2028\u2029&><]/g;
+
+function escapeJSONString(string) {
+  return string.replace(JSON_ESCAPE_REGEXP, function(match) {
+    return JSON_ESCAPE[match];
+  });
+}
+
 /*
  * Builds a new FastBootInfo instance with the request and response and injects
  * it into the application instance.

test/fastboot-shoebox-test.js

@@ -10,7 +10,7 @@ const FastBoot       = alchemistRequire('index');
 
 describe("FastBootShoebox", function() {
 
-  it("can render the shoebox HTML", function() {
+  it("can render the escaped shoebox HTML", function() {
     var fastboot = new FastBoot({
       distPath: fixture('shoebox')
     });
@@ -20,6 +20,11 @@ describe("FastBootShoebox", function() {
       .then(html => {
         expect(html).to.match(/<script type="fastboot\/shoebox" id="shoebox-key1">{"foo":"bar"}<\/script>/);
         expect(html).to.match(/<script type="fastboot\/shoebox" id="shoebox-key2">{"zip":"zap"}<\/script>/);
+
+        // Special characters are JSON encoded, most notably the </script sequence.
+        expect(html).to.include('<script type="fastboot/shoebox" id="shoebox-key4">{"nastyScriptCase":"\\u003cscript\\u003ealert(\'owned\');\\u003c/script\\u003e\\u003c/script\\u003e\\u003c/script\\u003e"}</script>');
+
+        expect(html).to.include('<script type="fastboot/shoebox" id="shoebox-key5">{"otherUnicodeChars":"\\u0026\\u0026\\u003e\\u003e\\u003c\\u003c\\u2028\\u2028\\u2029\\u2029"}</script>');
       });
   });