sveltejs
<style> tags are broken in the repl
Example: https://svelte.technology/repl?version=1.57.2&gist=0dab08ad8f496bd94dc2f9b6ffbfb8fd
Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.`
It's nothing to do with Svelte itself, you can go back a bunch of versions and the error still pops up.
Seems to be related to having a <style> tag and also having a high unicode character in there (even in a comment), which is most peculiar. Having one or the other is fine.
I would guess this is to do with sourcemaps somehow — btoa is used to encode mappings as base64. The offending character appears to be the em-dash in the comment
Ok, so I've looked into this and it's a bit of a pain. The issue is that MagicString needs to encode strings as base64 — in Node, it uses Buffer...
const btoa = str => new Buffer(str).toString('base64')
...whereas in the browser it uses btoa. Until today I thought they had the same behaviour, but it turns out btoa can't handle characters outside Latin1.
I think a possible solution would be to generate a Blob URL in the browser instead of a base64 one. In the meantime, I'll remove the em dash from the comment so that people are less likely to hit this bug.
it turns out btoa can't handle characters outside Latin1.
Good to know! Would you mind sharing the source where you learned that?
