Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

[Svelte5] Very strange behavior with a $state() created by a $state.snapshot() #13123

Closed
fsoft72 opened this issue Sep 4, 2024 · 2 comments · Fixed by #13142
Closed

[Svelte5] Very strange behavior with a $state() created by a $state.snapshot() #13123

fsoft72 opened this issue Sep 4, 2024 · 2 comments · Fixed by #13142

Comments

@fsoft72
Copy link
Contributor

fsoft72 commented Sep 4, 2024

Describe the bug

It seems that $state()s created by copying a $state.snapshot() behave differently.
I have created a small example that does the following:

  1. Create a small $state() called user
  2. Pass the user to a component
  3. The component creates a new $state() by cloning data in this way: $state($state.snapshot(_user))
  4. The new user object is passed to some <input> types with the bind:value directive
  5. When the save button is pressed, the old values are returned to the onsave callback ... unless you spread the object.

So, in short:

  • onsave(user) will return the OLD values, even if they are saved inside the new user object
  • onsave({...user}) will return the correct values

Tested against: svelte 5.0.0-next.243

Reproduction

I have created a small REPL Here

Logs

No response

System Info

System:
    OS: Linux 6.8 Ubuntu 24.04 LTS 24.04 LTS (Noble Numbat)
    CPU: (24) x64 AMD Ryzen 9 7900X 12-Core Processor
    Memory: 53.73 GB / 62.01 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
    pnpm: 9.9.0 - ~/.local/share/pnpm/pnpm
    bun: 1.0.0 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 127.1.68.137
    Chrome: 127.0.6533.88


### Severity

blocking all usage of svelte
@dummdidumm dummdidumm added this to the 5.0 milestone Sep 4, 2024
@7nik
Copy link

7nik commented Sep 4, 2024

Isn't it just misleading info in the console and what #13070 tries to fix?

@fsoft72
Copy link
Contributor Author

fsoft72 commented Sep 4, 2024

Isn't it just misleading info in the console and what #13070 tries to fix?

I think you are right, because this new REPL always work

@dummdidumm dummdidumm removed this from the 5.0 milestone Sep 4, 2024
dummdidumm added a commit that referenced this issue Sep 5, 2024
Wrap console.log/warn/error statements in DEV mode with a check whether or not they contain state objects. Closes #13123

This is an alternative or enhancement to #13070. Alternative if we deem it the better solution. Enhancement because it's not as robust as a custom formatter: We only check the top level of each entry (though we could maybe traverse a few levels), and if you're logging class instances, snapshot currently stops at the boundaries there and so you don't get snapshotted values for these (arguably this is a more general problem of $inspect and $state.snapshot), whereas with custom formatter it doesn't matter at which level you come across it.
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.

3 participants