From d1976c07ff630878f1b59d7e0eceb4174362e4ed Mon Sep 17 00:00:00 2001
From: Tan Li Hau <tanhauhau@users.noreply.github.com>
Date: Mon, 15 Apr 2024 00:50:11 +0800
Subject: [PATCH] fix: fix string name of reactive map and set iterator
 (#11169)

* fix: fix string name of reactive map and set iterator

* remove solo: true

* lint

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/shy-fishes-drive.md                      |  5 +++++
 packages/svelte/src/reactivity/map.js               |  5 +++--
 packages/svelte/src/reactivity/set.js               |  4 ++--
 packages/svelte/src/reactivity/utils.js             |  7 ++++++-
 .../samples/reactive-to-string/_config.js           | 10 ++++++++++
 .../samples/reactive-to-string/main.svelte          | 13 +++++++++++++
 6 files changed, 39 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/shy-fishes-drive.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/reactive-to-string/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/reactive-to-string/main.svelte

diff --git a/.changeset/shy-fishes-drive.md b/.changeset/shy-fishes-drive.md
new file mode 100644
index 0000000000..3c33a5282b
--- /dev/null
+++ b/.changeset/shy-fishes-drive.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: fix string name of reactive map and set iterator
diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js
index a077ad1c5a..fb1e4e848b 100644
--- a/packages/svelte/src/reactivity/map.js
+++ b/packages/svelte/src/reactivity/map.js
@@ -136,14 +136,15 @@ export class ReactiveMap extends Map {
 
 	values() {
 		get(this.#version);
-		return map(this.#sources.values(), get);
+		return map(this.#sources.values(), get, 'Map Iterator');
 	}
 
 	entries() {
 		get(this.#version);
 		return map(
 			this.#sources.entries(),
-			([key, source]) => /** @type {[K, V]} */ ([key, get(source)])
+			([key, source]) => /** @type {[K, V]} */ ([key, get(source)]),
+			'Map Iterator'
 		);
 	}
 
diff --git a/packages/svelte/src/reactivity/set.js b/packages/svelte/src/reactivity/set.js
index 0f2905b523..8a889c32d0 100644
--- a/packages/svelte/src/reactivity/set.js
+++ b/packages/svelte/src/reactivity/set.js
@@ -132,7 +132,7 @@ export class ReactiveSet extends Set {
 
 	keys() {
 		get(this.#version);
-		return this.#sources.keys();
+		return map(this.#sources.keys(), (key) => key, 'Set Iterator');
 	}
 
 	values() {
@@ -140,7 +140,7 @@ export class ReactiveSet extends Set {
 	}
 
 	entries() {
-		return map(this.keys(), (key) => /** @type {[T, T]} */ ([key, key]));
+		return map(this.keys(), (key) => /** @type {[T, T]} */ ([key, key]), 'Set Iterator');
 	}
 
 	[Symbol.iterator]() {
diff --git a/packages/svelte/src/reactivity/utils.js b/packages/svelte/src/reactivity/utils.js
index 6c5e573858..cc71bf094c 100644
--- a/packages/svelte/src/reactivity/utils.js
+++ b/packages/svelte/src/reactivity/utils.js
@@ -3,9 +3,10 @@
  * @template U
  * @param {Iterable<T>} iterable
  * @param {(value: T) => U} fn
+ * @param {string} name
  * @returns {IterableIterator<U>}
  */
-export function map(iterable, fn) {
+export function map(iterable, fn, name) {
 	return {
 		[Symbol.iterator]: get_this,
 		next() {
@@ -14,6 +15,10 @@ export function map(iterable, fn) {
 			}
 
 			return { done: true, value: undefined };
+		},
+		// @ts-expect-error
+		get [Symbol.toStringTag]() {
+			return name;
 		}
 	};
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/reactive-to-string/_config.js b/packages/svelte/tests/runtime-runes/samples/reactive-to-string/_config.js
new file mode 100644
index 0000000000..6684eeb6d2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/reactive-to-string/_config.js
@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<div>[object Set Iterator] [object Set Iterator] [object Set Iterator]</div>
+		<div>[object Set Iterator] [object Set Iterator] [object Set Iterator]</div>
+		<div>[object Map Iterator] [object Map Iterator] [object Map Iterator]</div>
+		<div>[object Map Iterator] [object Map Iterator] [object Map Iterator]</div>
+	`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/reactive-to-string/main.svelte b/packages/svelte/tests/runtime-runes/samples/reactive-to-string/main.svelte
new file mode 100644
index 0000000000..bcadd9bff0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/reactive-to-string/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	import { Set as ReactiveSet, Map as ReactiveMap } from 'svelte/reactivity';
+
+	let map = new Map();
+	let set = new Set();
+	let rmap = new ReactiveMap();
+	let rset = new ReactiveSet();
+</script>
+
+<div>{rset.entries()} {rset.keys()} {rset.values()}</div>
+<div>{set.entries()} {set.keys()} {set.values()}</div>
+<div>{rmap.entries()} {rmap.keys()} {rmap.values()}</div>
+<div>{map.entries()} {map.keys()} {map.values()}</div>
\ No newline at end of file