fix(shared): handle more Symbol cases in toDisplayString

vuejs · Dec 7, 2023 · 983d45d · 983d45d
1 parent 364821d
commit 983d45d
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 8 deletions.
diff --git a/packages/shared/__tests__/toDisplayString.spec.ts b/packages/shared/__tests__/toDisplayString.spec.ts
@@ -181,10 +181,10 @@ describe('toDisplayString', () => {
     ])
     expect(toDisplayString(m)).toMatchInlineSnapshot(`
       "{
-        \\"Map(3)\\": {
-          \\"Symbol(0) =>\\": \\"foo\\",
-          \\"Symbol(1) =>\\": \\"bar\\",
-          \\"Symbol(baz) =>\\": \\"baz\\"
+        "Map(3)": {
+          "Symbol(0) =>": "foo",
+          "Symbol(1) =>": "bar",
+          "Symbol(baz) =>": "baz"
         }
       }"
     `)
@@ -193,4 +193,27 @@ describe('toDisplayString', () => {
       String(Symbol('foo'))
     )
   })
+
+  test('Set with Symbol values', () => {
+    const s = new Set([Symbol('foo'), Symbol('bar'), Symbol()])
+    expect(toDisplayString(s)).toMatchInlineSnapshot(`
+      "{
+        "Set(3)": [
+          "Symbol(foo)",
+          "Symbol(bar)",
+          "Symbol()"
+        ]
+      }"
+    `)
+  })
+
+  test('Object with Symbol values', () => {
+    expect(toDisplayString({ foo: Symbol('x'), bar: Symbol() }))
+      .toMatchInlineSnapshot(`
+      "{
+        "foo": "Symbol(x)",
+        "bar": "Symbol()"
+      }"
+    `)
+  })
 })
diff --git a/packages/shared/src/toDisplayString.ts b/packages/shared/src/toDisplayString.ts
@@ -34,20 +34,24 @@ const replacer = (_key: string, val: any): any => {
     return {
       [`Map(${val.size})`]: [...val.entries()].reduce(
         (entries, [key, val], i) => {
-          entries[
-            `${isSymbol(key) ? `Symbol(${key.description ?? i})` : key} =>`
-          ] = val
+          entries[stringiySymbol(key, i) + ' =>'] = val
           return entries
         },
         {} as Record<string, any>
       )
     }
   } else if (isSet(val)) {
     return {
-      [`Set(${val.size})`]: [...val.values()]
+      [`Set(${val.size})`]: [...val.values()].map(v => stringiySymbol(v))
     }
+  } else if (isSymbol(val)) {
+    return stringiySymbol(val)
   } else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
+    // native elements
     return String(val)
   }
   return val
 }
+
+const stringiySymbol = (v: unknown, i: number | string = ''): any =>
+  isSymbol(v) ? `Symbol(${v.description ?? i})` : v