diff options
| author |  Steffan <40404519+Steffan153@users.noreply.github.com>
| 2023-05-15 00:35:54 -0600 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-05-15 14:35:54 +0800 |
| commit | 914c439bccee9fec002c6d92beaa501c398e62ac (patch) | |
| tree | 3d9ab04c5deb3d786aaa29e016b6702eaad33cd1 | |
| parent | c6b0a6982a85b44a569ee2eb6f53adfc1c180fba (diff) | |
| download | astro-914c439bccee9fec002c6d92beaa501c398e62ac.tar.gz astro-914c439bccee9fec002c6d92beaa501c398e62ac.tar.zst astro-914c439bccee9fec002c6d92beaa501c398e62ac.zip | |
Escape closing script tag when using define:vars (#7044)
4 files changed, 15 insertions, 3 deletions
diff --git a/.changeset/fresh-baboons-switch.md b/.changeset/fresh-baboons-switch.md new file mode 100644 index 000000000..3d5a686f5 --- /dev/null +++ b/.changeset/fresh-baboons-switch.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +Escape closing script tag with `define:vars` diff --git a/packages/astro/src/runtime/server/render/util.ts b/packages/astro/src/runtime/server/render/util.ts index cb96da29f..fcf9ee722 100644 --- a/packages/astro/src/runtime/server/render/util.ts +++ b/packages/astro/src/runtime/server/render/util.ts @@ -43,7 +43,7 @@ export function defineScriptVars(vars: Record<any, any>) { for (const [key, value] of Object.entries(vars)) { // Use const instead of let as let global unsupported with Safari // https://stackoverflow.com/questions/29194024/cant-use-let-keyword-in-safari-javascript - output += `const ${toIdent(key)} = ${JSON.stringify(value)};\n`; + output += `const ${toIdent(key)} = ${JSON.stringify(value).replace(/<\/script>/g, "\\x3C/script>")};\n`; } return markHTMLString(output); } diff --git a/packages/astro/test/astro-directives.test.js b/packages/astro/test/astro-directives.test.js index 7f47ff60f..c4098b4fe 100644 --- a/packages/astro/test/astro-directives.test.js +++ b/packages/astro/test/astro-directives.test.js @@ -14,7 +14,7 @@ describe('Directives', async () => { const html = await fixture.readFile('/define-vars/index.html'); const $ = cheerio.load(html); - expect($('script')).to.have.lengthOf(3); + expect($('script')).to.have.lengthOf(4); let i = 0; for (const script of $('script').toArray()) { @@ -24,9 +24,12 @@ describe('Directives', async () => { if (i < 2) { // Inline defined variables expect($(script).toString()).to.include('const foo = "bar"'); - } else { + } else if (i < 3) { // Convert invalid keys to valid identifiers expect($(script).toString()).to.include('const dashCase = "bar"'); + } else { + // Closing script tags in strings are escaped + expect($(script).toString()).to.include('const bar = "<script>bar\\x3C/script>"'); } i++; } diff --git a/packages/astro/test/fixtures/astro-directives/src/pages/define-vars.astro b/packages/astro/test/fixtures/astro-directives/src/pages/define-vars.astro index 86ec2e32d..993468878 100644 --- a/packages/astro/test/fixtures/astro-directives/src/pages/define-vars.astro +++ b/packages/astro/test/fixtures/astro-directives/src/pages/define-vars.astro @@ -3,6 +3,7 @@ import Title from "../components/Title.astro" let foo = 'bar' let bg = 'white' let fg = 'black' +let bar = '<script>bar</script>' --- <html> @@ -28,6 +29,9 @@ let fg = 'black' <script id="inline-3" define:vars={{ 'dash-case': foo }}> console.log(foo); </script> + <script id="inline-4" define:vars={{ bar }}> + console.log(bar); + </script> <Title /> </body> |