Skip to content

fix: handle multiple snippet parameters with one or more being optional #10833

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

Merged
merged 2 commits into from
Mar 22, 2024
Merged

fix: handle multiple snippet parameters with one or more being optional #10833

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
63f82c9
fix: handle multiple snippet parameters with one or more being optional
dummdidumm Mar 18, 2024
f97dbca
Merge branch 'main' into snippet-types
trueadm Mar 22, 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/slow-plums-chew.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"svelte": patch
---

fix: handle multiple snippet parameters with one or more being optional
5 changes: 4 additions & 1 deletion packages/svelte/src/compiler/phases/1-parse/read/context.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,10 @@ function read_type_annotation(parser, optional_allowed = false) {
const template =
parser.template.slice(0, a).replace(/[^\n]/g, ' ') +
insert +
parser.template.slice(parser.index);
// If this is a type annotation for a function parameter, Acorn-TS will treat subsequent
// parameters as part of a sequence expression instead, and will then error on optional
// parameters (`?:`). Therefore replace that sequence with something that will not error.
parser.template.slice(parser.index).replace(/\?\s*:/g, ':');
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this should be safe, this combination is only relevant syntax-wise for optional parameters, there's nothing that should get invalid anywhere else with regards Acorn-TS parsing this - or am I overlooking something?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While it's pretty odd to break things up in the following way, it doesn't support comments:

const f = (n? // foo
  : number): number => n ?? 0 + 1

const g = (n? /* foo */ : number): number => n ?? 0 + 1

Those are both valid in normal TypeScript, but broken with this solution.

It also still supports invalid parameter orderings, such as the first being optional and the second being required. Not sure if that's a separate issue or one that this aims to fix (if it even is an issue - it might just be the repl not caring).

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking into both the points you made:

  • Supporting comments here would be rare as this is within the template itself – where no one adds comments.
  • The invalid ordering of params isn't such an issue here I don't think. This is something for language tools maybe rather than the parser.

let expression = parse_expression_at(template, parser.ts, a);

// `foo: bar = baz` gets mangled — fix it
Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/tests/runtime-runes/samples/snippet-typescript/_config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { test } from '../../test';

export default test({
html: '1 2 3 4 5'
html: '1 2 3 4 5 6a'
});
4 changes: 4 additions & 0 deletions packages/svelte/tests/runtime-runes/samples/snippet-typescript/main.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,13 @@
{#snippet counter5(c?: number = 5)}
{c}
{/snippet}
{#snippet counter6(c?: number, d?: string)}
{c}{d}
{/snippet}

{@render counter1(1)}
{@render counter2({ c: 2 })}
{@render counter3(3)}
{@render counter4()}
{@render counter5()}
{@render counter6(6, 'a')}