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

Fix wrong "slot" property warning (runtime) #6065

Merged
merged 3 commits into from
Jun 28, 2021
Merged

Fix wrong "slot" property warning (runtime) #6065

merged 3 commits into from
Jun 28, 2021

Conversation

ZerdoX-x
Copy link
Contributor

@ZerdoX-x ZerdoX-x commented Mar 8, 2021

Repl with error: https://svelte.dev/repl/421c409d2bca424b97d18791f4af4c08?version=3.35.0
When you use slot property on component you get wrong warning.

Before submitting the PR, please make sure you do the following

  • This message body should clearly illustrate what problems it solves.
  • Ideally, include a test that fails without this PR but passes with it.

Tests

  • Run the tests with npm test and lint the project with npm run lint

@ZerdoX-x
Copy link
Contributor Author

Could anyone review this? Tell me if something wrong. This is my first pull request :)

@peopledrivemecrazy
Copy link
Contributor

You are trying to use slot as a prop instead of how the slot is supposed to be used.

https://svelte.dev/repl/d6cc1555cae24c7b97185062e50363d4?version=3.35.0

AFAIK slot needs HTML inside them.

@ZerdoX-x
Copy link
Contributor Author

You are trying to use slot as a prop instead of how the slot is supposed to be used.

@peopledrivemecrazy But in your REPL you are using slot as a regular prop. In REPL that I've provided I am using feature released in svelte some weeks ago.
I want to pass some component as slot's root element for another component.
Before update it was possible only to pass it with redundant wrapper:

<A>
  <span slot="slotname">
    <B />
  </span>
</A>

And now I am trying to use slotted components #1037 like this: (but I get warning)

<A>
  <B slot="slotname" />
</A>

Where slot property is used directly how it supposed to be used.

@ZerdoX-x
Copy link
Contributor Author

I have updated my REPL with real usecase & naming and not just "A" and "B"

@stevenpwaters
Copy link

@peopledrivemecrazy #4556 introduced <Component slot="name" /> as sugar for wrapping the component in the new <svelte:fragment> custom element. There's a pending update to the docs as #6097.

To support this new shorthand pattern while avoiding the warning you'd need to export a (probably unused) slot prop on every component that you may end up using directly in a named slot. I think it's far more desirable for the warning to be disabled for this case, as with this PR.

So +1

@pngwn pngwn added runtime Changes relating to runtime APIs and removed feature: compiler warning labels Jun 27, 2021
Copy link
Member

@dummdidumm dummdidumm left a comment

Choose a reason for hiding this comment

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

@tanhauhau this looks good to me. Could you take one more look and merge if it looks good to you, too?

@tanhauhau tanhauhau merged commit 0df9233 into sveltejs:master Jun 28, 2021
@Conduitry
Copy link
Member

Released in 3.39.0 - thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
runtime Changes relating to runtime APIs
Projects
None yet
Development

Successfully merging this pull request may close these issues.

8 participants