<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Magic Sandbox Test</title>
    <script src="index.js"></script>
  </head>
  <body>
    <script type="template" id="template">
      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width">
          <title>Magic Sandbox Test</title>
        </head>
        <body>
          <h1>HELLO</h1>
          <p id="p"></p>
          <script src="fillParagraph.js"><\/script>
        </body>
      </html>
    </script>
    <iframe id="sandbox"></iframe>
    <script>
      var template = document.getElementById("template")
        .textContent.replace(/\\\//g, "/");
      var sandbox = document.getElementById("sandbox");
      var files = {
        "fillParagraph.js": {
          content: "document.getElementById('p').textContent = 'Dynamic';"
        }
      };
      var source = magicSandbox.parseCode(template, files);
      sandbox.setAttribute("srcdoc", source);
    </script>
  </body>
</html>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Magic Sandbox Test</title>
    <script src="index.js"></script>
  </head>
  <body>
    <script type="template" id="template">
      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width">
          <title>Magic Sandbox Test</title>
        </head>
        <body>
          <h1>HELLO</h1>
          <p id="p"></p>
          <pre id="data"></pre>
          <script src="fillParagraph.js"><\/script>
          <script>
            var request = new XMLHttpRequest();
            request.onreadystatechange = function () {
              document.getElementById("data").textContent = this.responseText;
            };
            request.open("GET", "data.csv", true);
            request.send(null); 
          <\/script>
        </body>
      </html>
    </script>
    <iframe id="sandbox"></iframe>
    <script>
      var template = document.getElementById("template")
        .textContent.replace(/\\\//g, "/");
      var sandbox = document.getElementById("sandbox");
      var files = {
        "fillParagraph.js": {
          content: "document.getElementById('p').textContent = 'Dynamic';"
        },
        "data.csv": {
          content: "A,B,C\n1,2,3\n4,5,6"
        }
      };
      var source = magicSandbox.parseCode(template, files);
      sandbox.setAttribute("srcdoc", source);
    </script>
  </body>
</html>

Add test for dynamix XHR
Add test for dynamix XHR
