🤖 Cannot save fiddle

[SoCuul]

Error code

ERRW:0.7:7323

Were you logged in?

Yes

Your username (if logged in)

SoCuul

Your HTML

<pre id="pre1">
    scene.setBackgroundImage(img``)
    arrow = sprites.create(img``, SpriteKind.Arrow)
    game.splash("Be the quickest to match", "arrow directions to win!")
</pre>

<pre id="pre2">
    gapImage = image.create(2, scene.screenHeight())
    gapSprite = sprites.create(gapImage, SpriteKind.Gap)
    gapSprite.setFlag(SpriteFlag.AutoDestroy, true)
    gapSprite.setFlag(SpriteFlag.Invisible, true)
    gapSprite.vx = -45
    projectile = sprites.createProjectileFromSide(topImage, -45, 0)
    projectile.top = 0
    projectile = sprites.createProjectileFromSide(bottomImage, -45, 0)
    projectile.bottom = scene.screenHeight()
</pre>

Your JavaScript

var makeCodeRenderPre = makeCodeRenderPre || (function () {
    // pre waiting to be rendered
    // when undefined, iframe is loaded and ready
    var pendingPres = [];
    function injectRenderer() {
        var f = document.getElementById("makecoderenderer");
        // check iframe already added to the DOM
        if (f) {
            return;
        }
        var f = document.createElement("iframe");
        f.id = "makecoderenderer";
        f.style.position = "absolute";
        f.style.left = 0;
        f.style.bottom = 0;
        f.style.width = "1px";
        f.style.height = "1px";
        f.src = "https://arcade.makecode.com/--docs?render=1"
        document.body.appendChild(f);
    }

    function renderPre(pre) {
        console.log('render ' + pre.id)
        var f = document.getElementById("makecoderenderer");
        // check if iframe is added and ready (pendingPres is undefined)
        if (!f || !!pendingPres) {
            // queue up
            pendingPres.push(pre);
            injectRenderer();
        } else {
            f.contentWindow.postMessage({
                type: "renderblocks",
                id: pre.id,
                code: pre.innerText
            }, "https://arcade.makecode.com/");
        }
    }

    // listen for messages
    window.addEventListener("message", function (ev) {
        var msg = ev.data;
        if (msg.source != "makecode") return;

        console.log(msg.type)
        switch (msg.type) {
            case "renderready":
                // flush pending requests            				
                var pres = pendingPres;
                // set as undefined to notify that iframe is ready
                pendingPres = undefined;
                pres.forEach(function (pre) { renderPre(pre); })
                break;
            case "renderblocks":
                var svg = msg.svg; // this is an string containing SVG
                var id = msg.id; // this is the id you sent
                // replace text with svg
                var img = document.createElement("img");
                img.src = msg.uri;
                img.width = msg.width;
                img.height = msg.height;
                var code = document.getElementById(id);
                code.parentElement.insertBefore(img, code)
                code.parentElement.removeChild(code);
                break;
        }
    }, false);

    return renderPre;
})();

function renderSnippets() {
    // TODO ADD RENDER LOGIC HERE
    let pres = document.getElementsByTagName("pre");
    Array.prototype.forEach.call(pres, function (pre) {
        makeCodeRenderPre(pre);
    })
}

// load the renderer
renderSnippets();


// message signatures
interface SimulatorMessage {}

interface RenderBlocksRequestMessage extends SimulatorMessage {
    type: "renderblocks",
    id: string;
    code: string;
    options?: {
        package?: string;
        packageId?: string;
        snippetMode?: boolean;
    }
}

interface RenderBlocksResponseMessage extends SimulatorMessage {
    source: "makecode",
    type: "renderblocks",
    id: string;
    svg?: string;
    width?: number;
    height?: number;
}
// message signatures

Your CSS