diff --git a/.changeset/rotten-bags-type.md b/.changeset/rotten-bags-type.md new file mode 100644 index 0000000000..0a69089e93 --- /dev/null +++ b/.changeset/rotten-bags-type.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: correctly reflect readonly proxy marker diff --git a/packages/svelte/src/internal/client/proxy/proxy.js b/packages/svelte/src/internal/client/proxy/proxy.js index eb392749e0..105bbe4e20 100644 --- a/packages/svelte/src/internal/client/proxy/proxy.js +++ b/packages/svelte/src/internal/client/proxy/proxy.js @@ -149,8 +149,9 @@ const handler = { }, get(target, prop, receiver) { - if (DEV && prop === READONLY_SYMBOL) return target[READONLY_SYMBOL]; - + if (DEV && prop === READONLY_SYMBOL) { + return Reflect.get(target, READONLY_SYMBOL); + } const metadata = target[STATE_SYMBOL]; let s = metadata.s.get(prop); @@ -184,6 +185,9 @@ const handler = { }, has(target, prop) { + if (DEV && prop === READONLY_SYMBOL) { + return Reflect.has(target, READONLY_SYMBOL); + } if (prop === STATE_SYMBOL) { return true; } diff --git a/packages/svelte/tests/runtime-runes/samples/state-readonly/Component.svelte b/packages/svelte/tests/runtime-runes/samples/state-readonly/Component.svelte new file mode 100644 index 0000000000..9916a9abe0 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/state-readonly/Component.svelte @@ -0,0 +1,11 @@ + + + + diff --git a/packages/svelte/tests/runtime-runes/samples/state-readonly/Component2.svelte b/packages/svelte/tests/runtime-runes/samples/state-readonly/Component2.svelte new file mode 100644 index 0000000000..88575acd3c --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/state-readonly/Component2.svelte @@ -0,0 +1,5 @@ + + +{state} diff --git a/packages/svelte/tests/runtime-runes/samples/state-readonly/_config.js b/packages/svelte/tests/runtime-runes/samples/state-readonly/_config.js new file mode 100644 index 0000000000..a1f7effeae --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/state-readonly/_config.js @@ -0,0 +1,13 @@ +import { test } from '../../test'; + +export default test({ + compileOptions: { + dev: true + }, + async test({ assert, target }) { + const btn = target.querySelector('button'); + + await btn?.click(); + assert.htmlEqual(target.innerHTML, `\n[object Object]`); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/state-readonly/main.svelte b/packages/svelte/tests/runtime-runes/samples/state-readonly/main.svelte new file mode 100644 index 0000000000..ec6cc9aeba --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/state-readonly/main.svelte @@ -0,0 +1,12 @@ + + + +{#if state} + +{/if}