From 89b2f924fc82d7f71dcb8ffbacb386fd5cf9ade2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Thu, 25 Nov 2021 11:05:02 +0100 Subject: [PATCH] fix(runtime-dom): fix option element value patching edge case (#4959) fix #4956 --- packages/runtime-dom/__tests__/patchProps.spec.ts | 3 +++ packages/runtime-dom/src/modules/props.ts | 8 +++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts index e1ee7928c84..e2590e2e0ee 100644 --- a/packages/runtime-dom/__tests__/patchProps.spec.ts +++ b/packages/runtime-dom/__tests__/patchProps.spec.ts @@ -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) diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts index d706923966f..63513f34756 100644 --- a/packages/runtime-dom/src/modules/props.ts +++ b/packages/runtime-dom/src/modules/props.ts @@ -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) {