Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add migration-task for impossible to migrate slots #13658

Merged
merged 6 commits into from
Oct 18, 2024
Merged

feat: add migration-task for impossible to migrate slots #13658

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b0e6946
feat: add `migration-task` for impossible to migrate slots
paoloricciuti Oct 17, 2024
56a4c19
Update packages/svelte/src/compiler/migrate/index.js
trueadm Oct 18, 2024
320bfb4
Update packages/svelte/tests/migrate/samples/slot-non-identifier/outp…
trueadm Oct 18, 2024
7918612
Update packages/svelte/tests/migrate/samples/slot-non-identifier/outp…
trueadm Oct 18, 2024
827e546
Update packages/svelte/tests/migrate/samples/slot-non-identifier/outp…
trueadm Oct 18, 2024
d7fa2e6
Update packages/svelte/tests/migrate/samples/slot-non-identifier/outp…
trueadm Oct 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/good-kings-try.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

feat: add `migration-task` for impossible to migrate slots
8 changes: 8 additions & 0 deletions packages/svelte/src/compiler/migrate/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import {
import { migrate_svelte_ignore } from '../utils/extract_svelte_ignore.js';
import { validate_component_options } from '../validate-options.js';
import { is_svg, is_void } from '../../utils.js';
import { regex_is_valid_identifier } from '../phases/patterns.js';

const regex_style_tags = /(<style[^>]+>)([\S\s]*?)(<\/style>)/g;
const style_placeholder = '/*$$__STYLE_CONTENT__$$*/';
Expand Down Expand Up @@ -1045,6 +1046,13 @@ function migrate_slot_usage(node, path, state) {
is_text_attribute(attribute)
) {
snippet_name = attribute.value[0].data;
if (!regex_is_valid_identifier.test(snippet_name)) {
state.str.appendLeft(
node.start,
`<!-- @migration-task: migrate this slot by hand, \`${snippet_name}\` is an invalid identifier -->\n${state.indent}`
);
return;
}
state.str.remove(attribute.start, attribute.end);
}
if (attribute.type === 'LetDirective') {
Expand Down
39 changes: 39 additions & 0 deletions packages/svelte/tests/migrate/samples/slot-non-identifier/input.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<script>
import Comp from "./Component.svelte";
</script>

<Comp>
<div slot="cool:stuff">
cool
</div>
</Comp>

<Comp>
<div slot="cool stuff">
cool
</div>
</Comp>

<Comp>
<div slot="stuff">
cool
</div>
</Comp>

<Comp>
<svelte:fragment slot="cool:stuff">
cool
</svelte:fragment>
</Comp>

<Comp>
<svelte:fragment slot="cool stuff">
cool
</svelte:fragment>
</Comp>

<Comp>
<svelte:fragment slot="stuff">
cool
</svelte:fragment>
</Comp>
47 changes: 47 additions & 0 deletions packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<script>
import Comp from "./Component.svelte";
</script>

<Comp>
<!-- @migration-task: migrate this slot by hand, `cool:stuff` is an invalid identifier -->
<div slot="cool:stuff">
cool
</div>
</Comp>

<Comp>
<!-- @migration-task: migrate this slot by hand, `cool stuff` is an invalid identifier -->
<div slot="cool stuff">
cool
</div>
</Comp>

<Comp>
{#snippet stuff()}
<div >
cool
</div>
{/snippet}
</Comp>

<Comp>
<!-- @migration-task: migrate this slot by hand, `cool:stuff` is an invalid identifier -->
<svelte:fragment slot="cool:stuff">
cool
</svelte:fragment>
</Comp>

<Comp>
<!-- @migration-task: migrate this slot by hand, `cool stuff` is an invalid identifier -->
<svelte:fragment slot="cool stuff">
cool
</svelte:fragment>
</Comp>

<Comp>
{#snippet stuff()}

cool

{/snippet}
</Comp>