From 117082b0395f7b066b7396a04a3201e50638c667 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 19 Mar 2024 16:28:22 +0000
Subject: [PATCH] fix: improve handling of unowned derived signals (#10842)

---
 .changeset/olive-mice-fix.md                  |  5 ++
 .../internal/client/reactivity/deriveds.js    |  2 +-
 .../samples/derived-unowned-3/_config.js      | 30 ++++++++++++
 .../samples/derived-unowned-3/main.svelte     | 49 +++++++++++++++++++
 4 files changed, 85 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/olive-mice-fix.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-3/main.svelte

diff --git a/.changeset/olive-mice-fix.md b/.changeset/olive-mice-fix.md
new file mode 100644
index 0000000000..b3548bd11f
--- /dev/null
+++ b/.changeset/olive-mice-fix.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: improve handling of unowned derived signals
diff --git a/packages/svelte/src/internal/client/reactivity/deriveds.js b/packages/svelte/src/internal/client/reactivity/deriveds.js
index 24806084ae..b258e486ba 100644
--- a/packages/svelte/src/internal/client/reactivity/deriveds.js
+++ b/packages/svelte/src/internal/client/reactivity/deriveds.js
@@ -41,7 +41,7 @@ export function derived(fn) {
 		/** @type {import('#client').DerivedDebug} */ (signal).inspect = new Set();
 	}
 
-	if (current_reaction !== null) {
+	if (current_reaction !== null && (current_reaction.f & DERIVED) !== 0) {
 		if (current_reaction.deriveds === null) {
 			current_reaction.deriveds = [signal];
 		} else {
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/_config.js
new file mode 100644
index 0000000000..3c1f70999f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/_config.js
@@ -0,0 +1,30 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target }) {
+		let [btn1, btn2] = target.querySelectorAll('button');
+
+		flushSync(() => {
+			btn1.click();
+		});
+
+		flushSync(() => {
+			btn2.click();
+		});
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>Activate</button><button>Toggle</button>\nneighba\nneighba`
+		);
+
+		flushSync(() => {
+			btn2.click();
+		});
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>Activate</button><button>Toggle</button>\nzeeba\nzeeba`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/main.svelte
new file mode 100644
index 0000000000..7c32ed0513
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-3/main.svelte
@@ -0,0 +1,49 @@
+<script>
+  import { untrack } from 'svelte';
+
+  class Model {
+    data = $state();
+
+    constructor(data) {
+      this.data = data;
+    }
+
+    name = $derived(this.data?.name);
+    source = $derived(this.data?.source);
+
+    toggle() {
+      this.data.name = this.data.name === 'zeeba' ? 'neighba' : 'zeeba';
+    }
+  }
+
+	let model = $state(new Model({ name: 'zeeba', source: 'initial' }));
+
+  let setModel = (source) => {
+		let next = new Model({ name: 'zeeba', source });
+		model = next;
+  }
+
+  let needsSet = $state(false);
+
+  $effect(() => {
+    if(needsSet) {
+      setModel('effect');
+      untrack(() => {
+        needsSet = false;
+      });
+    }
+  });
+
+  let setWithEffect = () => {
+    needsSet = true;
+  };
+
+  let toggle = () => {
+    model.toggle();
+  }
+</script>
+
+<button onclick={setWithEffect}>Activate</button>
+<button onclick={toggle}>Toggle</button>
+{model.name}
+{model.data.name}