implement inheritance

Author: Rich-Harris

packages/svelte/src/internal/client/dev/ownership.js

@@ -105,6 +105,28 @@ function add_owner_to_object(object, owner) {
 	}
 }
 
+/**
+ * @param {any} object
+ */
+export function strip_owner(object) {
+	untrack(() => {
+		strip_owner_from_object(object);
+	});
+}
+
+/**
+ * @param {any} object
+ */
+function strip_owner_from_object(object) {
+	if (object?.[STATE_SYMBOL]?.o) {
+		object[STATE_SYMBOL].o = null;
+
+		for (const key in object) {
+			strip_owner(object[key]);
+		}
+	}
+}
+
 /**
  * @param {Set<Function>} owners
  */

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

@@ -21,7 +21,7 @@ import {
 	is_frozen,
 	object_prototype
 } from './utils.js';
-import { check_ownership } from './dev/ownership.js';
+import { add_owner, check_ownership, strip_owner } from './dev/ownership.js';
 
 export const STATE_SYMBOL = Symbol('$state');
 
@@ -39,7 +39,20 @@ export function proxy(value, immutable = true, owners) {
 			const metadata = /** @type {import('./types.js').ProxyMetadata<T>} */ (value[STATE_SYMBOL]);
 			// ...unless the proxy belonged to a different object, because
 			// someone copied the state symbol using `Reflect.ownKeys(...)`
-			if (metadata.t === value || metadata.p === value) return metadata.p;
+			if (metadata.t === value || metadata.p === value) {
+				if (DEV) {
+					// update ownership
+					if (owners) {
+						for (const owner of owners) {
+							add_owner(value, owner);
+						}
+					} else {
+						strip_owner(value);
+					}
+				}
+
+				return metadata.p;
+			}
 		}
 
 		const prototype = get_prototype_of(value);
@@ -249,8 +262,6 @@ const state_proxy_handler = {
 		const s = metadata.s.get(prop);
 		if (s !== undefined) {
 			set(s, proxy(value, metadata.i, metadata.o));
-		} else if (DEV) {
-			// TODO transfer ownership, in case it differs
 		}
 		const is_array = metadata.a;
 		const not_has = !(prop in target);

packages/svelte/tests/helpers.js

@@ -81,7 +81,11 @@ export async function compile_directory(
 		if (file.endsWith('.js')) {
 			const out = `${output_dir}/${file}`;
 			if (file.endsWith('.svelte.js')) {
-				const compiled = compileModule(text, opts);
+				const compiled = compileModule(text, {
+					filename: opts.filename,
+					generate: opts.generate,
+					dev: opts.dev
+				});
 				write(out, compiled.js.code);
 			} else {
 				// for non-runes tests, just re-export from the original source file — this

packages/svelte/tests/runtime-runes/samples/non-local-mutation-inherited-owner/Counter.svelte

@@ -0,0 +1,7 @@
+<script>
+	import { global } from './state.svelte.js';
+</script>
+
+<button onclick={() => global.object.count += 1}>
+	clicks: {global.object.count}
+</button>

packages/svelte/tests/runtime-runes/samples/non-local-mutation-inherited-owner/_config.js

@@ -0,0 +1,37 @@
+import { test } from '../../test';
+
+/** @type {typeof console.warn} */
+let warn;
+
+/** @type {any[]} */
+let warnings = [];
+
+export default test({
+	html: `<button>clicks: 0</button>`,
+
+	compileOptions: {
+		dev: true
+	},
+
+	before_test: () => {
+		warn = console.warn;
+
+		console.warn = (...args) => {
+			warnings.push(...args);
+		};
+	},
+
+	after_test: () => {
+		console.warn = warn;
+		warnings = [];
+	},
+
+	async test({ assert, target }) {
+		const btn = target.querySelector('button');
+		await btn?.click();
+
+		assert.htmlEqual(target.innerHTML, `<button>clicks: 1</button>`);
+
+		assert.deepEqual(warnings, []);
+	}
+});

packages/svelte/tests/runtime-runes/samples/non-local-mutation-inherited-owner/main.svelte

@@ -0,0 +1,9 @@
+<script>
+	import Counter from './Counter.svelte';
+	import { global } from './state.svelte.js';
+
+	let object = $state({ count: 0 });
+	global.object = object;
+</script>
+
+<Counter />

packages/svelte/tests/runtime-runes/samples/non-local-mutation-inherited-owner/state.svelte.js

@@ -0,0 +1,3 @@
+export let global = $state({
+	object: { count: -1 }
+});