Revert "fix: lazily create sources for Set (#11946)" (#11966)

This reverts commit 48fa6587c9.
pull/11940/head
Rich Harris 4 weeks ago committed by GitHub
parent 388f210183
commit 64ee32c5fe
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -1,5 +0,0 @@
---
'svelte': patch
---
fix: create sources on read for Set

@ -47,7 +47,6 @@ export class ReactiveSet extends Set {
for (const method of read_methods) {
// @ts-ignore
proto[method] = function (...v) {
this.#read_all();
get(this.#version);
// @ts-ignore
return set_proto[method].apply(this, v);
@ -87,23 +86,6 @@ export class ReactiveSet extends Set {
return super.has(value);
}
#read_all() {
var sources = this.#sources;
if (sources.size !== super.size) {
for (let value of super.values()) {
var s = sources.get(value);
if (s === undefined) {
s = source(true);
sources.set(value, s);
}
get(s);
}
}
}
/** @param {T} value */
add(value) {
var sources = this.#sources;
@ -111,6 +93,7 @@ export class ReactiveSet extends Set {
var s = sources.get(value);
if (s === undefined) {
sources.set(value, source(true));
set(this.#size, super.size);
increment(this.#version);
} else {
@ -151,19 +134,16 @@ export class ReactiveSet extends Set {
}
keys() {
this.#read_all();
get(this.#version);
return super.keys();
}
values() {
this.#read_all();
get(this.#version);
return super.values();
}
entries() {
this.#read_all();
get(this.#version);
return super.entries();
}

@ -1,28 +1,50 @@
import { flushSync } from '../../../../src/index-client';
import { ok, test } from '../../test';
import { test } from '../../test';
export default test({
html: `<button>delete initial</button><button>add</button><button>delete</button><button>clear</button><div id="output"><p>1</p><div>0</div></div>`,
html: `<button>add</button><button>delete</button><button>clear</button>`,
test({ assert, target }) {
const [btn, btn2, btn3, btn4] = target.querySelectorAll('button');
const output = target.querySelector('#output');
ok(output);
const [btn, btn2, btn3] = target.querySelectorAll('button');
flushSync(() => btn?.click());
assert.htmlEqual(output.innerHTML, `<p>0</p>`);
flushSync(() => {
btn?.click();
});
flushSync(() => btn2?.click());
assert.htmlEqual(output.innerHTML, `<p>1</p><div>1</div>`);
assert.htmlEqual(
target.innerHTML,
`<button>add</button><button>delete</button><button>clear</button><div>1</div>`
);
flushSync(() => btn2?.click());
flushSync(() => btn2?.click());
assert.htmlEqual(output.innerHTML, `<p>3</p><div>1</div><div>2</div><div>3</div>`);
flushSync(() => {
btn?.click();
});
flushSync(() => btn3?.click());
assert.htmlEqual(output.innerHTML, `<p>2</p><div>1</div><div>2</div>`);
flushSync(() => {
btn?.click();
});
flushSync(() => btn4?.click());
assert.htmlEqual(output.innerHTML, `<p>0</p>`);
assert.htmlEqual(
target.innerHTML,
`<button>add</button><button>delete</button><button>clear</button><div>1</div><div>2</div><div>3</div>`
);
flushSync(() => {
btn2?.click();
});
assert.htmlEqual(
target.innerHTML,
`<button>add</button><button>delete</button><button>clear</button><div>1</div><div>2</div>`
);
flushSync(() => {
btn3?.click();
});
assert.htmlEqual(
target.innerHTML,
`<button>add</button><button>delete</button><button>clear</button>`
);
}
});

@ -1,18 +1,21 @@
<script>
import { Set } from 'svelte/reactivity';
import {Set} from 'svelte/reactivity';
let state = new Set([0]);
let state = new Set();
</script>
<button onclick={() => state.delete(0)}>delete initial</button>
<button onclick={() => state.add(state.size + 1)}>add</button>
<button onclick={() => state.delete(state.size)}>delete</button>
<button onclick={() => state.clear()}>clear</button>
<button onclick={() => {
state.add(state.size + 1);
}}>add</button>
<div id="output">
<p>{state.size}</p>
<button onclick={() => {
state.delete(state.size);
}}>delete</button>
{#each state as item}
<div>{item}</div>
{/each}
</div>
<button onclick={() => {
state.clear();
}}>clear</button>
{#each state as item}
<div>{item}</div>
{/each}

Loading…
Cancel
Save