Workaround for blob as src to iframe in Edge

问题:

I've built a CodePen-like editor that's client side only. It works by letting you edit HTML, JS, and CSS, and then when you click run, it generates a blob and sets some iframe src to that blob.

This works in Firefox(49), Chrome(53), Safari(10) but it doesn't work in Edge

Is there a workaround?

I thought about using a dataURL but according to caniuse that's not supported in Edge either.

var html = `
<h1>hello world</h1>
<gscript src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.2.2/chroma.min.js"></gscript>
<gscript>
document.body.style.backgroundColor = chroma.hsv(Math.random() * 360 | 0, 0.4, 0.8).css();
</gscript>
`;
html = html.replace(/gscript/g, 'script');
var blob = new Blob([html], {type: 'text/html'});
var blobUrl = URL.createObjectURL(blob);
var iframe = document.querySelector("iframe");
iframe.src = blobUrl;

<iframe></iframe>

result in FF/Chrome/Safari

result in Edge (no errors in console either)