JSFiddle - React, Tailwind, and code Playground

JavaScript

(function() {
  var createSlideWidget, htmlTemplate, preformTest;

    htmlTemplate = [
"<!DOCTYPE html>",
"<html>",
"<head></head>",
"<body>",
"    <article id=\"canvas\">{{{text}}}</article>",
"    <script>",
"      setTimeout(function(){",
	"        window.__rendering.resolve();",
	"      }, 1);",
"    <\/script>",
"</body>",
"</html>"].join('');


  function createSlideWidget(element) {
    var doc, draw, frame;
    frame = $("<iframe>").appendTo(element)[0];
    draw = function(text) {
      return $.Deferred(function(rendering) {
        var d, html;
        d = doc();
        d.open();
        html = htmlTemplate.replace('{{{text}}}', text);
        frame.contentWindow.__rendering = rendering;
        d.write(html);
        return d.close();
      });
    };
    doc = function() {
      return frame.contentDocument || frame.contentWindow.document;
    };
    return {
      draw: draw,
      slideDocument: doc
    };
  };

  preformTest = function(text, next) {
    var $slide, slide;
    $slide = $('<div>').appendTo('body');
    slide = createSlideWidget($slide);
    return (slide.draw(text)).always(function() {
      var textInIframe, _ref;
      textInIframe = (_ref = slide.slideDocument().getElementById('canvas').textContent) != null ? _ref.trim() : void 0;
      console.log("iframe text is " + textInIframe + ", expected " + text);
      $slide.remove();
      return typeof next === "function" ? next() : void 0;
    });
  };

  preformTest("foo", function() {
    return preformTest("bar");
  });

}).call(this);