From 188f3ae533fd340603068a516a8fecc5d57426c5 Mon Sep 17 00:00:00 2001
From: Xu Wei <616525957@qq.com>
Date: Mon, 10 Jun 2024 17:01:56 +0800
Subject: [PATCH] fix(runtime-dom): support Symbol for input value bindings 
 (#10608)

close #10597
---
 .../runtime-dom/__tests__/patchAttrs.spec.ts     | 16 ++++++++++++++++
 packages/runtime-dom/src/modules/attrs.ts        |  3 ++-
 packages/runtime-dom/src/modules/props.ts        |  2 +-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/packages/runtime-dom/__tests__/patchAttrs.spec.ts b/packages/runtime-dom/__tests__/patchAttrs.spec.ts
index f06fb4a5ea6..8436bbb4f96 100644
--- a/packages/runtime-dom/__tests__/patchAttrs.spec.ts
+++ b/packages/runtime-dom/__tests__/patchAttrs.spec.ts
@@ -53,4 +53,20 @@ describe('runtime-dom: attrs patching', () => {
     patchProp(el, 'onwards', 'a', null)
     expect(el.getAttribute('onwards')).toBe(null)
   })
+
+  // #10597
+  test('should allow setting attribute to symbol', () => {
+    const el = document.createElement('div')
+    const symbol = Symbol('foo')
+    patchProp(el, 'foo', null, symbol)
+    expect(el.getAttribute('foo')).toBe(symbol.toString())
+  })
+
+  // #10598
+  test('should allow setting value to symbol', () => {
+    const el = document.createElement('input')
+    const symbol = Symbol('foo')
+    patchProp(el, 'value', null, symbol)
+    expect(el.value).toBe(symbol.toString())
+  })
 })
diff --git a/packages/runtime-dom/src/modules/attrs.ts b/packages/runtime-dom/src/modules/attrs.ts
index 8d8c10c31bf..8218e182fb6 100644
--- a/packages/runtime-dom/src/modules/attrs.ts
+++ b/packages/runtime-dom/src/modules/attrs.ts
@@ -36,7 +36,8 @@ export function patchAttr(
     if (value == null || (isBoolean && !includeBooleanAttr(value))) {
       el.removeAttribute(key)
     } else {
-      el.setAttribute(key, isBoolean ? '' : value)
+      // attribute value is a string https://html.spec.whatwg.org/multipage/dom.html#attributes
+      el.setAttribute(key, isBoolean ? '' : String(value))
     }
   }
 }
diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts
index c4bb4987b8c..2eb83ea39f7 100644
--- a/packages/runtime-dom/src/modules/props.ts
+++ b/packages/runtime-dom/src/modules/props.ts
@@ -38,7 +38,7 @@ export function patchDOMProp(
     // compare against its attribute value instead.
     const oldValue =
       tag === 'OPTION' ? el.getAttribute('value') || '' : el.value
-    const newValue = value == null ? '' : value
+    const newValue = value == null ? '' : String(value)
     if (oldValue !== newValue || !('_value' in el)) {
       el.value = newValue
     }