fix: no data duplication in reactive Set/Map (#11200)

* fix: get rid of data duplication in reactive map

* fix: get rid of data duplication in reactive set

Author: Azarattum

packages/svelte/src/reactivity/map.js

@@ -28,7 +28,6 @@ export class ReactiveMap extends Map {
 
 			for (var [key, v] of value) {
 				sources.set(key, source(v));
-				super.set(key, v);
 			}
 
 			this.#size.v = sources.size;
@@ -62,7 +61,8 @@ export class ReactiveMap extends Map {
 	forEach(callbackfn, this_arg) {
 		get(this.#version);
 
-		return super.forEach(callbackfn, this_arg);
+		var bound_callbackfn = callbackfn.bind(this_arg);
+		this.#sources.forEach((s, key) => bound_callbackfn(s.v, key, this));
 	}
 
 	/** @param {K} key */
@@ -96,7 +96,7 @@ export class ReactiveMap extends Map {
 			set(s, value);
 		}
 
-		return super.set(key, value);
+		return this;
 	}
 
 	/** @param {K} key */
@@ -105,13 +105,14 @@ export class ReactiveMap extends Map {
 		var s = sources.get(key);
 
 		if (s !== undefined) {
-			sources.delete(key);
+			var removed = sources.delete(key);
 			set(this.#size, sources.size);
 			set(s, /** @type {V} */ (UNINITIALIZED));
 			this.#increment_version();
+			return removed;
 		}
 
-		return super.delete(key);
+		return false;
 	}
 
 	clear() {
@@ -126,7 +127,6 @@ export class ReactiveMap extends Map {
 		}
 
 		sources.clear();
-		super.clear();
 	}
 
 	keys() {

packages/svelte/src/reactivity/map.test.ts

@@ -124,6 +124,40 @@ test('map.has(...)', () => {
 	cleanup();
 });
 
+test('map.forEach(...)', () => {
+	const map = new ReactiveMap([
+		[1, 1],
+		[2, 2],
+		[3, 3]
+	]);
+
+	const log: any = [];
+	const this_arg = {};
+
+	map.forEach(function (this: unknown, ...args) {
+		log.push([...args, this]);
+	}, this_arg);
+
+	assert.deepEqual(log, [
+		[1, 1, map, this_arg],
+		[2, 2, map, this_arg],
+		[3, 3, map, this_arg]
+	]);
+});
+
+test('map.delete(...)', () => {
+	const map = new ReactiveMap([
+		[1, 1],
+		[2, 2],
+		[3, 3]
+	]);
+
+	assert.equal(map.delete(3), true);
+	assert.equal(map.delete(3), false);
+
+	assert.deepEqual(Array.from(map.values()), [1, 2]);
+});
+
 test('map handling of undefined values', () => {
 	const map = new ReactiveMap();
 

packages/svelte/src/reactivity/set.js

@@ -31,7 +31,6 @@ export class ReactiveSet extends Set {
 
 			for (var element of value) {
 				sources.set(element, source(true));
-				super.add(element);
 			}
 
 			this.#size.v = sources.size;
@@ -97,7 +96,7 @@ export class ReactiveSet extends Set {
 			this.#increment_version();
 		}
 
-		return super.add(value);
+		return this;
 	}
 
 	/** @param {T} value */
@@ -106,13 +105,14 @@ export class ReactiveSet extends Set {
 		var s = sources.get(value);
 
 		if (s !== undefined) {
-			sources.delete(value);
+			var removed = sources.delete(value);
 			set(this.#size, sources.size);
 			set(s, false);
 			this.#increment_version();
+			return removed;
 		}
 
-		return super.delete(value);
+		return false;
 	}
 
 	clear() {
@@ -127,7 +127,6 @@ export class ReactiveSet extends Set {
 		}
 
 		sources.clear();
-		super.clear();
 	}
 
 	keys() {

packages/svelte/src/reactivity/set.test.ts

@@ -77,3 +77,12 @@ test('set.has(...)', () => {
 
 	cleanup();
 });
+
+test('set.delete(...)', () => {
+	const set = new ReactiveSet([1, 2, 3]);
+
+	assert.equal(set.delete(3), true);
+	assert.equal(set.delete(3), false);
+
+	assert.deepEqual(Array.from(set.values()), [1, 2]);
+});