diff --git a/client/modules/IDE/components/PreviewFrame.js b/client/modules/IDE/components/PreviewFrame.js index 36d70ceb..e700b291 100644 --- a/client/modules/IDE/components/PreviewFrame.js +++ b/client/modules/IDE/components/PreviewFrame.js @@ -1,6 +1,7 @@ import React, { PropTypes } from 'react'; import ReactDOM from 'react-dom'; import escapeStringRegexp from 'escape-string-regexp'; +import srcDoc from 'srcdoc-polyfill'; // sandbox="allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-modals allow-forms" @@ -59,9 +60,14 @@ class PreviewFrame extends React.Component { const doc = ReactDOM.findDOMNode(this); if (this.props.isPlaying) { // TODO add polyfill for this - doc.srcdoc = this.injectLocalFiles(); + // doc.srcdoc = this.injectLocalFiles(); + srcDoc.set(doc, this.injectLocalFiles()); } else { - doc.srcdoc = ''; + // doc.srcdoc = ''; + srcDoc.set(doc, ''); + doc.contentWindow.document.open(); + doc.contentWindow.document.write(''); + doc.contentWindow.document.close(); } // this.clearPreview(); diff --git a/index.html b/index.html index 3153c672..de2e4106 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,5 @@
- diff --git a/static/srcdoc-polyfill.js b/static/srcdoc-polyfill.js deleted file mode 100644 index 83fc788b..00000000 --- a/static/srcdoc-polyfill.js +++ /dev/null @@ -1,82 +0,0 @@ -(function(root, factory) { - // `root` does not resolve to the global window object in a Browserified - // bundle, so a direct reference to that object is used instead. - var _srcDoc = window.srcDoc; - - if (typeof define === "function" && define.amd) { - define(['exports'], function(exports) { - factory(exports, _srcDoc); - root.srcDoc = exports; - }); - } else if (typeof exports === "object") { - factory(exports, _srcDoc); - } else { - root.srcDoc = {}; - factory(root.srcDoc, _srcDoc); - } -})(this, function(exports, _srcDoc) { - var idx, iframes; - var isCompliant = !!("srcdoc" in document.createElement("iframe")); - var implementations = { - compliant: function( iframe, content ) { - - if (content) { - iframe.setAttribute("srcdoc", content); - } - }, - legacy: function( iframe, content ) { - - var jsUrl; - - if (!iframe || !iframe.getAttribute) { - return; - } - - if (!content) { - content = iframe.getAttribute("srcdoc"); - } else { - iframe.setAttribute("srcdoc", content); - } - - if (content) { - // The value returned by a script-targeted URL will be used as - // the iFrame's content. Create such a URL which returns the - // iFrame element's `srcdoc` attribute. - jsUrl = "javascript: window.frameElement.getAttribute('srcdoc');"; - - iframe.setAttribute("src", jsUrl); - - // Explicitly set the iFrame's window.location for - // compatability with IE9, which does not react to changes in - // the `src` attribute when it is a `javascript:` URL, for - // some reason - if (iframe.contentWindow) { - iframe.contentWindow.location = jsUrl; - } - } - } - }; - var srcDoc = exports; - // Assume the best - srcDoc.set = implementations.compliant; - srcDoc.noConflict = function() { - window.srcDoc = _srcDoc; - return srcDoc; - }; - - // If the browser supports srcdoc, no shimming is necessary - if (isCompliant) { - return; - } - - srcDoc.set = implementations.legacy; - - // Automatically shim any iframes already present in the document - iframes = document.getElementsByTagName("iframe"); - idx = iframes.length; - - while (idx--) { - srcDoc.set( iframes[idx] ); - } - -});