Skip to main content
3 of 6
added 553 characters in body
Sean Vieira
  • 159.6k
  • 17
  • 11

Things that currently are nicely sandboxed (feel free to add things you tried that didn't work):

var TESTS = {
  "Trashing the parent": function() {
    parent.document.querySelector("body").innerHTML = "Much evil!";
  },
  "Reading cookies": function() {
    var evil = parent.document.cookie;
  }
};

$(function() {
  var resultTemplate = $("#resultTemplate").html();
  var pass = $("#pass"), fail = $("#fail");

  Object.keys(TESTS).forEach(function(testName) {
    var test = TESTS[testName];
    try {
      test();
      fail.append(errorTemplate(testName, test));
    } catch (e) {
      pass.append(errorTemplate(testName, test, e));
    }
  });

  function errorTemplate(name, test, error) {
    return resultTemplate.replace("{name}", name)
                         .replace("{code}", test.toString())
                         .replace("{error}", error);
  }
});
code {
  white-space: pre-wrap;
}

#pass dt {
  color: #12AA33;
}
#pass dt::after {
  content: "✓";
  display: inline-block;
  font-size: 1.25em;
  font-weight: bold;
  margin-left: .25em;
}
#pass dt + dd { display: none; }

#fail dt {
  color: #AA1233;
}
#fail dt::after {
  content: "✘";
  display: inline-block;
  font-size: 1.25em;
  font-weight: bold;
  margin-left: .25em;
}
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<dl id="fail"></dl>
<h2>Looks like we are protected against the following:</h2>
<dl id="pass"></dl>
<script type="test/template" id="resultTemplate">
<dt>{name}</dt>
<dd>Running:
<pre><code>{code}</code></pre>
Resulted in the following:
<pre><code>{error}</code></pre></dd>
</script>

Sean Vieira
  • 159.6k
  • 17
  • 11