feat: better dynamic component css props

[paoloricciuti]

Svelte 5 rewrite

Closes #11788

Marking momentarily as draft because i need to

• remove the unused node from component
• fix broken tests
• write new tests

Please note that the Svelte codebase is currently being rewritten for Svelte 5. Changes should target Svelte 5, which lives on the default branch (main).

If your PR concerns Svelte 4 (including updates to svelte.dev.docs), please ensure the base branch is svelte-4 and not main.

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

• It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
• Prefix your PR title with feat:, fix:, chore:, or docs:.
• This message body should clearly illustrate what problems it solves.
• Ideally, include a test that fails without this PR but passes with it.

Tests and linting

• Run the tests with pnpm test and lint the project with pnpm lint

[changeset-bot]

🦋 Changeset detected

Latest commit: 01e8afb

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
svelte	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[paoloricciuti]

I'm not sure what kind of test is needed here....this is about the output but i remember we don't want to overdo tests on the compiler output right?

[dummdidumm]

Was confused by this deletion, and checked the current Svelte 4 REPL once more:

• when this is falsy initially, there's a div
• but if it's switching truhy from to falsy, then it will remove the wrapping div

--> feels like a bug in Svelte 4
--> what does this say about this change? Can we do this change after all, or not? I think having it falsy initially is very rare, so very few people would've run into this bug before. Always having the div might catch people's CSS selectors offguard.

[paoloricciuti]

I actually changed this to check that the div doesn't have a firstElementChild. But your reasoning still applies. That said i think the situations where this can trip people are the same where the component is actually there (more or less) which might be a bit more now that :has it's a bit more standard but shouldn't be that much because it's just if you are writing css based on the fact that a certain element follow another.

[paoloricciuti]

Could it be worth passing the component to css_props to allow css_props to check for is thrutyness? And by that i mean literally the component that would be rendered...so for a normal component it would just be the component itself, for SvelteComponent the argument of this

[Rich-Harris]

I'm inclined to ignore the falsy <svelte:component> edge case. As noted, it's already buggy (and to my knowledge no-one has encountered this bug in the wild), and even if it wasn't, the cases where your styles are affected by the presence of an unexpected <div style="display: contents"> with no children are vanishingly rare and easily worked around.

In other words I think it's fine to always have the wrapping div

[Rich-Harris]

thanks!