Skip to content

Commit 969e6aa

Browse files
feat: add migration-task for impossible to migrate slots (#13658)
* feat: add `migration-task` for impossible to migrate slots * Update packages/svelte/src/compiler/migrate/index.js Co-authored-by: Paolo Ricciuti <[email protected]> * Update packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte Co-authored-by: Paolo Ricciuti <[email protected]> * Update packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte Co-authored-by: Paolo Ricciuti <[email protected]> * Update packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte Co-authored-by: Paolo Ricciuti <[email protected]> * Update packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte Co-authored-by: Paolo Ricciuti <[email protected]> --------- Co-authored-by: Dominic Gannaway <[email protected]>
1 parent 0dcd4f6 commit 969e6aa

File tree

4 files changed

+99
-0
lines changed

4 files changed

+99
-0
lines changed

.changeset/good-kings-try.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
feat: add `migration-task` for impossible to migrate slots

packages/svelte/src/compiler/migrate/index.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
import { migrate_svelte_ignore } from '../utils/extract_svelte_ignore.js';
1919
import { validate_component_options } from '../validate-options.js';
2020
import { is_svg, is_void } from '../../utils.js';
21+
import { regex_is_valid_identifier } from '../phases/patterns.js';
2122

2223
const regex_style_tags = /(<style[^>]+>)([\S\s]*?)(<\/style>)/g;
2324
const style_placeholder = '/*$$__STYLE_CONTENT__$$*/';
@@ -1082,6 +1083,13 @@ function migrate_slot_usage(node, path, state) {
10821083
is_text_attribute(attribute)
10831084
) {
10841085
snippet_name = attribute.value[0].data;
1086+
if (!regex_is_valid_identifier.test(snippet_name)) {
1087+
state.str.appendLeft(
1088+
node.start,
1089+
`<!-- @migration-task: migrate this slot by hand, \`${snippet_name}\` is an invalid identifier -->\n${state.indent}`
1090+
);
1091+
return;
1092+
}
10851093
state.str.remove(attribute.start, attribute.end);
10861094
}
10871095
if (attribute.type === 'LetDirective') {
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<script>
2+
import Comp from "./Component.svelte";
3+
</script>
4+
5+
<Comp>
6+
<div slot="cool:stuff">
7+
cool
8+
</div>
9+
</Comp>
10+
11+
<Comp>
12+
<div slot="cool stuff">
13+
cool
14+
</div>
15+
</Comp>
16+
17+
<Comp>
18+
<div slot="stuff">
19+
cool
20+
</div>
21+
</Comp>
22+
23+
<Comp>
24+
<svelte:fragment slot="cool:stuff">
25+
cool
26+
</svelte:fragment>
27+
</Comp>
28+
29+
<Comp>
30+
<svelte:fragment slot="cool stuff">
31+
cool
32+
</svelte:fragment>
33+
</Comp>
34+
35+
<Comp>
36+
<svelte:fragment slot="stuff">
37+
cool
38+
</svelte:fragment>
39+
</Comp>
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<script>
2+
import Comp from "./Component.svelte";
3+
</script>
4+
5+
<Comp>
6+
<!-- @migration-task: migrate this slot by hand, `cool:stuff` is an invalid identifier -->
7+
<div slot="cool:stuff">
8+
cool
9+
</div>
10+
</Comp>
11+
12+
<Comp>
13+
<!-- @migration-task: migrate this slot by hand, `cool stuff` is an invalid identifier -->
14+
<div slot="cool stuff">
15+
cool
16+
</div>
17+
</Comp>
18+
19+
<Comp>
20+
{#snippet stuff()}
21+
<div >
22+
cool
23+
</div>
24+
{/snippet}
25+
</Comp>
26+
27+
<Comp>
28+
<!-- @migration-task: migrate this slot by hand, `cool:stuff` is an invalid identifier -->
29+
<svelte:fragment slot="cool:stuff">
30+
cool
31+
</svelte:fragment>
32+
</Comp>
33+
34+
<Comp>
35+
<!-- @migration-task: migrate this slot by hand, `cool stuff` is an invalid identifier -->
36+
<svelte:fragment slot="cool stuff">
37+
cool
38+
</svelte:fragment>
39+
</Comp>
40+
41+
<Comp>
42+
{#snippet stuff()}
43+
44+
cool
45+
46+
{/snippet}
47+
</Comp>

0 commit comments

Comments
 (0)