Lua image filter, prevent escaping attributes?

[RealTrisT]

In converting markdown to HTML, I'm attempting some progressive image loading and I would like to allow for a fallback mechanism in my image tags. Something like <img src="image.png.thumbnail.jpg" onerror="image.png'" />.

On my script I'm doing this:

if FORMAT:match 'html' then
    function Image (elem)
        elem.attributes.onerror = "this.src='" ..elem.src.. "'"
        elem.src = elem.src .. ".thumbnail.jpg"
        return elem
    end
end

This creates:

<img src="image.png.thumbnail.jpg" onerror="this.src=&#39;image.png&#39;" />

as opposed to

<img src="image.png.thumbnail.jpg" onerror="this.src='image.png'" />

Which of course is not valid JavaScript.
Is there a way to get around this?

Additionally I've also found that pandoc sanitizes all HTML attributes. If I put a whitespace in a width attribute, it'll fail silently and the entire attribute simply won't be present in the output. If I use an attribute name that isn't known to pandoc, it'll append data- to the attribute name. This is all understandable behavior but is there a way to get around it? There are frameworks which use custom attributes, and even something like x- attributes seem to be impossible to currently do because they become data-x-attr.

Thank you.

[cagix]

You amend the properties of the Image element and the HTML writer then creates escaped code.

What happens if you return a RawBlock instead of the Image element, where you assemble the code for the image yourself? In this case there should be no escaping.

[RealTrisT]

It has to be RawInline seen as images are inline element, but yes it's perfect. Frankly I saw RawBlock used in the examples of the documentation and instantly assumed it was LaTeX-only (seen as in the example it was used for inserting LaTeX), need to pay more attention next time. Thank you!

[cagix]

Ah, sorry, RawInline is the correct element in this case. I've been thinking of Figure, which is a block element.

[jgm]

We use blaze-html for the HTML rendering, and it does this escaping, so not easy for us to adjust.
I suppose you could do fallback="image.png", which will render as data-fallback, and then add some JS code that adds the onerror behavior to elements with data-fallback?