From 09addad9ae9ecb5141a473c4a33baa9195b35dc0 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 21 May 2024 15:23:14 +0100
Subject: [PATCH] fix: improve handling of unowned derived signal (#11712)

---
 .changeset/tame-dots-battle.md                |  5 ++++
 .../svelte/src/internal/client/runtime.js     |  4 ++--
 .../samples/derived-unowned-8/_config.js      | 23 +++++++++++++++++++
 .../samples/derived-unowned-8/main.svelte     | 18 +++++++++++++++
 4 files changed, 48 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/tame-dots-battle.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-8/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-8/main.svelte

diff --git a/.changeset/tame-dots-battle.md b/.changeset/tame-dots-battle.md
new file mode 100644
index 0000000000..12cb09c7b4
--- /dev/null
+++ b/.changeset/tame-dots-battle.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: improve handling of unowned derived signal
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 43ccd4d703..1149b1074d 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -420,8 +420,8 @@ function remove_reaction(signal, dependency) {
 		}
 	}
 	if (reactions_length === 0 && (dependency.f & UNOWNED) !== 0) {
-		// If the signal is unowned then we need to make sure to change it to dirty.
-		set_signal_status(dependency, DIRTY);
+		// If the signal is unowned then we need to make sure to change it to maybe dirty.
+		set_signal_status(dependency, MAYBE_DIRTY);
 		remove_reactions(/** @type {import('#client').Derived} **/ (dependency), 0);
 	}
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/_config.js
new file mode 100644
index 0000000000..5a19fa4773
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/_config.js
@@ -0,0 +1,23 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	async test({ assert, target, logs }) {
+		let [btn1] = target.querySelectorAll('button');
+
+		flushSync(() => {
+			btn1.click();
+		});
+
+		flushSync(() => {
+			btn1.click();
+		});
+
+		flushSync(() => {
+			btn1.click();
+		});
+
+		assert.deepEqual(logs, ['recalculating']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/main.svelte
new file mode 100644
index 0000000000..5644e87377
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-8/main.svelte
@@ -0,0 +1,18 @@
+<script context="module">
+	let visible = $state(true);
+
+	function toggleVisibility() {
+		visible = !visible;
+	}
+
+	let unchangedState = $state("unchanged state");
+	let derived = $derived.by(() => {
+		console.log("recalculating");
+		return unchangedState;
+	});
+</script>
+
+<button onclick={toggleVisibility}>Toggle Visibility</button>
+{#if visible}
+	<p>{derived}</p>
+{/if}