Closed hobbes7878 closed 6 months ago
This is tricky b/c this text is not prerendered using an innerHTML action...
Can do this to get it back, but I need to test if this is gonna lead to flashes on prod stuff.
<script>
import { building } from '$app/environment';
function setInnerHTML(node, html) {
node.innerHTML = html;
return {
destroy() {
node.innerHTML = '';
},
};
}
</script>
{#if building}
<div>
{@html marked.parse(text)}
</div>
{:else}
<div use:setInnerHTML="{marked.parse(text)}"></div>
{/if}
<style>
div {
display: contents;
}
</style>
OK, it looks like the above workaround doesn't lead to flashes that I can see and still prerenders. It's extra processing time on load, but I don't know have many better ideas at this point.
Idea would be to make a standalone component for markdown text, I suppose, and replace all the @html
refs with it.
Trouble is building
state can't rely on SvelteKit variables, which causes trouble in SREP land where we use Vite alone. Possible solutions, all bad:
building
..
@html
then we've locked SREPs out of live endpoint updates.window
or something??
Sucks, all of these, really..
Noting the main issue tracking this in the Svelte repo: https://github.com/sveltejs/svelte/issues/8213 And a PR worth watching: https://github.com/sveltejs/svelte/pull/9063
Inventory of the components using
@html
tags that will need to be updated to get around this issue:There's a few longstanding issues on the Svelte repo about this, amazingly.
A workaround is to set
innerHtml
with an action, which is what I guess we'll have to do before we can have live updating previews from RNGS.io working..Honestly, amazed this hasn't come up for me before...
Will likely need to scrub all our components for this, but for sure BodyText is first up.