JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <script>
            function createIframe(win) {
                console.log('foo', win.foo);
                var width = 300;
                var height = 250;
                var id = 'ifr';
                var src = '';
                var iframeTemplate = '<iframe id="'+id+'" src="'+src+'" width="'+width+'" height="'+
                    height+'"  marginheight="0" marginwidth="0" scrolling="NO" frameborder="0"></iframe>';
                win.document.write(iframeTemplate);
                var iframe = win.document.getElementById(id);
                console.log('foo', win.foo);
                if (iframe) {
                    var doc = iframe.contentWindow.document;
                    doc.write('<html><head></head><body><script>console.log("foo on parent", window.parent.foo);</scr'+ 'ipt></body></html>');
                    doc.close();
                } else {
                    console.log('Failed to create an iframe');
                }
            }
            window.foo = 'bar';
            setTimeout(function() {
                createIframe(window);
            }, 3000);
            
        </script>
    </body>
</html>