diff --git a/.changeset/tiny-poems-doubt.md b/.changeset/tiny-poems-doubt.md deleted file mode 100644 index b908d95df2..0000000000 --- a/.changeset/tiny-poems-doubt.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"svelte": patch ---- - -feat: allow inspect reactivity map, set, date diff --git a/packages/svelte/src/internal/client/constants.js b/packages/svelte/src/internal/client/constants.js index 7a6e65c068..b9953b2ec6 100644 --- a/packages/svelte/src/internal/client/constants.js +++ b/packages/svelte/src/internal/client/constants.js @@ -16,4 +16,3 @@ export const EFFECT_RAN = 1 << 13; export const EFFECT_TRANSPARENT = 1 << 14; export const STATE_SYMBOL = Symbol('$state'); -export const INSPECT_SYMBOL = Symbol('$inspect'); diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js index aa59baf94c..fe93eb47e4 100644 --- a/packages/svelte/src/internal/client/runtime.js +++ b/packages/svelte/src/internal/client/runtime.js @@ -27,8 +27,7 @@ import { BRANCH_EFFECT, STATE_SYMBOL, BLOCK_EFFECT, - ROOT_EFFECT, - INSPECT_SYMBOL + ROOT_EFFECT } from './constants.js'; import { flush_tasks } from './dom/task.js'; import { add_owner } from './dev/ownership.js'; @@ -1118,24 +1117,6 @@ export function pop(component) { return component || /** @type {T} */ ({}); } -/** - * - * This is called from the inspect. - * Deeply traverse every item in the array with `deep_read` to register for inspect callback - * If the item implements INSPECT_SYMBOL, will use that instead - * @param {Array} value - * @returns {void} - */ -function deep_read_inpect(value) { - for (const item of value) { - if (item && typeof item[INSPECT_SYMBOL] === 'function') { - item[INSPECT_SYMBOL](); - } else { - deep_read(item); - } - } -} - /** * Possibly traverse an object and read all its properties so that they're all reactive in case this is `$state`. * Does only check first level of an object for performance reasons (heuristic should be good for 99% of all cases). @@ -1266,7 +1247,7 @@ export function inspect(get_value, inspect = console.log) { inspect_fn = fn; const value = get_value(); - deep_read_inpect(value); + deep_read(value); inspect_fn = null; const signals = inspect_captured_signals.slice(); diff --git a/packages/svelte/src/reactivity/date.js b/packages/svelte/src/reactivity/date.js index 302f58ab17..cf43dfe4ab 100644 --- a/packages/svelte/src/reactivity/date.js +++ b/packages/svelte/src/reactivity/date.js @@ -1,5 +1,3 @@ -import { DEV } from 'esm-env'; -import { INSPECT_SYMBOL } from '../internal/client/constants.js'; import { source, set } from '../internal/client/reactivity/sources.js'; import { get } from '../internal/client/runtime.js'; @@ -90,13 +88,6 @@ export class ReactiveDate extends Date { return v; }; } - - if (DEV) { - // @ts-ignore - proto[INSPECT_SYMBOL] = function () { - get(this.#raw_time); - }; - } } } diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js index 873a7a1f7a..b2b3ab605b 100644 --- a/packages/svelte/src/reactivity/map.js +++ b/packages/svelte/src/reactivity/map.js @@ -3,9 +3,6 @@ import { source, set } from '../internal/client/reactivity/sources.js'; import { get } from '../internal/client/runtime.js'; import { UNINITIALIZED } from '../constants.js'; import { map } from './utils.js'; -import { INSPECT_SYMBOL } from '../internal/client/constants.js'; - -var inited = false; /** * @template K @@ -23,22 +20,6 @@ export class ReactiveMap extends Map { constructor(value) { super(); - if (DEV) { - if (!inited) { - inited = true; - // @ts-ignore - ReactiveMap.prototype[INSPECT_SYMBOL] = function () { - // changes could either introduced by - // - modifying the value, or - // - add / remove entries to the map - for (const [, source] of this.#sources) { - get(source); - } - get(this.#size); - }; - } - } - // If the value is invalid then the native exception will fire here if (DEV) new Map(value); diff --git a/packages/svelte/src/reactivity/set.js b/packages/svelte/src/reactivity/set.js index d3eb1cccaf..1855090cdf 100644 --- a/packages/svelte/src/reactivity/set.js +++ b/packages/svelte/src/reactivity/set.js @@ -2,7 +2,6 @@ import { DEV } from 'esm-env'; import { source, set } from '../internal/client/reactivity/sources.js'; import { get } from '../internal/client/runtime.js'; import { map } from './utils.js'; -import { INSPECT_SYMBOL } from '../internal/client/constants.js'; var read_methods = ['forEach', 'isDisjointFrom', 'isSubsetOf', 'isSupersetOf']; var set_like_methods = ['difference', 'intersection', 'symmetricDifference', 'union']; @@ -66,13 +65,6 @@ export class ReactiveSet extends Set { return new ReactiveSet(set); }; } - - if (DEV) { - // @ts-ignore - proto[INSPECT_SYMBOL] = function () { - get(this.#version); - }; - } } #increment_version() { diff --git a/packages/svelte/src/reactivity/url.js b/packages/svelte/src/reactivity/url.js index df0551fe06..3f11a4af37 100644 --- a/packages/svelte/src/reactivity/url.js +++ b/packages/svelte/src/reactivity/url.js @@ -1,11 +1,7 @@ -import { DEV } from 'esm-env'; -import { INSPECT_SYMBOL } from '../internal/client/constants.js'; import { source, set } from '../internal/client/reactivity/sources.js'; import { get } from '../internal/client/runtime.js'; const REPLACE = Symbol(); -var inited_url = false; -var inited_search_params = false; export class ReactiveURL extends URL { #protocol = source(super.protocol); @@ -25,14 +21,6 @@ export class ReactiveURL extends URL { url = new URL(url, base); super(url); this.#searchParams[REPLACE](url.searchParams); - - if (DEV && !inited_url) { - inited_url = true; - // @ts-ignore - ReactiveURL.prototype[INSPECT_SYMBOL] = function () { - this.href; - }; - } } get hash() { @@ -171,17 +159,6 @@ export class ReactiveURLSearchParams extends URLSearchParams { set(this.#version, this.#version.v + 1); } - constructor() { - super(); - if (DEV && !inited_search_params) { - inited_search_params = true; - // @ts-ignore - ReactiveURLSearchParams.prototype[INSPECT_SYMBOL] = function () { - get(this.#version); - }; - } - } - /** * @param {URLSearchParams} params */ diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/_config.js deleted file mode 100644 index 89dfc1c729..0000000000 --- a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/_config.js +++ /dev/null @@ -1,81 +0,0 @@ -import { test } from '../../test'; -import { flushSync } from 'svelte'; -import { log } from './log'; - -export default test({ - compileOptions: { - dev: true - }, - before_test() { - log.length = 0; - }, - async test({ assert, target }) { - const [in1, in2] = target.querySelectorAll('input'); - const [b1, b2, b3] = target.querySelectorAll('button'); - - assert.deepEqual(log, [ - { label: 'map', type: 'init', values: [] }, - { label: 'set', type: 'init', values: [] }, - { label: 'date', type: 'init', values: 1712966400000 } - ]); - log.length = 0; - - flushSync(() => b1.click()); // map.set('key', 'value') - - in1.value = 'name'; - in2.value = 'Svelte'; - in1.dispatchEvent(new window.Event('input', { bubbles: true })); - in2.dispatchEvent(new window.Event('input', { bubbles: true })); - flushSync(() => b1.click()); // map.set('name', 'Svelte') - - in2.value = 'World'; - in2.dispatchEvent(new window.Event('input', { bubbles: true })); - flushSync(() => b1.click()); // map.set('name', 'World') - flushSync(() => b1.click()); // map.set('name', 'World') - - assert.deepEqual(log, [ - { label: 'map', type: 'update', values: [['key', 'value']] }, - { - label: 'map', - type: 'update', - values: [ - ['key', 'value'], - ['name', 'Svelte'] - ] - }, - { - label: 'map', - type: 'update', - values: [ - ['key', 'value'], - ['name', 'World'] - ] - } - ]); - log.length = 0; - - flushSync(() => b2.click()); // set.add('name'); - - in1.value = 'Svelte'; - in1.dispatchEvent(new window.Event('input', { bubbles: true })); - flushSync(() => b2.click()); // set.add('Svelte'); - - flushSync(() => b2.click()); // set.add('Svelte'); - - assert.deepEqual(log, [ - { label: 'set', type: 'update', values: ['name'] }, - { label: 'set', type: 'update', values: ['name', 'Svelte'] } - ]); - log.length = 0; - - flushSync(() => b3.click()); // date.minutes++ - flushSync(() => b3.click()); // date.minutes++ - flushSync(() => b3.click()); // date.minutes++ - - assert.deepEqual(log, [ - { label: 'date', type: 'update', values: 1712966460000 }, - { label: 'date', type: 'update', values: 1712966520000 }, - { label: 'date', type: 'update', values: 1712966580000 } - ]); - } -}); diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/log.js b/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/log.js deleted file mode 100644 index d3df521f4d..0000000000 --- a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/log.js +++ /dev/null @@ -1,2 +0,0 @@ -/** @type {any[]} */ -export const log = []; diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/main.svelte deleted file mode 100644 index 3bbe39a46e..0000000000 --- a/packages/svelte/tests/runtime-runes/samples/inspect-reactivity/main.svelte +++ /dev/null @@ -1,27 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts index b5c5b946e8..d03a7b553d 100644 --- a/packages/svelte/types/index.d.ts +++ b/packages/svelte/types/index.d.ts @@ -2021,7 +2021,6 @@ declare module 'svelte/reactivity' { #private; } class ReactiveURLSearchParams extends URLSearchParams { - constructor(); [REPLACE](params: URLSearchParams): void; #private;