Parser will extract script tags in script tags and bork the parent script

[tbeseda]

Sounds wild, I know. And it's a bit of an edge case.
But if you have a script tag in an element definition, and then in that script tag you have a string that contains an open or close "<script>", the parser gets eager to start extracting scripts.

Here's a sample <my-element> that will blow up in the browser -- server render works, or at least doesn't throw

export default function ({ html }) {
  return html`
    <h1 class="text4 font-mono">my-element</h1>

    <script>
      console.log('start.')

      // this string will trip up the parser
      const someHTML2 = '<script>window.$$ = "$$";</script>'

      console.log('done.')
    </script>
  `
}

and here's a screenshot of what is rendered

[tbeseda]

And if you're wondering how I got here: I have blobs of text (blog posts) that often contain code-like content but are not actually code to be executed.
These blobs are sometimes loaded into an editor in the browser, so I hydrate that content via a top-level script tag like

<blog-editor></blog-editor>
<script>
window.editingBlogPost = `${someStringFromTheDatabase}`
</script>

so I'm not actually authoring a script in a script, it's just string content from the db.

[kristoferjoseph]

Ooh this is a good one!
Thanks for finding it.
I guess my parsing will need to be smarter... or dumber, definitely less greedy.