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.

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

Svelte 5: Implicit children not detected correctly #2211

Closed
eddiemcconkie opened this issue Nov 22, 2023 · 2 comments
Closed

Svelte 5: Implicit children not detected correctly #2211

eddiemcconkie opened this issue Nov 22, 2023 · 2 comments
Labels
bug Something isn't working Fixed Fixed in master branch. Pending production release.

Comments

@eddiemcconkie
Copy link

Describe the bug

If I have a Parent.svelte component that has a children prop, passing children to the component implicitly (without the {#snippet children()} block) I get the error Property 'children' is missing in type '{}' but required in type '{ children: () => void; }'.
If I put the children inside a {#snippet children()} block then the error goes away

Reproduction

REPL (Error won't show up in the REPL, you may need to copy it over to VS Code)

Expected behaviour

Implicit children get detected correctly

System Info

  • OS: MacOS
  • IDE: VSCode

Which package is the issue about?

No response

Additional Information, eg. Screenshots

image

Not directly related to the bug, but I'm wondering if Svelte is going to provide some sort of Snippet type helper. For the time being, I'm using this:

type Snippet<T extends any[] = []> = (...args: T) => void;

// No parameters
type Children = Snippet // becomes () => void
// Parameters
type Row = Snippet<[item: T]> // becomes (item: T) => void

It's not really shorter than just writing out the actual function type, but it makes it more obvious which props are snippets and which aren't when typing $props

@eddiemcconkie eddiemcconkie added the bug Something isn't working label Nov 22, 2023
@dummdidumm
Copy link
Member

dummdidumm commented Nov 22, 2023

A snippet helper will be added in the next release, and language tools will error if you don't use it to type the snippet props (at the @render location) sveltejs/svelte#9584

@eddiemcconkie
Copy link
Author

@dummdidumm That's great! I didn't realize until now that snippets can't take more than one argument. Looks like my type helper was a little over-engineered 😅

@dummdidumm dummdidumm added the Fixed Fixed in master branch. Pending production release. label Nov 24, 2023
dummdidumm added a commit that referenced this issue Nov 24, 2023
- pass children to zero types Svelte 5: +layout.svelte children not included in zero-effort type safety #2212
- add possibility to pass in version to svelte2tsx to differentiate transpiler targets
- add implicit children prop in Svelte 5 mode Svelte 5: Implicit children not detected correctly #2211
- add best-effort fallback typings to $props() rune
- hide deprecation warnings in generated code Svelte 5: Typescript generics in components are marked as deprecated svelte#9586
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working Fixed Fixed in master branch. Pending production release.
Projects
None yet
Development

No branches or pull requests

2 participants