Merge branch 'main' into remove-readonly-check

.changeset/big-geese-act.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: only throw bind error when not passing a value

.changeset/orange-crews-rescue.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: improve handling of object property deletions

packages/svelte/src/internal/client/proxy.js

@@ -156,7 +156,7 @@ const state_proxy_handler = {
 		}
 		if (s !== undefined) set(s, UNINITIALIZED);
 
-		if (prop in target) update(metadata.v);
+		if (boolean) update(metadata.v);
 
 		return boolean;
 	},

packages/svelte/src/internal/client/runtime.js

@@ -1091,7 +1091,7 @@ export function mark_subtree_inert(signal, inert, visited_blocks = new Set()) {
 			if (type === IF_BLOCK) {
 				const condition_effect = block.e;
 				if (condition_effect !== null && block !== current_block) {
-					mark_subtree_inert(condition_effect, inert);
+					mark_subtree_inert(condition_effect, inert, visited_blocks);
 				}
 				const consequent_effect = block.ce;
 				if (consequent_effect !== null && block.v) {
@@ -1567,16 +1567,20 @@ export function is_store(val) {
 export function prop(props, key, flags, initial) {
 	var immutable = (flags & PROPS_IS_IMMUTABLE) !== 0;
 	var runes = (flags & PROPS_IS_RUNES) !== 0;
-
-	var setter = get_descriptor(props, key)?.set;
-	if (DEV && setter && runes && initial !== undefined) {
-		// TODO consolidate all these random runtime errors
-		throw new Error('Cannot use fallback values with bind:');
-	}
-
 	var prop_value = /** @type {V} */ (props[key]);
+	var setter = get_descriptor(props, key)?.set;
 
 	if (prop_value === undefined && initial !== undefined) {
+		if (setter && runes) {
+			// TODO consolidate all these random runtime errors
+			throw new Error(
+				'ERR_SVELTE_BINDING_FALLBACK' +
+					(DEV
+						? `: Cannot pass undefined to bind:${key} because the property contains a fallback value. Pass a different value than undefined to ${key}.`
+						: '')
+			);
+		}
+
 		// @ts-expect-error would need a cumbersome method overload to type this
 		if ((flags & PROPS_IS_LAZY_INITIAL) !== 0) initial = initial();
 

packages/svelte/src/internal/client/transitions.js

@@ -649,12 +649,16 @@ export function trigger_transitions(transitions, target_direction, from) {
 			mark_subtree_inert(effect, false);
 		} else if (target_direction === 'key') {
 			if (direction === 'key') {
-				transition.p = transition.i(/** @type {DOMRect} */ (from));
+				if (!transition.p) {
+					transition.p = transition.i(/** @type {DOMRect} */ (from));
+				}
 				transition.in();
 			}
 		} else {
 			if (direction === 'out' || direction === 'both') {
-				transition.p = transition.i();
+				if (!transition.p) {
+					transition.p = transition.i();
+				}
 				outros.push(transition.o);
 			}
 			transition.d.inert = true;

packages/svelte/tests/runtime-legacy/samples/transition-js-if-block-bidi/_config.js

@@ -17,7 +17,7 @@ export default test({
 
 		component.visible = false;
 		// @ts-expect-error
-		assert.equal(global.count, 2);
+		assert.equal(global.count, 1);
 
 		raf.tick(500);
 		assert.equal(div.foo, 0.25);

packages/svelte/tests/runtime-runes/samples/props-bound-fallback/_config.js

@@ -14,5 +14,5 @@ export default test({
 		assert.htmlEqual(target.innerHTML, `<button>1</button><span>1</span>`);
 	},
 
-	error: `Cannot use fallback values with bind:`
+	error: `ERR_SVELTE_BINDING_FALLBACK: Cannot pass undefined to bind:count because the property contains a fallback value. Pass a different value than undefined to count.`
 });

packages/svelte/tests/runtime-runes/samples/state-delete-property/_config.js

@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<button>set</button><button>delete</button><p>a,b,c</p><p>{"a":1,"b":2,"c":3}</p>',
+	async test({ assert, target }) {
+		const [btn, bt2] = target.querySelectorAll('button');
+
+		await btn?.click();
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>set</button><button>delete</button><p>a,b,c</p><p>{"a":1,"b":2,"c":3}</p>`
+		);
+
+		await bt2?.click();
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>set</button><button>delete</button><p>a,c</p><p>{"a":1,"c":3}</p>`
+		);
+	}
+});

packages/svelte/tests/runtime-runes/samples/state-delete-property/main.svelte

@@ -0,0 +1,8 @@
+<script>
+	let numbers = $state({ a: 1, b: 2, c: 3 });
+</script>
+
+<button onclick={() => { numbers.b = 2; }}>set</button>
+<button onclick={() => { delete numbers.b; }}>delete</button>
+<p>{Object.keys(numbers)}</p>
+<p>{JSON.stringify(numbers)}</p>