michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix: value of var could be undefined when using define:vars (#7134)

Browse source
This commit is contained in:
Alex Vukadinov 2023-05-23 05:28:44 +01:00 committed by GitHub
parent 64d2aba583
commit 5b6a0312a8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/odd-geese-shop.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
value of var can be undefined when using `define:vars`

2
packages/astro/src/runtime/server/render/util.ts
View file

@ -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).replace(
output += `const ${toIdent(key)} = ${JSON.stringify(value)?.replace(
/<\/script>/g,
'\\x3C/script>'
)};\n`;

7
packages/astro/test/astro-directives.test.js
View file

@ -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(4);
expect($('script')).to.have.lengthOf(5);
let i = 0;
for (const script of $('script').toArray()) {
@ -27,9 +27,12 @@ describe('Directives', async () => {
} else if (i < 3) {
// Convert invalid keys to valid identifiers
expect($(script).toString()).to.include('const dashCase = "bar"');
} else {
} else if (i < 4) {
// Closing script tags in strings are escaped
expect($(script).toString()).to.include('const bar = "<script>bar\\x3C/script>"');
} else {
// Vars with undefined values are handled
expect($(script).toString()).to.include('const undef = undefined');
}
i++;
}

4
packages/astro/test/fixtures/astro-directives/src/pages/define-vars.astro vendored
View file

@ -4,6 +4,7 @@ let foo = 'bar'
let bg = 'white'
let fg = 'black'
let bar = '<script>bar</script>'
let undef: undefined;
---
<html>
@ -32,6 +33,9 @@ let bar = '<script>bar</script>'
<script id="inline-4" define:vars={{ bar }}>
console.log(bar);
</script>
<script id="inline-5" define:vars={{ undef }}>
console.log(undef);
</script>
<Title />
</body>