fix: wrap props in deriveds more conservatively in legacy mode

Author: Rich-Harris

.changeset/odd-jobs-taste.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: wrap props in deriveds more conservatively in legacy mode

packages/svelte/src/compiler/phases/2-analyze/index.js

@@ -1263,8 +1263,9 @@ const common_visitors = {
 	},
 	CallExpression(node, context) {
 		if (
-			context.state.expression?.type === 'ExpressionTag' ||
-			(context.state.expression?.type === 'SpreadAttribute' && !is_known_safe_call(node, context))
+			(context.state.expression?.type === 'ExpressionTag' ||
+				context.state.expression?.type === 'SpreadAttribute') &&
+			!is_known_safe_call(node, context)
 		) {
 			context.state.expression.metadata.contains_call_expression = true;
 		}

packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js

@@ -719,11 +719,10 @@ function serialize_inline_component(node, component_name, context) {
 				const should_wrap_in_derived =
 					Array.isArray(attribute.value) &&
 					attribute.value.some((n) => {
-						return (
-							n.type === 'ExpressionTag' &&
-							n.expression.type !== 'Identifier' &&
-							n.expression.type !== 'MemberExpression'
-						);
+						if (n.type !== 'ExpressionTag') return false;
+						return context.state.analysis.runes
+							? n.metadata.contains_call_expression
+							: n.expression.type !== 'Identifier';
 					});
 
 				if (should_wrap_in_derived) {

packages/svelte/tests/runtime-legacy/samples/component-prop-derived/Child.svelte

@@ -0,0 +1,7 @@
+<svelte:options accessors={false} />
+
+<script>
+	export let x;
+
+	$: console.log('x', x);
+</script>

packages/svelte/tests/runtime-legacy/samples/component-prop-derived/_config.js

@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs, target }) {
+		assert.deepEqual(logs, ['x', 42]);
+
+		const btn = target.querySelector('button');
+		flushSync(() => btn?.click());
+
+		assert.deepEqual(logs, ['x', 42]);
+	}
+});

packages/svelte/tests/runtime-legacy/samples/component-prop-derived/main.svelte

@@ -0,0 +1,9 @@
+<script>
+	import Child from './Child.svelte';
+
+	let object = { x: 42 };
+</script>
+
+<button on:click={() => object = { x: 42 }}>update</button>
+
+<Child x={object.x} />