Two-way binding for a component makes two updates in a reactive block if bind:value=<object>

[hapcode]

Primitive types and bindings in native <input> work fine. See REPL.

I added <svelte:options immutable={true}/> and the problem has gone. However I see inconsistent behaviour for <Custom bind:value={object.prop}/> and
<input bind:value={object.prop}/> when immutable is false. Is this a bug?

[lgirma]

I am having the same issue. Value changes twice when there is a two way binding in custom components.

In my case, for example, I am having a custom component Pager and using it as:
<Pager bind:myProp={val} />
and doing $: console.log(val) from outside the component logs the value to the console twice. However, doing the logging inside the custom component logs it once.

This doesn't happen when using the binding with a native component like <input bind:value={val}> This has been particularly harmful when there is an http API call when val changes ... which triggers the call twice for no reason.

[jesseskinner]

I'm having the same problem, and in my use case it also causes an unnecessary network request.

I made a REPL before I found this issue.

[jesseskinner]

Oh, I just figured out a workaround for my project, in case it helps someone.

If you want the source of truth on the prop to come from the child component, then leave it undefined in the parent. Then, you can make the reactive variable have a condition on the presence of that variable. eg:

<script>
let prop;
$: prop && console.log(prop);
</script>
<Child bind:prop/>

Might not work for every use case but maybe that helps someone.

[Conduitry]

This, at last, should be fixed in 3.32.2 - https://svelte.dev/repl/d4df9f70eb34430abde39f7e8d0cd1d1?version=3.32.2 - thanks @pushkine!

[seanthingee]

@Conduitry @pushkine

I'm not sure if this is fixed yet – or maybe it's a different-but-similar bug that I found?

I've modified the REPL such that the bind:value on the Custom component is customObject instead of customObject.text. I've also added a reactive statement to Custom.svelte to log value. When this is done, it shows custom updates (object) = 2 and the there are two log entries in the console.

https://svelte.dev/repl/a72ad960202241f5af39a90337dafa9d?version=3.38.3