* fix: treat snippets like normal components when inferring namespace
* n
* simplify
* better desc
* slight adjustment
* feedback
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feedback
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* skip html tag
* test
* changeset name
* cleanup
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
- widen ownership when getContext is called, part of #10649
- widen ownership when assigning one proxy to another
- skip first 4 stack trace entries and bail if first after that is not a module, hinting at a mutation encapsulated in a .svelte.js file; part of #10649
* feat: improve ssr html mismatch validation
* update types
* Update packages/svelte/src/internal/server/index.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/validate-options.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feedback
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
This has a lot of overhead for large lists, and we can at least diminish in the "no state proxy" case by applying a sensible heuristic:
- If the value passed is a state proxy, read it
- If not, and if the value is an array, then bail because an array of state proxies is highly unlikely
- Traverse the first level of properties of the object and look if these are state, if not bail. State proxies nested further down are highly unlikely, too
part of #10637
It's a warning because even when typing it out and knowing what to do you'll always be in a state where the validation kicks in, and it would be too distracting to always see a compiler error during that short time frame.
closes#10374
People could've done bind:this and called instance methods on the instance - a rare case, but not impossible. This shims $set and $on when in legacy compat mode. $destroy is never shimmed because you shouldn't manually destroy a component, ever, and there's no way to make that work in the new world.
closes#10420
fixes#10271
The prior fix in #10307 wasn't quite right, because JSDom has a difference between window and event.composedPath which sounds like a bug, and a workaround in that PR made it so the test did pass when the bug still occurred. That's also why there isn't a test here, because we can't properly test this using JSDom.
* fix: correctly handle proxied signal writes before reads
* managed
* Update packages/svelte/src/internal/client/proxy.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
fixes#10511
We used the animation frame dance previously where the `$effect` timing was slightly different and did not wait on its children before rerunning. With that changed now everything false into place nicely.
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
The previous `bind_this` implementation had flaws around timing and didn't work correctly when the binding wasn't `$state` in runes mode.
This PR reimplements `bind_this` by aligning it more with how Svelte 4 bindings work, namely reacting to each block context variables updates properly and introducing a mechanism to get the previous binding destination using said variables.
* fix: improve $inspect handling of derived objects
* Update packages/svelte/src/internal/client/runtime.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: remove memory leak
* changeset
* mutable_source is only used in non-runes mode, no need to check here
* simplify
* oops
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: remove readonly validation
The readonly dev time validation results in false-negative object equality checks: The original object is proxified and thus comparisons could be between the unproxified and proxified version, which will always return false. Fixes#10372
There's also the problem that an object could be passed into a component but then passed upwards into shared state. At that point, it should no longer be readonly, but it's not possible to statically analyze these points. Fixes#10372
Lastly, the each block logic mutates an internal array and that also throws errors with the readonly logic. Fixes#10037
* reinstate tests
* track ownership of state and mutations
* working?
* remove old changeset
* tidy
* error
* simplify
* fix
* fix
* fix
* tidy
* make it a warning
* rename test
* remove unused test
* update tests
* slap ts-expect-error everywhere, because its too finicky otherwise
* oops
* oh no the hall monitor is here
* only call add_owner in dev
* only owners can transfer ownership
* simplify
* fixes
* tidy up
* fix type error
* while we're at it
* rename file
* rename functions
* add some comments
* move ownership checking logic
* ugh eslint
* more detailed message
* only add filename in dev
* comment
* update tests
* move more code
* undo change to sourcemap tests
* allow proxy to have multiple owners
* use SignalDebug
* i was doing this all wrong
* tidy up
* implement inheritance
* fix
* tidy up
* update filename stuff
* changeset
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Adjusts the escaping mechanism done for server compilation. For template literals it's now only applied when explicitly told, which is the case for generated literals from the html template. Fixes a bug where a template literal string inside the `@html` tag was wrongfully escaped (https://github.com/sveltejs/svelte/issues/10359#issuecomment-1949678228)
In Svelte 4, scripts inside `@html` were not executed when it was created client-side. This is because `innerHTML = ..` which was used under the hood does not execute scripts due to security reasons. This adjusts the code so the same is true for Svelte 5.
Ensure update methods of actions and reactive statements work with fine-grained `$state` by deep-reading them. This is necessary because mutations to `$state` objects don't notify listeners to only the object as a whole, it only notifies the listeners of the property that changed.
fixes#10460
fixes https://github.com/simeydotme/svelte-range-slider-pips/issues/130
* failing test for :is(...)
* simplify
* trim
* factor out truncate function
* pass stylesheet around
* recurse into :is and :where
* fix types
* fix types
* almost there
* gah so close
* tada
* changeset
* simplify
* feat: nested CSS support (#10491)
* parse nested CSS
* tests
* track parent rules
* some progress
* switch it up
* pruning
* works
* changeset
* lint
* error early on invalid nesting selector
* tidy
* note to self
* fix some specificity stuff
* failing test
* note to self
* fix: correctly scope CSS selectors with descendant combinators (#10502)
* fix traversal, but break some other stuff
* man this is fucken hard
* fixes
* getting closer
* be conservative for now
* tidy
* invert
* invert
* simplify
* switch
* for now
* progress
* i think it works?
* fix
* tidy up
* revert some stuff
* remove some junk
* handle weird cases
* update
* tweak
* shrink
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* Update playgrounds/sandbox/run.js
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: add hydrate method, make hydration treeshakeable
Introduces a new `hydrate` method which does hydration. Refactors code so that hydration-related code is treeshaken out when not using that method.
closes#9533
part of #9827
* get docs building
* ugh
* one more
* Update packages/svelte/scripts/check-treeshakeability.js
Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
* warn
* Update sites/svelte-5-preview/src/routes/docs/content/01-api/05-functions.md
---------
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Add source map merging for preprocessors and get tests passing.
- fixed some issues around the `sources` array where they weren't calculated relative to the input correctly
- adjusted some CSS tests because due to our own CSS parser the AST is less granular, so there are less mappings now. Don't think this is a problem, but worth thinking about
- removed enableSourcemap but only log a warning, the reason this was introduced was to mitigate a bug in Vite which occured when having the source map inlined into the SSR'd output. Since SSR doesn't contain inlined CSS anymore (and if it did, we would omit the source map) the reason for which it was introduced no longer exists
- files without js mapping in it have no source mappings yet (originally added in Svelte 4 for #6092)
* rename $derived.call to $derived.by
* more replacements, plus a compiler error
* regenerate types
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Relax the runtime error to only throw when you're passing a binding with an undefined value. This makes it possible to provide components in a way that can be used more flexibly while keeping the error to guard against the case that we want to avoid: a default value propagation up.
* fix: handle sole empty expression tags
When there's only a single expression tag and its value evaluates to the empty string, special handling is needed to create and insert a text node
fixes#10426
* fix
* need this, too
* Update packages/svelte/src/internal/client/operations.js
---------
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
Closes#9420.
This PR creates an $effect.pre (before beforeUpdate and an $effect (for afterUpdate) and, inside those, listen for all locally declared signals plus reactive props. This does mean that we need to link the locally declared signals to the component context (the reverse of the current behaviour, wherein we link the component context to locally declared signals).
fixes#10296
Also make sure to use the server export conditions when resolving Svelte imports from inside the server compiler output
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
- Previously, any each block parents where used as keys for the sub group. That's wrong, it should only be using each blocks whos declarations contribute to the `bind:group` expression. Fixes#10345
- Only the left-most identifier of the expression was used to determine the binding group. This is wrong, all identifiers within the expression need to be taken into account. Fixes#9947
* fix: don't reuse proxies when state symbol refers to stale value
When somebody copies over the state symbol property onto a new object (you can retrieve the symbol by using `Reflect.ownKeys(...)`), it was wrongfully assumed that it always relates to the current value. This PR adds an additional check that this is actually the case.
This also adds a dev time warning when an object is frozen but contains a state property, which hints at a bug in user land.
fixes#10316
* lint
* rename
* remove warning
* update test
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
* strip typescript assertions before analysis
* add test
* changeset
* move ts handling from transform to before analysis
* format
* types
* remove unwrap_ts_expression
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
* fix: improve unstate handling of non enumerable properties
* Update packages/svelte/src/internal/client/proxy.js
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* give this another try
* fix: lint
* fix: Forgot to save
* feat: it works boiiii
* look, ok, it did work, i just needed to update the snapshots
* bruh
* changeset
* feat: ok I think the client snippet block finally works
* feat: current tests pass; I'm sure I'm missing stuff for new things
* fix: snapshot
* feat: I think non-destructured rest should work now?
* chore: duplicated computation
* feat: Tests (passing and failing
* feat: it's... alive?
* chore: Clean up my messes
* chore: devtime stuff
* fix: fmt
* chore: see if this fixes repl
* chore: make naming more offensive
* fix: Don't throw on missing keys, return undefined as it usually would
* Update packages/svelte/src/compiler/phases/1-parse/state/tag.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/phases/1-parse/state/tag.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: Hopefully default param values now work
* dumb
* types
* feat: Test it
* fix: Turns out javascript parameters are optional
* feat: The Final Solution
* document function
* feat: Better bracket matching, unit tests
* feat: exclude test files from publish
* feat: More unit tests
* feat: Use more efficient parsing for @const
* Update .changeset/curvy-cups-cough.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/package.json
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: changesets
* chore: additional comments
* fix: kill foreach
* fix: foreach again
* feat: Docs
* Revert "fix: kill foreach"
This reverts commit 9a688cc543.
* fix: My own stupidity
* fix: style
* fix - maybe
* Update sites/svelte-5-preview/src/routes/docs/content/01-api/03-snippets.md
* Update tag.js
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
* Update .changeset/curvy-cups-cough.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* chore: Remove rest params
* Delete .changeset/eighty-rivers-wash.md
* fix: Honestly idk why it was broken but it's fixed now
* fix: var name lol
* fix: typegen
* fix: idk
* fix: It looks like a bunch of unformatted shit came in through main?? idk
* Revert "fix: It looks like a bunch of unformatted shit came in through main?? idk"
This reverts commit ab851d5627.
* fix: format again
* this is getting ridiculous
* Update tag.js
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
* fix errors
* simplify a bit
* use read_context
* use read_context for const as well
* remove unused code
* unused import
* unused export
* remove spread args. sorry elliott
* tidy up SnippetBlock interface
* fix test
* simplify
* tweak
* revert example, so that it matches the surrounding text
* move PropsWithChildren back to public.d.ts
* update typing docs, so that it flows from previous example
* temporarily revert const parsing changes, to get prettier working again (???)
* oops
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
If you had `on:` directives listening to the same name (through multiple on:click on the same element or indirectly through multiple `<svelte:window>` elements with event listeners of the same name) there was a bug of delegation firing too often. This PR fixes that by tweaking the "should I continue with the given path index" logic.
fixes#10271
Accessing values might throw errors if they're not just values but getters. Guard against that by try-catching every access so that `$inspect` doesn't fail
fixes the iframe error in the playground reported in #10174
Someone could programmatically add a class to an element and Svelte doesn't see it, so having global be part of a modifier is necessary so that Svelte doesn't mark it as unused
fixes#10210
If a list is passed to a component and an item of that list is passed as a slot prop back up, then mutating a property of that item did not result in a rerun. The reason was that derived is using object identity equality, resulting in the value not being updated. To fix it, we use safe-equals in this situations instead.
* fix: simplify event delegation logic
Only delegate event attributes, and don't take into account bindings/actions while determining that. Never delegate `on:` directives. This simplifies the logic and makes it easier to explain, while avoiding any accidental breaking changes when upgrading from Svelte 4 to 5 without changing code.
Fixes#10165
Related to #9714
* update types
Add recursive check for logic blocks, ignore things such as ConstTags and Comments
closes#10025
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
It's an unnecessary restruction because it can be worked around (hide it behind a getter/setter), already works for bind:x and prevents valid use cases
The validation exists to error on html that would result in the browser repairing it, causing hydration errors. input is never moved, so we can remove it from the array
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
- the objects could contain getters with reactive values, so we play it safe and assume they're always reactive - fixes#10065
- isolate spreads with call expression similar to how we do it with other effects -fixes #10013
When doing `$inspect({ x, y })`, both `x` and `y` are now unstated if they are signals, compared to before where `unstate` was only called on the top level object, leaving the proxies in place which results in a worse debugging experience.
Also improved typings which makes it easier to find related code paths.
closes#9969
this also fixes the following along the way:
the + in nth-of-type(+xn-b) would be parsed as a combinator.
invalid cases like these are not allowed anymore:
b(+/-)b
-ax
-ax-b
-b
closes#10036, this also moves the HTMLDetailsElement toggle event to its interface as it was conflicting with HTMLElement popover toggle event.
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: prevent infinite loops stemming from invalidation method
The logic was flawed: the captured signals where always added to the previous captured no matter what, which meant a) memory leak b) that when another one runs afterwards, it will falsely contain the signals from the previous run
fixes#9788
* fix lint
- Expect the thing that's checked to be wrapped with the proxy already, so that we can just check for the state symbol
- Make error message more descriptive
* WIP
* update tests
* only make readonly in runes mode
* remove this for now
* changeset
* ugh
* add reassignment test
* tweak message
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: add unstate utility function
* Update packages/svelte/src/internal/client/proxy/proxy.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* update docs
* add class support
* oops
* lint
* fix docs
* remove symbol and class support
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
* fix: handle ts expressions when dealing with runes
related to #9639
* docs, more tests
* simplify
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The deleted code ensured that a static variable wouldn't update when it's in the same text expression as a reactive variable. We solved this through emitting a warning about this instead, marking it as undefined behavior.
- doesn't add spread_dynamic_element_attributes when there are no attributes — Unnecessary spread_dynamic_element_attributes call #9646
- skips the child render function altogether if there is nothing to do
If someone has an existing SvelteComponent type definition and using the slot generic to type the default slot, automatically add that slot to the prop type as "children"
The original intent was for typing generation tools like svelte2tsx to use the virtual constructor instead, but it does more harm than good. Most notably, the TS error message when props are wrong becomes completely useless. It's better for tooling to silence the deprecation message and switch over to a new virtual constructor once we remove the deprecated one.
#9589 - add comment and space as reusable templates to save a few bytes. We can definitely take this idea further, but this is a base to iterate from.
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Related to sveltejs/language-tools#2204 / sveltejs/language-tools#2039
The Svelte 5 version of #9486 and #9498
---------
Co-authored-by: Rich Harris <richard.a.harris@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: make DOM operations lazyily init
* cleanup types
* cleanup types
* cleanup types
* Update packages/svelte/src/internal/client/operations.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* single line annotations
* remove unnecessary coercion
* group statements by type
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: address bug in before/after update
fix: address bug in before/after update
* Add changeset
* use every instead of filter - more explicit and enables early-exit from the loop
* Update logic and comment
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
- add event delegation to spread_attributes
- add event attributes to spread
- don't delegate when bindings/actions on the same element in order to preserve backwards compatibility of ordering
- don't hoist identifiers when one of them is used in an event that is not delegateable
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
no two-way binding because setting it involves a `DataTransfer` workaround, so it's not really officially supported that way - if you need that, you shouldn't use that binding probably. This matches the behavior in Svelte 4.
Co-authored-by: Rich Harris <rich.harris@vercel.com>
I came to the conclusion that when we're making up arbitrary types, we might as well keep the old class. That way:
- one less thing to worry about (language tools and other tooling basically can continue to spit out SvelteComponent )
- we can more clearly mark $set , the constructor etc as being deprecated and no longer functioning unless you use that legacy compatibility mode
- much more ergonomic to type for the user:
- const someInstance: SvelteComponent<..> instead of const someInstance: ReturnType<typeof Component<..>>
- If you're using generics, you can do export class MyComponent<T> extends SvelteComponent<{ prop: T }> {} instead of having to type out the whole function in a way that I'm not even sure how to do with generics
* lets see if this works
* fix versions
* sigh
* debugging ci is sooo fun
* oh wow
* fix stuff, changelog, add back readme
* appease prettier
* format stuff
related to issue #9088
it doesn't solve the main problem of dependencies getting invalidated whenever value of a variable gets changed.
but it fixes the behavior difference between the code with and without comments
fixes#9092
---------
Co-authored-by: gtmnayan <50981692+gtm-nayan@users.noreply.github.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
fixes#9185.
I narrowed down the issue to the bug surfacing when we use object properties to update style attributes and directives. This fix removes the size check (because a single object will be of size 1 but can affect n attributes/directives via its properties).
In addition, the order of the OR is switched as the earlier condition has some reactive assignments which are not run in the current order when style_changed_var is truthy.
---------
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Make IntrinsicElements extends SvelteHTMLElements
so it can be extend with declare module
converting to module so it can extend without needing another type alias
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Fixes#2943
The issue linked above invalidates a variable that is not defined in <script> but instead is defined as a let: variable, which does not make sense to invalidate, therefore, this PR exists.
In dev mode, Svelte creates a setter to throw an error noting that you can't set that readonly prop, which resulted in the accessor getting applied twice to the custom element wrapper, causing an error
fixes#8971
This should help everyone who has special needs and use cases around custom elements. Since Svelte components are wrapped and only run on connectedCallback, it makes sense to expose the custom element class for modification before that.
- fixes#8954 / closes#8955 - use extend to attach the function manually and save possible values to a prop
- closes#8473 / closes#4168 - use extend to set the proper static attribute and then call attachInternals in the constructor
- closes#8472 - use extend to attach anything custom you need
- closes#3091 - pass `this` to a prop of your choice and use it inside your component
- add some doc for #8987
When the HTML that is coming from raw html is invalid, the browser reshuffles things. Bail in that case to try to repair more often. Should help with https://github.com/withastro/astro/issues/7557
html tags that could be optimized to use innerHTML in mount ignored any hydration code, which leads to everything getting unmounted and mounted again. This takes the non-optimized path for hydration, too.
fixes https://github.com/sveltejs/kit/issues/10245
fixes#8860
This contains a small but unfortunately unavoidable breaking change: If you used `never` to type that the second parameter of `createEventDispatcher` shouldn't be set or that the action accepts no parameters (which the docs recommended for a short time), then you need to change that to `null` and `undefined` respectively
---------
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>