fix(runtime-core/vnode): should not render boolean values in vnode ch…

…ildren (close #574)
vuejs · Jan 6, 2020 · 84dc5a6 · 84dc5a6
1 parent 137893a
commit 84dc5a6
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/packages/runtime-core/__tests__/vnode.spec.ts b/packages/runtime-core/__tests__/vnode.spec.ts
@@ -120,6 +120,12 @@ describe('vnode', () => {
     expect(normalizeVNode(null)).toMatchObject({ type: Comment })
     expect(normalizeVNode(undefined)).toMatchObject({ type: Comment })
 
+    // boolean -> Comment
+    // this is for usage like `someBoolean && h('div')` and behavior consistency
+    // with 2.x (#574)
+    expect(normalizeVNode(true)).toMatchObject({ type: Comment })
+    expect(normalizeVNode(false)).toMatchObject({ type: Comment })
+
     // array -> Fragment
     expect(normalizeVNode(['foo'])).toMatchObject({ type: Fragment })
 
@@ -137,7 +143,6 @@ describe('vnode', () => {
     // primitive types
     expect(normalizeVNode('foo')).toMatchObject({ type: Text, children: `foo` })
     expect(normalizeVNode(1)).toMatchObject({ type: Text, children: `1` })
-    expect(normalizeVNode(true)).toMatchObject({ type: Text, children: `true` })
   })
 
   test('type shapeFlag inference', () => {

diff --git a/packages/runtime-core/src/vnode.ts b/packages/runtime-core/src/vnode.ts
@@ -337,7 +337,7 @@ export function createCommentVNode(
 }
 
 export function normalizeVNode<T, U>(child: VNodeChild<T, U>): VNode<T, U> {
-  if (child == null) {
+  if (child == null || typeof child === 'boolean') {
     // empty placeholder
     return createVNode(Comment)
   } else if (isArray(child)) {
@@ -348,7 +348,7 @@ export function normalizeVNode<T, U>(child: VNodeChild<T, U>): VNode<T, U> {
     // always produce all-vnode children arrays
     return child.el === null ? child : cloneVNode(child)
   } else {
-    // primitive types
+    // strings and numbers
     return createVNode(Text, null, String(child))
   }
 }