How to prevent sanitization of textarea value attribute in Svelte?

Issue

<textarea value={@html value}></textarea>

Throws an error Unexpected character '@'. How can I prevent sanitization of a value in this case?

Solution

@html is for HTML within an element. Here you do not have to escape/unescape anything, the textarea accepts any HTML, E.g.

<script>
    let value = '<p>Hi</p>';
</script>

<textarea bind:value />

REPL

If you want to render and edit HTML that is another can of worms that requires a regular element like a div and contentEditable. There are many libraries that implement rich text editing.

Answered By - H.B.