]> git.ipfire.org Git - thirdparty/vuejs/core.git/commitdiff
fix(runtime-dom): fix option element value patching edge case (#4959)
authorThorsten Lünborg <t.luenborg@googlemail.com>
Thu, 25 Nov 2021 10:05:02 +0000 (11:05 +0100)
committerGitHub <noreply@github.com>
Thu, 25 Nov 2021 10:05:02 +0000 (05:05 -0500)
fix #4956

packages/runtime-dom/__tests__/patchProps.spec.ts
packages/runtime-dom/src/modules/props.ts

index e1ee7928c845df22bd345c277325882f4ba066ec..e2590e2e0eef82946626dee2c95bb41a857a6071 100644 (file)
@@ -29,9 +29,12 @@ describe('runtime-dom: props patching', () => {
   // so we need to add tests for other elements
   test('value for non-text input', () => {
     const el = document.createElement('option')
+    el.textContent = 'foo' // #4956
     patchProp(el, 'value', null, 'foo')
+    expect(el.getAttribute('value')).toBe('foo')
     expect(el.value).toBe('foo')
     patchProp(el, 'value', null, null)
+    el.textContent = ''
     expect(el.value).toBe('')
     // #3475
     expect(el.getAttribute('value')).toBe(null)
index d706923966f12ecb33f79598edc626eb77544157..63513f3475684e805baec1325a14654d1474db59 100644 (file)
@@ -31,7 +31,13 @@ export function patchDOMProp(
     // non-string values will be stringified.
     el._value = value
     const newValue = value == null ? '' : value
-    if (el.value !== newValue) {
+    if (
+      el.value !== newValue ||
+      // #4956: always set for OPTION elements because its value falls back to
+      // textContent if no value attribute is present. And setting .value for
+      // OPTION has no side effect
+      el.tagName === 'OPTION'
+    ) {
       el.value = newValue
     }
     if (value == null) {