* feat: migrate `svelte:self`
* chore: regenerate types
* fix: special case `<svelte:self></svelte:self>`
* chore: add special case to tests
* chore: add no filename test
* chore: better migration task message
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* chore: make filename an options object to futureproof it
* chore: simplify open tag `svelte:self`
* chore: simplify migration comment test
* chore: generate types
* chore: apply smart suggestion
* chore: changeset
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feat: enable snippets to fill slots
This allows people to use snippets to fill slots. It is implemented in the same way the default slot interop is already implemented, by passing a boolean to the hidden `$$slots` object, and using that at runtime to determine the correct outcome. The impact on bundle size is neglible.
By enabling this, we can enhance our migration script to always transform slot usages (including `let:x` etc) to snippets. This wasn't possible before because we couldn't be sure if the other side was transformed to using render tags at the same time. This will be part of #13419. This is important because currently the migration script is transforming `<slot />` creations inside components, but since it's not touching its usage points the migration will make your app end up in a broken state which you have to finish by hand.
This is a reduced alternative to, and closes#11619, which was also enabling the other way around, but that is a) not as necessary and b) more likely to confuse people / break, because it only works if your render function has 0-1 arguments.
* unused
* ditto - annotation is redundant
* couple of drive-by consistency tweaks
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: allow combinator at start of nested CSS selector
Solved by moving the combinator positioning validation into the analysis phase
Fixes#13433
* highlight the combinator, not the start of the combinator
* fix
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: fix accessors and support migration of accessors
* fix: exclude slots
* fix: remove call to proxy for accessors props
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* chore: add test for accessors
* chore: fix lint
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feat: allow migration of `svelte:component`
* chore: simplify a lot (thanks @dummdidumm)
* chore: update output
* chore: use `next()` and `snip` instead of walking the AST
* fix: migrate nested `svelte:component`
* Update .changeset/good-vans-bake.md
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
the code to compose together the instance was getting a bit messy because we were trying to add stuff all in the same place if there was no script or one by one if there was one. I changed this a bit by using an insertion_point variable that we can set to then insert stuff sequentially.
Fixes#13390
There's pruning logic in a different place where all unused selectors are commented out. If all selectors are unused, the whole prelude is commented out, resulting in invalid syntax. This is a case that shouldn't happen, therefore simplify the whole "is used" logic to only look at the prelude.
- add a comment to lone script tags to ensure there's always a parent so we can synchronously call the replace function
- always call the replace function, not just on the first call
fixes#13378
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
* fix: migrate events to be more inline with svelte 4
* fix: use function instead of action
* chore: generate types
* re-export event modifier substitutes
* chore: replace map with object
* fix: handle nullish values
* fix: use bubbler for delegated events
* chore: generate types
* chore: deprecate legacy stuff
* chore: damn type generations
* fix: implement bubble on props strategy
* chore: revert bubble as prop init but keep fix for restProps
* fix: use `passive` and `nonpassive` actions for `passive` and `nonpassive` modifiers
* chore: i swear i will setup a commit hook for generating types
* chore: update output
* tweak passive/nonpassive types to make them more compact and show up as deprecated
* make terminology more consistent with other places
* eat local, shop local, declare local
* unify name replacement stuff
* remove errant newline
* ensure modifier order is stable and matches svelte 4
* fix
* compute indent once
* joining without newlines seems to work better in common cases
* replace passive/nonpassive handlers in situ
* unused
* simplify
* simplify, remove errant spaces
* only import handlers when necessary
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: set strings as attributes, non-strings as properties if property exists
* simplify
* remove draggable from list, no longer needed
* in fact we dont need the lookup at all
* lint
* beef up test
* correctly SSR translate attribute
#13225 did not fully fix the described issue: As soon as you have a child component, that child component's anchor will not be in the right ownerDocument yet, and so the logic falls down.
To fix that, we would need to move the ownerDocument check into the microtask - and that map check was mainly done to avoid just that. So instead I opted to simplify the code and just remove the map checks. According to my benchmarking (https://jsbench.me/3hm17l0bxl/1) this has no impact on performance assuming that you'll have cache hits roughly half the time - and even if you'd have much more cache hits, the performance loss is microscopic. Given that the default mode is to not inject styles, this will not be common anyway, so I favor removing that map.
* fix: separate `template_effect` for dynamic class/style directive with dynamic attributes
* fix: only move to `init` if it `has_call`
* fix: initialize spread `needs_isolation` based on if there are directives with `has_call`
* fix: revert splitting templates and generate deriveds instead
* small tweaks
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: ensure function calls to identifiers are made reactive
* update test
* we have has_local at home
* add note
* make it a TODO
* Update .changeset/red-ladybugs-turn.md
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: escape more template-literal-related characters
Escape `{` at the start of a string, because it could be preceeded by a `$`, which in combination loads to the following characters being treated as a value
Fixes#13258
(used the opportunity to merge closely-related tests into one)
* sanitize template strings once assembled (#13263)
* only sanitize template quasis once assembled
* changeset
* remove old changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Our current validation was both too lax and too strict:
- too strict, because you can define a `$` variable in Svelte 4 if it's not at the top level
- too strict, because you can define `$`-prefixed function parameters, but not give the parameter the name `$`
- too lax, because you can define a `$`-prefixed variable if you're at least one level deep into a function. In runes mode, this should be an error
This PR aligns the behavior, ensures this isn't a breaking change in legacy anymore, and makes the validation in runes mode more strict
* fix: follow spec for `customElement` option
* tweak messages, add link to details that will be included on future docs site
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
This adds a new dev-time only `dev_effect_stack` variable, which executed effects are pushed to and eventually cleared out after everything's settled. If it doesn't settle however, i.e. you run into an infinite loop, the last ten effects are printed out so you get an idea where the error is coming from.
For proper source mapping I also had add location info to the generated effects.
Closes#13192
Fixes#13162
We were going from parentNode to parentNode but if something is a slot of a custom element we should first go to the assignedSlot or else the inside of the custom element will be skipped.
---------
Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
fixes#13194
We narrowed the allowed characters in #13057, but didn't take into account all possible (and for JavaScript identifiers allowed) unicode characters. This widens that, which also removes the accidental breaking change (because in Svelte 4 you were allowed to use these unicode characters).
Fixes#13203
The problem is that we were checking for NestingSelectors only in the selectors of the immediate child of the selectors. Since Nesting could be in selectors like :is or :where or :has that can also be nested i think we need to walk the selectors to find if there's a selector or not.
Fixes#13187. This ensures that we update the local fallback value in the case where the fallback is used so that we persist local changes to bindable props. Otherwise, any incoming changes from the outside will reset the incoming value back to the old fallback value.
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Fixes#13146.
Sync effects are not possible with Svelte 5's push-pull system because they can make can break the reactive graph – which is also why we don't permit writes within a derived too. The same problem is occurring here, as inspect effects are run sync – they are actually happening as part of an existing derived – which means they're a bit like writes in a derived and can cause tearing to the reactive signal graph. To avoid this we can call flushSync just before invoking these effects, as that should ensure the graph is made consistent again.
Also another issue I found was that we don't "reset" the inspect_effects Set when we enter a derived – which we should as a derived can create it's own local state that should have no bearing on the parent inspect effect.
Add a new visitor to the "strip TS AST" logic. Strictly speaking this results in incorrect ASTs but esrap, our printer, just ignores them at those positions, so we can do that.
An alternative would be to adjust zimmerframe to be able to return something to say "delete this node"
Fixes#13173
In case of something like `foo = bar.map(...)`, foo would have ownership
of the array itself, while the individual items would have ownership
of the component that created the proxy. That means if we later do
`foo[0].baz = 42`, we could get a false-positive ownership violation,
since the two proxies are not connected to each other via the parent
relationship. For this reason, we need to widen the ownership of the
children upon access when we detect they are not connected.
Fixes#13137
Fixes#13174. Turns out that we we skipping this important work because we return true early – thus not connecting the unowned derived back to the reaction.
We have a `run_scripts` function which is invoked in case a template block contains a script tag, and that function replaces the script tags (so that they actually run). If such a script tag is first or last in the template, the replacement is not picked up by our `node.first_node/last_node` logic anymore, and so it contains a stale tag. That means on cleanup the remove logic fails. In the case of the referenced issue, it just runs past the script tag till the very end of the head, removing the just added style tag from the new page.
Fixes#13086
part of #11502 - to close it completely, we also need to look at using and possibly implement heuristics within bundler plugins to give more details
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
* fix: ensure signal status is set in legacy mode
fixes#13051
* add (failing) test
* alternative fix
* add changeset
* alternative fix
* add comment
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Dominic Gannaway <dg@domgan.com>
* simplify some parser logic, improve some compiler errors
* move logic into visitors
* more
* turns out we're doing a bunch of unnecessary work on closing tags
* tidy up
* changeset
* lint
This makes it possible to slow them down using dev tools, and overall ties the implementation more closely to WAAPI, which is good. Also fixes#12730 (all four cases, css, tick, css+tick, neither are now supported) and fixes#13019 (passed empty fallback object)
---------
Co-authored-by: Matei Trandafir <matei_trand@yahoo.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
This also flagged a few places where we were doing things wrongly (createRawSnippet validation of render function was buggy, we had an unnecessary console.trace which duplicated the existing trace in the warning, and the parent/child SSR element state was getting corrupted when unrelated errors happened). The fact that the test output now looks a lot cleaner is just a nice bonus
* fix: repair `href` attribute mismatches
The reasoning in #9662 turns out to be false: While it's true that the href would resolve to the same URL on the initial page, once you're doing a client-side navigation to a URL at a different depth, the relative path would now point to the wrong location. Therefore we need to repair href hydration mismatches
fixes https://github.com/sveltejs/kit/issues/12254
* remove test
* Revert "remove test"
This reverts commit fa43304329.
* fix test
* remove comment, since the rationale for skipping the attributes in question is covered by the one immediately below
* fix
* add test for <a> specifically
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: cleanup repo configs
- remove prettier from packages, everything runs through the root now (also better aligns with how you work with it in VS Code: no more config duplication needed)
- remove eslint from packages, run it once through the root now (revealed some inconsistencies and missing stuff, config tightened up as a result) (bump eslint while we're at it)
* update vite and related packages (since rollup includes an addition to one estree node we need to adjust code a bit)
* bump more packages
* bump jsdom
* lint
* feat: allow non-synchronous legacy component instantiation
Add a new option to the legacy class component interface so that `flush_sync` can be omitted. Part of https://github.com/sveltejs/kit/issues/12248
* lint
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: ensure $inspect works with SvelteMap and SvelteSet
* build
* dev only
* dev only
* lint
* lint
* lint
* alternative
* Update packages/svelte/src/reactivity/map.js
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: more robust handling of var declarations
- fixes#12807: state declared with var is now retrieved using a new `safe_get` function, which works like `get` but checks for undefined
- fixes#12900: ensure we're not creating another new scope for block statements of function declarations, which resulted in var declarations getting "swallowed" (because they were hoisted to the function declaration scope and never seen by our logic)
* simplify
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The backing store variable of a $store read could be a variable that itself needs a transformer, which is why we need to make accessing the reads lazy
fixes#12859
* breaking: deprecate `context="module"` in favor of `module`
Also reserve a few attributes, which we may or may not use in the future
closes#12637
* fix tests
* one more
* add svelte package to the root so eslint and prettier can use it
* tweak messages
* warn on unknown attributes
* regenerate
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: adds $state.link rune
* add tests
* types
* docs
* debugger
* lint
* Update .changeset/friendly-rice-confess.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/phases/2-analyze/index.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* feedback
* feedback
* feedback
* feedback
* rename link_state to linked_state for grammatical consistency
* oops, victim of find-replace
* no need to store linked_value if setting
* simplify tests
* test behaviour of objects
* update docs
* copy
* more direct example that shows unlinking and relinking
* add callback argument support
* fix
* tidy up
* document callback
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: treat tag with `[` as a component, even if lowercase
* chore: simpler regex
Co-authored-by: Conduitry <git@chor.date>
* feat: error on invalid component name
* fix: fully revert dot notation test
* tweak error message
---------
Co-authored-by: Conduitry <git@chor.date>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* step one
* WIP
* more
* fix
* collapse sequential sibling calls
* working
* working but messy
* tidy up
* unused
* tweak
* tweak
* tidy
* tweak
* tweak
* revert
* changeset
* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* revert this bit
* align
* comments
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* chore: use closures for state proxies
* use variables
* early return
* tidy up
* move ownership stuff into separate object
* put original value directly on STATE_SYMBOL
* rename
* tidy up
* tidy
* tweak
* fix
* remove is_frozen check
* remove `$state.is`
* avoid mutations
* tweak
* changesets
* changeset
* changeset
* regenerate
* add comment
* add note
* add test
* fix: avoid throwing `store_invalid_subscription_module` for runes
Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
* move test to the validator suite, which is faster
---------
Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: add compiler error when encountering a $-prefixed store value outside a .svelte file
* add fromState/toState APIs
* another test, update types
* rename fromState to toStore, and toState to fromStore
* docs
* add docs
* separate client/server entry points for svelte/store
* fix: provide more hydration mismatch coverage
* tweak
* add test for safari borking stuff
* fix
* fix windows test
* failing test
* oops
* revert playground changes
* simplify
* template content hydration logic should really be separate from reset logic
* actually the test is incorrect, and now i cant seem to recreate what i saw before... hmm
* update comment to no longer mention templates
* failing test
* delete test for now
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* speed up exclude_from_object
* changeset
* convert prop names to string at compile time
* faster still
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: add warning for derived self referencin
* update build
* address feedback
* address feedback
* build
* messages shouldn't end with a period
* simplify test
* regenerate
* newlines are free
* no need to export this, we can move it closer to where it's used
* fix double negative
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* simplify
* fix/simplify
* fix/simplify
* start getting a grip of this mess
* tidy up
* more
* more
* more
* tidy up
* make things a bit less weird
* tweak
* more
* more
* add once once
* consolidate event handling code
* some progress. man, this stuff is entangled
* more
* tidy up
* simplify
* simplify
* more
* fix
* fix test names
* fix a bug
* tidy up
* changeset
* simplify
* regenerate
* tidy up
* tidy up
* tidy up
* simplify
* the module declaration case is already accounted for, above
* simplify/document
* typo
* "hoistable" is a misnomer
* hoist non_hoistable, rename
* more typos
* tweak
* regenerate
* fix: add css hash to custom element rendered with `svelte:element`
* simplify
* skip arg where possible
* drive-by improvements — remove some unnecessary arguments where possible
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: function called as tagged template literal is reactively called
Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
* chore: re-organize import of visitors
* simplify
---------
Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: allow nested `<dt>`/`<dd>` elements if they are within a `<dl>` element
This introduces a resets array, which means descendants that are forbidden are allowed again, if an element within the resets array is encountered between the tag and the forbidden descendant
fixes#12676
* better name
* start moving visitors into separate modules
* remove unused code
* more
* more
* tidy up
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* alphabetize
* more
* fix
* more
* more
* consolidate
* more
* more
* more
* more
* more
* more
* more
* tweak
* more
* more
* more
* more
* more
* more
* more
* more
* more
* more
* jfc what are we doing here
* more
* bizarre
* more
* more
* more
* more
* more
* more
* tidy
* one down
* dont merge
* hmm
* DRY
* more
* more
* tidy up
* tidy up
* add changeset, as this should have its own release
* tidy up
* oh i should probably hit save
* feat: make `<svelte:component>` unnecessary in runes mode
In Svelte 4, writing `<Component />` meant that the component instance is static. If you made the variable `Component` a reactive state variable and updated the component value, the component would not be reinstantiated with the new value - you had to use `<svelte:component>` for that. One reason was that having a dynamic component was more overhead, which is no longer the case in Svelte 5. We can therefore reduce the potential API surface area (by maybe deprecating `<svelte:component>` in the future) by allowing Svelte to recognize when a component variable is potentially dynamic. It turned out that this was already mostly the case. This PR fixes one case where it wasn't, and fixes another where this was wrongfully applied in legacy mode.
* we already have this function
* add interactive demos
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
language tools has to type its own shape for backwards compatibility, and it currently doesn't include the `$on` and `$set` methods, which means without widening the type as done here you would get a "this shape is not accepted" type error when passing it to `ComponentProps`
closes#12627
Adds a compiler warning that warns about legacy component instantiation (i.e. using `new Component(..)`). This won't catch all cases, but the most obvious ones which probably make up ~80%
Now that we've made `mount` and `hydrate` not call `flushSync` anymore, we can go back to using `queue_microtask` inside `#await`, which means people who want to synchronously see the pending block can do so using `flushSync` (as validated by our tests). This essentially reverts #12274
Closes#12643
Very weird behaviour from the draggable setter...if you set element.draggable="false" it will actually set draggable to true (the boolean).
* chore: tweak html tree validation
- relax validation in some places where we know the HTML will not break or only break when using SSR
- consolidate validation in one place and for better reuse, which results in more cases getting caught at runtime
closes#11941
* move more of the validation into more descriptive record
* obselete / incorrect (those are not autoclosed, and the invalid ones handled later)
* typo
* backticks
* update tests
* Update packages/svelte/messages/compile-errors/template.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/messages/compile-warnings/template.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* better code generation for slot props in SSR
* simplify
* remove getters mechanism from server compiler
* changeset
* no need to use getters in SSR mode
* fix comment
* fix: ensure dynamic event handlers are wrapped in a derived
* fix test
* feedback
* more feedback
* address feedback
* we have .svelte.js files
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: bail-out of hydrating head if no anchor is found
* add failing test
* fix
* fix comment
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* add invalid_default_snippet error message
* fix: improve validation error that occurs when using `{@render ...}` to render default slotted content
* cheeky hack to keep treeshakeability until we can nuke this validation altogether
Previously, if transitions/animations were playing in quick succession, overlapping each other, it could have disastrous outcomes, leading to elements jumping all over the place.
This PR gets that into much better state (not completely fixed, but close) by applying a few fixes:
- destructure style object from `getComputedStyles`, because it's a live object with getters and we're interested in the fixed values at the beginning
- `unfix` for animations didn't reset the transition styles
- don't apply `fix` when we detect already-running animations on the element. That means it's already away from its original position, and doesn't need fixing. Worse, applying an absolute position can lead to the element jumping to the top left if the running animation also applies a transition style - those take precedence over the one we would apply
fixes#10252
* fix: properly assign trailing comments
Trailing comments were added even if they started before the node end, which violates the definition of trailing comments.
This fixes that, with the consequence that some comments no longer show up in the AST at all. Previously they were stuffed _somewhere_, but arguably at the wrong positions. For example the last comment in a function body got assigned as a trailing comma for the body, which is wrong, because the body ends _after_ the comma.
The special case is comments at the end of an expression tag - they are added even if there are multiple, and they are added regardless of whether they are separated by newlines or not. This ensures the expression tag end is calculated correctly.
Fixes#12466
* support multiple trailing comments after last statement in a body
* simplify, handle object and array expressions
* parse `foo={bar}` attribute as `value: { type: 'ExpressionTag', .. }` (i.e. don't wrap in an array)
* warn on quoted single-expression-attributes
* breaking: warn on quotes single-expression attributes in runes mode
In a future version, that will mean things are getting stringified, which is a departure from how things work today, therefore a warning first.
Related to #7925
* Update .changeset/plenty-items-build.md
* Apply suggestions from code review
* missed a spot
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: prevent invalid `:global` usage
Error when it's not at the end of a selector
closes#12437
* fix validation
* fix
* fix types
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The head hydration anchor didn't update after hydrating the contents of one `<svelte:head>` element, which meant subsequent `<svelte:head>` elements would always start at the beginning of the head. This PR fixes that. The test was updated such that the shape of each `<svelte:head>` content is sufficiently different to throw an error if this wasn't fixed.
fixes#12458
* fix: ensure previous transitions are properly aborted
- nullify options when the transition is aborted. This ensures a change in options is reflected the next time, else it would stick around indefinetly
- abort previous intro (if exists) when new intro plays (same for outro)
fixes#11372
* add a test
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
When Vite calls `hot.accept`, it passes the wrapped component, which means we're passing the HMR wrapper along as the new component. Avoid that by maintaining a reference to the original component.
* feat: add ability to ignore warnings through compiler option
Some people want to disable certain warnings for their whole application without having to add svelte-ignore comments everywhere. This new option makes that possible.
closes#9188
part of https://github.com/sveltejs/language-tools/issues/650
* make it a function
* singular
* warningFilter
* make internal filter non-nullable
* Update .changeset/little-seals-reflect.md
* filter_warning -> warning_filter, for symmetry with public option
* fix
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: prevent whitespaces merging across component boundaries
The logic that was there didn't take components into account. The underlying problem is that the parent isn't properly set to `Fragment` in all cases because of nested `visit` calls we do in some places.
Fixes#12447
* update test
This enhances our "variable was mutated" detection to also recognize that `foo` in `[foo[1]] = [..]` was mutated. This allows us to be more granular about detecting mutations to each expressions in legacy mode, which fixes#12169
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
The previous validation for checking if slots with let directives were rendered with `{@render children(...)}` had false positives
- threw an error even if the other side didn't make use of the arguments, i.e. wasn't actually using a let directive
- didn't check that the rendered snippet actually was the children property
This fixes the validation by only applying it to children render tags, and by adding the slot to `$$slots.default` instead of `$$props.children` in more cases (when it's using `<svelte:fragment>` or `let:` directives, which both mean you're using old slot syntax)
Fixes#12414
* fix: cache call expressions in render tag arguments
Ensure that they're called at most once per change, not once per access within the snippet
fixes#12187
* leverage state
* types
* fix
* chore: add support for HMR env flag
* chore: add support for HMR env flag
* chore: add support for HMR env flag
* chore: add support for HMR env flag
* fix: properly delay intro transitions
WAAPI applies the styles of a delayed animation only when that animation starts. In the case of fade-in transitions that means the element is visible, then goes invisible and fades in. Fix that by never applying a delay on intro transitions, instead add keyframes of the initial state for the duration of the delay.
Fixes#10876
* fix bug, make test pass
* make test more selfcontained, test outro delay aswell and add functionality for that in animation-helpers
* lint
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: document `@html` and `<img src>` hydration change
Also add a test for it
closes#12333
* add a test
* Update sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* lint
* update example and wording
* update test
* since it turns out we already had a test, we can delete the new one
* fix test
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* feat: runtime dev warn for mismatched `@html`
* fix: limit the length of the client value shown in the error
* put logic inside a helper
* remove $.hash, no longer needed
* fix
* tweak
* update changeset
* fix
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: reenable server CSS output through a compiler option
There are various use cases where this continues to be necessary/nice to have:
- rendering OG cards
- rendering emails
- basically anything where you use `render` manually and want to quickly stitch together the CSS without setting up an elaborate tooling chain
* cssRenderOnServer -> css: 'injected'
* update tests
* move append_styles into new module, update implementation
* get HMR working
* don't append styles to head when compiling as a custom element
* update changeset
* tweak
* tweak
* tweak wording
* update test
* fix
* reinstate optimisation, but without the bug
* fix sourcemap test
* move breaking change note
* Update packages/svelte/src/internal/server/index.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* WIP towards single-pass hydration
* fix
* fixes
* fix
* fix
* fixes
* fix
* fixes
* fix
* fix, tidy up
* update script (it currently fails)
* fix
* fix
* hmm
* fix
* fix
* fix
* fix
* all hydration tests passing
* drive-by fix
* fix
* update snapshot tests
* fix
* recover: false
* fix invalid HTML message
* note to self
* fix
* fix
* update snapshot tests
* fix
* fix
* fix
* update test
* fix
* fix
* fix
* ALL TESTS PASSING THIS IS NOT A DRILL
* optimise each blocks
* changeset
* type stuff
* fix comment
* tidy up
* tidy up
* tidy up
* tidy up
* tidy up
* remove comment, turns out we do need it
* revert
* reinstate standalone optimisation
* improve <svelte:element> SSR
* reset more conservatively
* tweak
* DRY/fix
* revert
* simplify
* add comment
* tweak
* simplify
* simplify
* answer: yes, at least for now, because otherwise empty components are a nuisance
* tweak
* unused
* comment is answered by https://github.com/sveltejs/svelte/pull/12356
* tweak
* handle `<template>` edge case at compile time
* this is no longer a possibility, because of is_text_first
* unused
* tweak
* fix
* move annotations to properties
* Update packages/svelte/src/constants.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/internal/client/dom/blocks/each.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/src/internal/client/dom/hydration.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update playgrounds/demo/vite.config.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* add a comment
* prettier
* tweak
* tighten up hydration tests, add test for standalone component
* test for standalone snippet
* fix
* add some comments
* tidy up
* avoid mutating `arguments`
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Setting the `value` attribute of an `<option>` element to a falsy value should result in the empty string. This wasn't happening in all situations previously.
Fixes#11616
* breaking: play transitions on `mount` by default
closes#11280
* only prevent transitions when the component is invalidated
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
This aligns warning and error objects to contain the same properties and have their toString methods return the same shape. It's implemented by warnings becoming class objects, too, and sharing the same base class with errors. It also adds back the `frame` property that got lost in the Svelte 4->5 transition. The only difference to Svelte 4 now is a slightly adjusted toString property (which is consistent between warnings and errors now) and a `position` property that contains a tuple of start/end offsets instead of a `pos` property only containing the start offset
closes#12151
The modern AST is an opportunity to tweak things. In the old AST, the start of else (if) branches was the content, now it's the opening bracket, which makes more sense.
Closes#12287
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
If an even handler is hoisted and said event handler access rest props, we can't be sure whether or not it will access it via `$$props` (optimized) or via `rest()` - therefore we add both as params in this edge case
fixes#12279
* fix: further avoid duplicate signal dependencies
visitor
another approach
tune
tune
* add test
* clean up test
* early return to reduce indentation, use var over let/const
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The refactoring in #12215 didn't take HMR into account. As a result, the anchor was passed to the HMR block, which was subsequently cleaned up on destroy - but the anchor could be shared with other components and therefore needs to stay in the dom. Passing `null` instead solves the problem.
Fixes#12228Fixes#12230Fixes#12233
* fix: deconflict multiple snippets of the same name
* address feedback
* only create BlockStatement when necessary
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* WIP
* progress
* fix
* add comment
* update tests
* mostly fix dynamic elements
* delete unused code
* remove unused code
* more
* tidy up
* fix
* more
* relink effects inside each block
* simpler to just leave these in (without children) and ignore them
* fix head stuff
* tidy up
* fix some type errors
* simplify
* use hydration marker as effect boundary where possible
* all tests passing
* tidy up
* tidy up a bit
* tidy up
* beat typescript into submission
* bring tests over from fix-each-dom-bug
* tweaks
* simplify a tad
* tidy up
* simplify
* reduce indirection
* belt and braces
* tidy
* revert config change
* missed a spot
* regenerate types
* cleaner separation between EachState and EachItem - precursor to efficient relinking
* HMR fix
* set effects
* FINALLY
The media bindings where fragile because the "prevent rerun if update in progress"-logic was flawed: It didn't (re)set the `updating` flag correctly, because it assumed an event and a render effect would always directly follow each other, with one always being first - but that's not true.
It's much more robust to instead compare the value with what's currently present in the DOM. For the very fast-firing current-time-binding a variable is used to not invoke the DOM getter as much, for the others this is not necessary.
Lastly, the playback-rate-binding contained another bug where the listener was setup inside the effect and therefore reinitialized on each binding change - it needs to move into a different effect.
Someone could render a snippet into a custom element, and therefore elements with slot attributes should be allowed within them and be treated as regular elements
closes#12158
Fixes#12166. Turns out that the recent refactors here negated the fact that non-runes mode uses a slightly different source signal that has different equality rules.
I also updated the docs in this PR too to reflect that only plain objects and arrays are proxied.
* fix: allow multiple optional parameters with defaults
* Apply suggestions from code review
* partial fix
* feat: parse as a whole function
* couple of fixes
* work around acorn-typescript quirks
* add the harder test
* Update .changeset/ten-geese-share.md
---------
Co-authored-by: Rich Harris <hello@rich-harris.dev>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* Ensure binding from legacy component passed to runes component updates correctly. This is done by also using the `prop(..)` variant for a property if it's mutated in runes mode, and then figuring out at runtime whether or not the parent should be notified or not
fixes#12032
* fix adjacent bug around wrong value getting return upon mutation
* deduplicate
* changeset
* simplify
* move comment
* rename
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
make the props parameter optional only when there are no or only optional props
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: wait a microtask for await blocks to reduce UI churn
* fix: wait a microtask for await blocks to reduce UI churn
* fix: wait a microtask for await blocks to reduce UI churn
* fix bug
* Make then blocks reactive
* add test
* update test
* update test
* Update packages/svelte/src/internal/client/dom/blocks/await.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Add support for catch block
* slightly more specific naming
* if we use the reserved $$ prefix we dont need to mess around with scope.generate
* omit args for then/catch if unnecessary
* neaten up some old code
* shrink code
* simplify test
* add failing test
* preserve pending blocks
* update test
* fix comment typo
* tidy up
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: ensure input value is correctly set during hydration
* fix: ensure input value is correctly set during hydration
* address feedback
* fix typos
* early return, var
* fix test
* Update packages/svelte/src/internal/client/dom/elements/attributes.js
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* update changeset
* tweak names
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
prevent misidentification of bindings as delegatable event handlers if used outside event attribute
Fixes#12074
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
When the TypeScript plugin we provide isn't enabled, imports to `.svelte`-files fall back to an ambient module declaration. Said declaration was still only providing the deprecated class. This PR widens the type so that you can also invoke it like a function. After the transition period (Svelte 6 or 7) only the new type should be provided from the module declaration.
The `is` attribute is special and always needs to be part of the static template string, or else it wouldn't be taken into account on initialization
fixes#12052
- give autocompletion for types and more precise event types for html elements
- allow to pass other kinds of event target nodes, like window
closes#12027fixes#12045
We need to ensure that if derived a depends on derived b, and a is reconnecting to the dependency graph, that if b was updated more recently than a, a also updates.
Fixes#11988Fixes#12044
follow up to #12014, which wasn't quite the right fix. It would mean that delegated listeners between two manual listeners wouldn't be called at the correct time.
* fix: ensure bound input content is resumed on hydration
* fix: ensure bound input content is resumed on hydration
* Update packages/svelte/src/internal/client/dom/elements/bindings/input.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: ensure bound input content is resumed on hydration
* fix: ensure bound input content is resumed on hydration
* Update packages/svelte/src/internal/client/dom/elements/bindings/input.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* add test
* add test
* add test
* add test
* Update packages/svelte/src/internal/client/dom/elements/bindings/input.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* add test
* add test
* newlines between multi-line blocks, let the code breathe
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: simplify SSR escaping
* treat solo expressions the same as sequence expressions
* reduce some indirection
* more
* tidy
* tidy
* remove unused types
* more
* this doesnt do anything
* more
* Anchor is unused
* simplify
* simplify
* move special case handling
* more
* simplify
* simplify
* simplify
* more
* unnecessary
* simplify
* remove unused arg
* more
* more
* unnecessary
* more
* more
* dedupe
* fix: create sources for initial values of Set
* fix: create sources lazily on Set
* fix: avoid creating sources if sizes are the same
* chore: add test for size of Set
* create iterator lazily
* tidy up test
* oops
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
The current type narrows the binding type to `""` by default, which means "no bindings on this component". While this is the common case, it makes it very cumbersome to use the `Component` type because legacy components are of type `string` and as soon as you have bindings, the type is something like `"foo" | "bar"` which _also_ is not assignable to `""` which is semantically wrong, because you should be able to assign a component that can have bindings to a type that accepts none.
The pragmatic solution is to change the binding type to allow `string`, which means someone theoretically could use bindings with a component that doesn't have bindings:
```svelte
<script>
let component: Component<{ prop: boolean }> = IAcceptNoBindings;
</script>
<!-- allowed but should be a type error -->
<svelte:component this={component} bind:prop={foo} />
```
But this is a) rare anyway and b) can be caught at runtime
This came up in comments of #11775
Also remove create_block function in favor of calling visit which in turn calls the fragment visitor, to ensure scope is updated correctly
Fixes#11450
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Both `<svelte:element this="div">` and `<svelte:element this={"div"}>` were backported as `tag: "div"` for the old AST. That's wrong because the latter should result in `tag: { type: 'Literal', .. }`. Fixing this makes all the tests in prettier-plugin-svelte pass with Svelte 5.
Also cleaned up a bit of code in the parser.
* feat: bind `activeElement` and `pointerLockElement` in `<svelte:document>`
* add test, use focusin/focusout rather than focus/blur
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: silence `state_referenced_locally` when state is exported
* chore: add changesets
* chore: use `some`
* fix
* better
* we don't need a whole new test for this
* Update .changeset/few-zoos-own.md
* prettier
* tidy up the test a bit since we're in here
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Rich Harris <hello@rich-harris.dev>
* fix: keep default values of props a proxy after reassignment
* fix: make this work for non bindable props too
* chore: more comprehensive test
* chore: cast away
* chore: better variable name and check
* chore: fix lint
When a proxy is reassigned, we call `$.proxy` again. There are cases where there's a component context set but the reassignment actually happens for variable that is ownerless within shared state or somewhere else. In that case we get false positives right now. The inverse is also true where reassigning can delete owners (because no component context exists) and result in false negatives. The fix is to pass the previous value in to copy over the owners from it.
Fixes#11525
Fixes#11817.
It turns out that we weren't fully handling the disconnection of derived signals from the reactivity graph – resulting in cases where they could leak memory because they were not being removed from their dependency reactions array. However, removing ourselves from this array meant that any future changes might mean we need to reconnect the derived to the graph again – so we have to do some additional bookkeeping to make this work. Thankfully, we already have versioning because of unowned deriveds, we can use the versions to understand if the owned derived signal is dirty after being connected to the reactivity graph again – something we couldn't do in early permutations of the signal architecture – and likely why we hadn't addressed this in the same sense.
If a property is mutated, the assumption is that it is deeply reactive. In those cases, the fallback value should be proxified so that it also is deeply reactive.
fixes#11425
In Svelte 3 and 4, components were classes under the hood, and the base class was `SvelteComponent`. This class was also used in language tools to properly type check the template code.
In Svelte 5, components are functions. To give people a way to extend them programmatically, it would be good to expose the actual shape of components. This is why this PR introduces a new `Component` type.
For backwards compatibility reasons, we can't just get rid of the old class-based types. We also need to ensure that language tools can work with both the new and old types: There are many libraries out there that provide `d.ts` files with type definitions written using the class types - these should not error.
That's why there's an accompagning language tools PR (https://github.com/sveltejs/language-tools/pull/2380) that's doing the heavy lifting: Instead of generating classes, it now generates a constant and an interfaces and uses Typescript's declaration merging feature to provide both so we can declare a component export as being both a class and a function. That ensures that people can still instantiate them with `new` (which they can do if they use the `legacy.componentApi` compiler option), and it also ensure we don't need to adjust any other code generation mechanisms in language tools yet - from a language tools perspective, classes are still the norm. But through exposing the default export as being _also_ callable as a function we can in a future Svelte version, where classes/the Svelte 4 syntax are removed completely, seamlessly switch over to using functions in the code generation, too, and the `d.ts` files generated up until that point will support it because of the dual shape. This way we have both backwards and forwards compatibility.
We didn't delegate the input event back when we were also delegating `on:x` events, because it messes up the event/bindings/actions order. Since we're only doing that for `onx` event attributes now that reason is obsolete and we can start delegating it.
The value attribute on select elements does nothing - it does not influence the initial value (in SSR that's the job of the `selected` attribute on an option element), updating it does not influence the current value either. Instead of rendering it out and then removing it on hydration (which is costly because the mutation causes work) we just don't render it in SSR.
No test/changeset because no change in behavior.
* breaking: disallow string literal values in `<svelte:element this="...">`
* note breaking change
* Update sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
Co-authored-by: Jeremiasz Major <jrh.mjr@gmail.com>
* prettier
* make invalid `<svelte:element this>` a warning instead of an error (#11641)
* make it a warning instead of an error
* format
---------
Co-authored-by: Jeremiasz Major <jrh.mjr@gmail.com>
* feat: add rootDir option and set __svelte_meta.file like in svelte4
* Update packages/svelte/src/compiler/validate-options.js
* update tests
* centralise logic
* fix
* note to self
* Apply suggestions from code review
* lint
* one dollar towards the windows backslash bugfix foundation please
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
* feat: add $state.is rune
* fix type
* tweak docs
* may as well update the test case to match the docs
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* chore: improve SSR invalid element error message
* move push_element and pop_element into new dev.js file
* pass location info, remove unnecessary if (DEV) block
* use full filename, basename is not very helpful. also, current_component is guaranteed to not be null
* current_element is guaranteed to not be null in pop_element
* tweaks
* remove message prefix - redundant when filenames are included
* add line/column
* make message more concise
* reduce indirection
* only print message once
* update test
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Instead of hacking an ignores array onto each node (and possibly degrading perf a bit because the object shape is mutated) we keep track of ignores in a stack. The new approach also avoids the indirection the old one had to do because the new approach looks upwards (checking if parent is a fragment) instead of iterating the children (checking for comments in them).
As a bonus unknown code warnings are now in order (line-column-wise) with the other warnings. Also fixes#11482 because text nodes of all shapes are ok
In edge cases it may happen that set_attributes is re-run before the effect is executed. In that case the render effect which initiates this re-run will destroy the inner effect and it will never run. But because next and prev may have the same keys, the event would not get added again and it would get lost. We prevent this by using a root effect.
The added test case doesn't fail for some reason without this fix, but it does fail when you test it out manually, so I still added it.
Found through https://github.com/sveltejs/svelte/issues/10359#issuecomment-2101167524
* fix: make `$effect.active()` true when updating deriveds
* WIP
* this seems to work?
* prevent effects being created in unowned deriveds
* update test
* fix issue
---------
Co-authored-by: Dominic Gannaway <dg@domgan.com>
* fix: use snippet as parent element of snippets childrens in validator
* Update packages/svelte/src/compiler/phases/2-analyze/validation.js
* Update .changeset/wet-pears-remain.md
---------
Co-authored-by: Rich Harris <hello@rich-harris.dev>
* fix: use acceptExports to support partial hmr
* fix: add condition to only use acceptExports when it is available
* fix: update test snapshot
* fix: format
* Fixed: bind:scroll resets scroll state
* failing test
* bail if value is undefined
* changeset
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
Deriveds where under certain conditions not detected as dirty correctly. The reason is that a transitive check_dirtiness call could update the flag of a derived, even if the condition doesn't ulimately result to true. That's why the check for "is now dirty" needs to be moved out of the inner if block.
Fixes#11481
This may also fix a yet undetected overfiring bug in the "is unowned" case because the previous inner "is now dirty?" check didn't take unowned into account.
fixes#11483
We need to keep track of the component function similar to how we keep track of the component context, so that effects etc have the correct one associated
Ownership validation had a false positive when rendering a component as slotted content of another component. To fix this, #11401 did set the current component context to the context the snippet was declared in, not to the context it is rendered in. This was flawed because it means that component context was altered in a way that setContext/getContext failed because the parent chain was incorrect. This fixes that by introducing a separate global (dev time only) which tracks the component function the ownership needs.
fixes#11429
Instead of using types that declare whether or not a type is bindable directly as part of the property, we're introducing a new for-types-only field to `SvelteComponent`: `$$bindings`, which is typed as the keys of the properties that are bindable (string by default, i.e. everything's bindable; for backwards compat). language-tools can then produce code that assigns to this property which results in an error we can display if the binding is invalid
closes#11356
* fix: handle reassignment of `$$props` and `$$restProps`
Some libraries assign to properties of `$$props` and `$$restProps`. These were previously resulting in an error but are now handled properly
https://github.com/sveltejs/svelte/issues/10359#issuecomment-2080067464
* $$props is coarse grained on updates, so we can simplify this
* fix
* fix comment
When spreading attributes, the setters of the element are checked. If they contain the key in question, it's set via that setter. For certain setters on certain elements this didn't work because the element prototype was not HTMLElement, rather a descendant of that (for example HTMLDivElement), which meant that only the setters of the descendant, not the superclass were taken into account. This fixes that by walking up the prototype chain until we find the Element prototype.
fixes#11179
* feat: leave view transition pseudo selectors untouched
view transition pseude selectors are global-like, i.e. they shouldn't be scoped or treated as unused.
In the process of adding support for this, is_root and is_host were consolidated into is_global_like because their usage locations didn't need any differentiation between them (same for the new view transition treatment)
closes#9127
* regenerate types
previously a reaction could be marked as DIRTY and subsequently as MAYBE_DIRTY before running, resulting in false negatives. Ensure that DIRTY flag can never be lowered to MAYBE_DIRTY
fixes#11363
at rules are now left alone and you can have nested css in them which is scoped correctly. This just adds a test so we don't regress in the future
closes#9267
Provides a migration function, exported as `migrate` from `svelte/compiler`, which tries its best to automatically migrate towards runes, render tags (instead of slots) and event attributes (instead of event handlers)
The preview REPL was updated with a migrate button so people can try it out in the playground.
closes#9239
* feat: only inject push/init/pop when necessary - closes#11297
* regenerate
* differentiate between safe/unsafe
* only inject $$props when necessary
* more
* fix
* simplify
* handle store subscriptions
* chore: directly export function in non-HMR mode
* remove some more noise
* update snapshots
* Update sites/svelte-5-preview/src/lib/workers/compiler/index.js
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* start reorganising messages
* tidy up
* more
* more
* more
* alphabetise
* consolidate
* more
* more
* more
* more
* more
* more
* alphabetise
* more
* this is no longer needed
* no longer necessary
* more
* more
* fix
* regenerate messages
* more
* more
* tighten up rune validation
* more
* fix
* more
* tweak a11y messages
* add server errors
* overhaul runtime errors
* regenerate messages
* unused
* lint
* more
* more
* Update packages/svelte/messages/compile-errors/script.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/messages/client-warnings/warnings.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix: mark `accessors` and `immutable` as deprecated
* add warnings for deprecated <svelte:options> attributes
* disable accessors in runes mode
* update tests
* tidy up
* the hell?
* regenerate types
* if I would get a dollar for every windows bug I fix I would be a millionaire by now
* return instance _and_ props in runes mode, move flushSync into shared code, don't set accessors in runes mode
* goddammit
* note breaking change
* fix
* regenerate messages
* Revert "return instance _and_ props in runes mode, move flushSync into shared code, don't set accessors in runes mode"
This reverts commit a47827e57d.
* pass instance to tests
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
This is a typings PR and the companion PR to sveltejs/language-tools#2336
It introduces two new types:
- Binding: Marks a property as being bound (i.e. you must do bind:x)
- Bindable: Marks a property as being able to be bound (i.e. you can do bind:x)
Language tools then uses this generate code accordingly which then generates type errors.
All the other type gymnastics are there to ensure that you don't interact with these bindable types when using mount or hydrate or ComponentProps<MyComponent>, i.e. these two types should be mostly opaque for day-to-day users.
For backwards-compatibility, all properties are automatically wrapped with Bindable, which means existing type definition files will continue to work from a types perspective. Language tools opts into strict bindability by providing its own constructor definition for all generated classes in runes mode which omits the "wrap everything with bindable" behavior.
* breaking: disallow binding to component exports in runes mode
Svelte 4 allowed you to have `export const foo = ..` in component A and then do `<A bind:foo />`. This is confusing because it's not clear whether the binding is for a property or an export, and we have to sanitize rest props from the export bindings.
This PR therefore introduces a breaking change in runes mode: You cannot bind to these exports anymore. Instead use `<A bind:this={a} />` and then do `a.foo` - makes things easier to reason about.
* Update sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* tweak messages
* fix tests
* use component.name
* oops
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: run event attributes after binding event listeners
By running the event listener logic inside an effect on the first run we guarantee that they're attached after binding listeners. Fixes#11138.
* give arrow functions stable id, better code gen
* optimise normal function expressions too (rare but valid!)
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: fall back to component namespace when not statically determinable
In #10006 we added more elaborate mechanisms to determine which namespace a given element is in. For `<svelte:element>` we added a "can't know at compile time" case and introduced a limited heuristic into the runtime.
This doesn't work for a few reasons:
- we're checking the parent's namespace to determine the current namespace, but the element itself could be the one that _changes_ the namespace
- as mentioned in the previous comment already, on the first render we can't do any parent analysis
- it does not take into account the static component namespace
The last point is the crucial one: In Svelte 4, we're falling back to the component namespace if we can't know statically - e.g. if someone added `<svelte:options namespace="svg">` then `<svelte:element>` should fall back to that namespace instead.
We were not doing that up until now, which introduced a regression. Fixing this also means getting rid of the (flawed) "can't know statically" heuristic.
Fixes#10858, though for a complete solution we likely need some way to tell `<svelte:element>` the namespace at runtime through a special attribute. Maybe we can use `xmlns` for that like we do in the static case
* support dynamic svelte:element namespace through xmlns attribute
* fix
* feat: allow $inspect reactivity map, set, date
* feat: inspect map without adding new data source
* feat: add inspect
* feat: define inspect on dev mode only
* fix: lint error
Ownership was not widened when assigning a sub state to a different top level state. The set of owners for the state was zero because the owner was on the original parent, but that one was reset to null because it's now the top level of a different state. That meant that there was no owner but also no parent to check for the owner, which is an invalid combination resulting in a nullpointer (and also potentially false positive warnings in other situations).
fixes#11204
* breaking: warn/error on old syntax in runes mode
- warn on slots and event handlers in runes mode
- error on `<slot>` + `{@render ...}` tag usage in same component
closes#9416
* render tag + slot could occur in legacy mode as well, error there, too
* rename metadata.o to metadata.owners, tweak check_ownership implementation
* track parent relationships
* update
* changeset
* adjust test to reflect new semantics
* prevent component using bind: with object it does not own
* failing test
* fix#11060
* add explanatory comment
* don't accidentally narrow global ownership, fix has_owner method
* widen ownership if assigning different state proxies to one another
* don't set owners to null when parent exists
* fix
* only recurse into POJOs
* handle cycles on context
---------
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Co-authored-by: Dominic Gannaway <dg@domgan.com>
- don't call fallback values eagerly, only when it's actually needed. Avoids potential unwanted side effects
- use derived_safe_equals to memoize results of destructured snippet/each context values with default values to ensure they're only recalculated when their dependencies change. Avoids unstable default values getting called multiple times yielding different results. Use derived_safe_equals to ensure new values are always set, even when mutated. fixes#11143
* added raw elements set
* added test
* added changeset
* moved raw text elements to constands and made array
* moved to correct constants
* fix test
* fix constants formatting
* feat: hot module reloading support for Svelte 5
* fix lockfile
* tweaks
* types
* lint
* lint
* tweaks
* add hmr flag
* tweak
* tweaks
* move HMR logic into its own module
* simplify
* tidy up types
* fix test
* lint
* need some indirection here or references break
* prevent transitions during HMR update
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
* fix: loosen proxy signal creation heuristics
* tighten up test
* update comment
* no need to create a source outside an effect here, because it can't result in a reference
* preserve reference to props.$$events
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
- take into account that template could consist of a single script tag, for which querySelectorAll('script') would yield false negatives
- add test to ensure that we don't execute script tags inside `@html` tags next to static script tags
fixes#11082
The character adjustments in the existing warnings are because we remove some tabs from empty lines when initializing the Svelte 5 repo; the warnings were just not checked at that time yet.
Paolo Ricciuti
Simon H
Dominic Gannaway
Rich Harris
adiGuba
James Glenn
Maxime LUCE
Leon Radley
wackbyte
Ben McCann
Lucas Garron
Gautier Ben Aïm
Oscar Dominguez
Theodor Steiner
ottomated
Simon Holthausen
BlueGreenMagick
Ahmad S
Leon Scherer
Lyu, Wei-Da
Yuichiro Yamashita
Damian Stasik
gtmnayan
Azat S
wackbyte
FoHoOV
Dominik G
Fabio Rotondo
Vladislav Logvin
Hunter Johnston
Luke Warlow
Jeremiasz Major
Caique Torres
Craig Jennings
Vaibhav Rai
Tan Li Hau
Daniel