From: Evan You <yyx990803@gmail.com>
Date: Tue, 14 Jul 2020 20:25:21 +0000 (-0400)
Subject: fix(runtime-dom): remove attrs with nullish values
X-Git-Tag: v3.0.0-beta.21~4
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=cb6a0915c540af94f5d79c311022b99bc17f2965;p=thirdparty%2Fvuejs%2Fcore.git

fix(runtime-dom): remove attrs with nullish values

fix #1576
---

diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts
index 402950b435..f2f3dfdf15 100644
--- a/packages/runtime-dom/__tests__/patchProps.spec.ts
+++ b/packages/runtime-dom/__tests__/patchProps.spec.ts
@@ -107,4 +107,21 @@ describe('runtime-dom: props patching', () => {
 
     expect(`Failed setting prop "someProp" on <div>`).toHaveBeenWarnedLast()
   })
+
+  // #1576
+  test('remove attribute when value is falsy', () => {
+    const el = document.createElement('div')
+    patchProp(el, 'id', null, '')
+    expect(el.hasAttribute('id')).toBe(true)
+    patchProp(el, 'id', null, null)
+    expect(el.hasAttribute('id')).toBe(false)
+
+    patchProp(el, 'id', null, '')
+    expect(el.hasAttribute('id')).toBe(true)
+    patchProp(el, 'id', null, undefined)
+    expect(el.hasAttribute('id')).toBe(false)
+
+    patchProp(el, 'id', null, '')
+    expect(el.hasAttribute('id')).toBe(true)
+  })
 })
diff --git a/packages/runtime-dom/src/modules/props.ts b/packages/runtime-dom/src/modules/props.ts
index 988cbb4ead..ebecc8972c 100644
--- a/packages/runtime-dom/src/modules/props.ts
+++ b/packages/runtime-dom/src/modules/props.ts
@@ -37,6 +37,7 @@ export function patchDOMProp(
   } else if (value == null && typeof el[key] === 'string') {
     // e.g. <div :id="null">
     el[key] = ''
+    el.removeAttribute(key)
   } else {
     // some properties perform value validation and throw
     try {