Skip to content

<svelte:component> evaluates props twice #6634

Closed
@cleiner

Description

@cleiner

Describe the bug

In a <svelte:component> like the following, where a prop value is the result of a function call and both the function as well as the component constructor are contained in a common parent object, the function call is executed twice each time the constructor changes:

<svelte:component this={view.component} value={view.fn()}/>

Looking at the generated code, it appears that the component's p() method computes the values for switch_instance_changes without checking if it's actually required -- if the constructor (switch_value) changes, switch_instance_changes will never be used, but fn() will be called again in switch_props() instead:

function switch_props(ctx) {
	return { props: { value: /*view*/ ctx[0].fn() } };
}

p(ctx, [dirty]) {
	const switch_instance_changes = {};
	if (dirty & /*view*/ 1) switch_instance_changes.value = /*view*/ ctx[0].fn();

	if (switch_value !== (switch_value = /*view*/ ctx[0].comp)) {
		...
		switch_instance = new switch_value(switch_props(ctx));
	} else if (switch_value) {
		switch_instance.$set(switch_instance_changes);
	}
},
...

Reproduction

https://svelte.dev/repl/b00cabd142d64ab9b872ec69dbe9b0bb?version=3.42.1

Logs

No response

System Info

n/a

Severity

annoyance

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugcompilerChanges relating to the compiler

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions