feat: add support for {@const} inside snippet block (#9904)

* check for snippet block

* change the error msg

* edit tests

* changeset

* test
pull/9899/head
navorite 2 years ago committed by GitHub
parent b0511a5966
commit 55656f520d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -0,0 +1,5 @@
---
'svelte': patch
---
feat: add support for `{@const}` inside snippet block

@ -333,7 +333,7 @@ const compiler_options = {
/** @satisfies {Errors} */
const const_tag = {
'invalid-const-placement': () =>
`{@const} must be the immediate child of {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>`
`{@const} must be the immediate child of {#snippet}, {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>`
};
/** @satisfies {Errors} */

@ -476,6 +476,7 @@ export const validation = {
grand_parent?.type !== 'SvelteComponent' &&
grand_parent?.type !== 'EachBlock' &&
grand_parent?.type !== 'AwaitBlock' &&
grand_parent?.type !== 'SnippetBlock' &&
((grand_parent?.type !== 'RegularElement' && grand_parent?.type !== 'SvelteElement') ||
!grand_parent.attributes.some((a) => a.type === 'Attribute' && a.name === 'slot')))
) {

@ -0,0 +1,16 @@
import { test } from '../../test';
export default test({
html: `<button>0</button>`,
async test({ assert, target }) {
const btn = target.querySelector('button');
assert.htmlEqual(target.innerHTML, '<button>0</button>');
await btn?.click();
assert.htmlEqual(target.innerHTML, '<button>2</button>');
await btn?.click();
assert.htmlEqual(target.innerHTML, '<button>4</button>');
}
});

@ -0,0 +1,10 @@
<script>
let count = $state(0);
</script>
{#snippet counter()}
{@const doubled = count * 2}
<button on:click={() => (count += 1)}>{doubled}</button>
{/snippet}
{@render counter()}

@ -1,7 +1,7 @@
[
{
"code": "invalid-const-placement",
"message": "{@const} must be the immediate child of {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>",
"message": "{@const} must be the immediate child of {#snippet}, {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>",
"start": { "line": 5, "column": 0 },
"end": { "line": 5, "column": 18 }
}

@ -1,7 +1,7 @@
[
{
"code": "invalid-const-placement",
"message": "{@const} must be the immediate child of {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>",
"message": "{@const} must be the immediate child of {#snippet}, {#if}, {:else if}, {:else}, {#each}, {:then}, {:catch}, <svelte:fragment> or <Component>",
"start": { "line": 7, "column": 4 },
"end": { "line": 7, "column": 18 }
}

Loading…
Cancel
Save