Skip to content

svelte5: while binding this to none-existing property on desctructed object, svelte adds the property #12636

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
FoHoOV opened this issue Jul 28, 2024 · 4 comments · Fixed by #12638

Comments

@FoHoOV
Copy link
Contributor

FoHoOV commented Jul 28, 2024

Describe the bug

In JS this:

const user = {name: "test"};
let {name, lastname} =  user;
lastname = "test2";
console.log(user);

will result in:

{name: "test"}

It will not create the lastname property on the user.

In svelte doing something similar:

<script>
	let users = $state([{name: "a"}]);
</script>


<!-- this creates the lastname on users[0] then assigns the value to it -->
<!-- which is not how js works -->
{#each users as {name, lastname}}
	<div bind:this={lastname}></div>
{/each}

<br>
{JSON.stringify(users)}

will create:

[{"name":"a","lastname":{"__svelte_meta":{"loc":{"file":"App.svelte","line":9,"column":1}}}}]

It seems that it doesn't work for other binds tho, just for bind:this. This is a breaking change (bind:value={lastname} works in svelte4 using the each block arguments to bind to), which I didn't find documented, maybe I'm blind, just pointing this out as well.

Reproduction

  1. openup this REPL
  2. see the output :D

Logs

No response

System Info

REPL 5.0.0-next.200

Severity

annoyance

@FoHoOV FoHoOV changed the title svelte5: while binding this to none-existing property on desctructed object, creates the property svelte5: while binding this to none-existing property on desctructed object, svelte adds the property Jul 28, 2024
@brunnerh
Copy link
Member

Binding to the each item and destructured properties is a Svelte 3 / 4 feature that is supposed to be gone in runes mode - it outputs an error.

Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. array[i] = value instead of entry = value)

I guess the bind:this was not accounted for.

@FoHoOV
Copy link
Contributor Author

FoHoOV commented Jul 28, 2024

I guess it should be in the breaking changes then (#11400).

@brunnerh
Copy link
Member

brunnerh commented Jul 28, 2024

I don't think it qualifies as that since it still works in non-runes mode.
If you rewrite to runes, you will have to change quite a few things anyway.

@FoHoOV
Copy link
Contributor Author

FoHoOV commented Jul 28, 2024

Petition to rename bind:this to start with something else other than bind: :D? I guess there are other issues that gets confusing because bind:this is speciall in a way see (#12401 and this comment).
note: not related to this issue tho

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

Successfully merging a pull request may close this issue.

2 participants