From 1661fa86c9fcfb26d60315751414c7fd7a924e2d Mon Sep 17 00:00:00 2001
From: Doctorwu <doctorwu@moego.pet>
Date: Tue, 27 Feb 2024 11:00:17 +0800
Subject: [PATCH 1/5] fix(runtime-dom): avoid unset option's value

close #10412
re-fix #10396
---
 packages/runtime-dom/src/modules/props.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts
index e9b3bca357d..4d4b2359cdd 100644
--- a/packages/runtime-dom/src/modules/props.ts
+++ b/packages/runtime-dom/src/modules/props.ts
@@ -34,13 +34,17 @@ export function patchDOMProp(
     // custom elements may use _value internally
     !tag.includes('-')
   ) {
+    const mounted = '_value' in el
     // store value as _value as well since
     // non-string values will be stringified.
     el._value = value
     // #4956: <option> value will fallback to its text content so we need to
     // compare against its attribute value instead.
-    const oldValue =
-      tag === 'OPTION' ? el.getAttribute('value') || '' : el.value
+    let oldValue = el.value
+    if (tag === 'OPTION') {
+      const attrValue = el.getAttribute('value')
+      oldValue = mounted ? attrValue || '' : attrValue
+    }
     const newValue = value == null ? '' : value
     if (oldValue !== newValue) {
       el.value = newValue

From b8aff0b9a0e1d3486b4cac8bdf178b9f67aae405 Mon Sep 17 00:00:00 2001
From: Doctorwu <doctorwu@moego.pet>
Date: Tue, 27 Feb 2024 11:30:20 +0800
Subject: [PATCH 2/5] test: add test case

---
 packages/runtime-dom/__tests__/patchProps.spec.ts | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts
index 7c356f1a66c..f602001624c 100644
--- a/packages/runtime-dom/__tests__/patchProps.spec.ts
+++ b/packages/runtime-dom/__tests__/patchProps.spec.ts
@@ -278,7 +278,7 @@ describe('runtime-dom: props patching', () => {
       ]),
       root,
     )
-    const el = root.children[0] as HTMLSelectElement
+    const el = root.children[0] as HTMLOptionElement
     expect(el.value).toBe('foo')
 
     render(
@@ -291,6 +291,16 @@ describe('runtime-dom: props patching', () => {
     expect(el.value).toBe('baz')
   })
 
+  test('init empty value for option', () => {
+    const root = document.createElement('div')
+    render(
+      h('select', { value: 'foo' }, [h('option', { value: '' }, 'foo')]),
+      root,
+    )
+    const el = root.children[0] as HTMLOptionElement
+    expect(el.value).toBe('')
+  })
+
   // #8780
   test('embedded tag with width and height', () => {
     // Width and height of some embedded element such as img、video、source、canvas

From 03ed4a955e5edb846f19f62cc20abe32cbf09b66 Mon Sep 17 00:00:00 2001
From: Doctorwu <doctorwu@moego.pet>
Date: Tue, 27 Feb 2024 22:03:18 +0800
Subject: [PATCH 3/5] fix: fix test case

---
 packages/runtime-dom/__tests__/patchProps.spec.ts | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts
index f602001624c..61dd98513ce 100644
--- a/packages/runtime-dom/__tests__/patchProps.spec.ts
+++ b/packages/runtime-dom/__tests__/patchProps.spec.ts
@@ -278,7 +278,7 @@ describe('runtime-dom: props patching', () => {
       ]),
       root,
     )
-    const el = root.children[0] as HTMLOptionElement
+    const el = root.children[0] as HTMLSelectElement
     expect(el.value).toBe('foo')
 
     render(
@@ -297,8 +297,10 @@ describe('runtime-dom: props patching', () => {
       h('select', { value: 'foo' }, [h('option', { value: '' }, 'foo')]),
       root,
     )
-    const el = root.children[0] as HTMLOptionElement
-    expect(el.value).toBe('')
+    const select = root.children[0] as HTMLSelectElement
+    const option = select.children[0] as HTMLOptionElement
+    expect(select.value).toBe('')
+    expect(option.value).toBe('')
   })
 
   // #8780

From c799b0005ee44aad09c298df1e79f9796e3f41f8 Mon Sep 17 00:00:00 2001
From: Doctorwu <doctorwu@moego.pet>
Date: Wed, 28 Feb 2024 10:02:41 +0800
Subject: [PATCH 4/5] feat: add comment

---
 packages/runtime-dom/src/modules/props.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts
index 4d4b2359cdd..4ff43f2effb 100644
--- a/packages/runtime-dom/src/modules/props.ts
+++ b/packages/runtime-dom/src/modules/props.ts
@@ -43,6 +43,12 @@ export function patchDOMProp(
     let oldValue = el.value
     if (tag === 'OPTION') {
       const attrValue = el.getAttribute('value')
+      // #10396
+      // avoid always resetting nullish option value
+      // use '' as oldValue when attrValue is falsy
+      // #10416
+      // but keep as the original attrValue when dom hasn't been mounted
+      // so that el.value can be initialized when option initial value is ''
       oldValue = mounted ? attrValue || '' : attrValue
     }
     const newValue = value == null ? '' : value

From 88a5af732445a7120b80b97ecc1f9755066a1a56 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Wed, 28 Feb 2024 19:02:32 +0800
Subject: [PATCH 5/5] Update props.ts

---
 packages/runtime-dom/src/modules/props.ts | 22 ++++++----------------
 1 file changed, 6 insertions(+), 16 deletions(-)

diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts
index 4ff43f2effb..c4bb4987b8c 100644
--- a/packages/runtime-dom/src/modules/props.ts
+++ b/packages/runtime-dom/src/modules/props.ts
@@ -34,30 +34,20 @@ export function patchDOMProp(
     // custom elements may use _value internally
     !tag.includes('-')
   ) {
-    const mounted = '_value' in el
-    // store value as _value as well since
-    // non-string values will be stringified.
-    el._value = value
     // #4956: <option> value will fallback to its text content so we need to
     // compare against its attribute value instead.
-    let oldValue = el.value
-    if (tag === 'OPTION') {
-      const attrValue = el.getAttribute('value')
-      // #10396
-      // avoid always resetting nullish option value
-      // use '' as oldValue when attrValue is falsy
-      // #10416
-      // but keep as the original attrValue when dom hasn't been mounted
-      // so that el.value can be initialized when option initial value is ''
-      oldValue = mounted ? attrValue || '' : attrValue
-    }
+    const oldValue =
+      tag === 'OPTION' ? el.getAttribute('value') || '' : el.value
     const newValue = value == null ? '' : value
-    if (oldValue !== newValue) {
+    if (oldValue !== newValue || !('_value' in el)) {
       el.value = newValue
     }
     if (value == null) {
       el.removeAttribute(key)
     }
+    // store value as _value as well since
+    // non-string values will be stringified.
+    el._value = value
     return
   }