How to inject html content inside the Elm 0.19 app


we have a dashboard built in elm 0.19 (about 64k loc) and now we need to preview some html content (like email previews) and show them in the Dashboard.

We need to inject html somehow in the dashboard, but I think is not possible to alter the DOM adding external HTML code is it?

We can only think on implementing this in the backend and create links to be opened in new tabs to show the content, but it will hurt us a lot in terms of UX.

Do you know a better way to do this? Is it possible at all?

Thank you!

The main issue with this idea is the XSS attacks. You can read more here

Also there is a gist with a proposal to workaround the feature if you still want.

Thanks! I’ll have a look

The safe way to do it is to send the HTML as a string and parse that into elm/html structure using something like html-parser.

Another way to do it is using a web component like this.


Thanks @pdamoc, I didn’t know html-parser was available for elm 0.19.

We will evaluate the possible solutions, thanks a lot!

If you are feeling brave enough, you can work around the checks in the Elm runtime by adding a react-style dangerouslySetInnerHTML attribute by monkey patching the HTMLElement class:

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.