From 7d0ab3392af5285147db111759fe380688ca17ea Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Wed, 22 Apr 2020 14:44:45 -0400
Subject: [PATCH] fix(compiler-core): dynamic component should always be made
 blocks since it can potentially resolve to plain elements

fix #1018
---
 .../src/transforms/transformElement.ts        | 30 ++++++++++++-------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts
index ccd87e80..f1f30d5b 100644
--- a/packages/compiler-core/src/transforms/transformElement.ts
+++ b/packages/compiler-core/src/transforms/transformElement.ts
@@ -20,7 +20,13 @@ import {
   DirectiveArguments,
   createVNodeCall
 } from '../ast'
-import { PatchFlags, PatchFlagNames, isSymbol, isOn } from '@vue/shared'
+import {
+  PatchFlags,
+  PatchFlagNames,
+  isSymbol,
+  isOn,
+  isObject
+} from '@vue/shared'
 import { createCompilerError, ErrorCodes } from '../errors'
 import {
   RESOLVE_DIRECTIVE,
@@ -68,6 +74,8 @@ export const transformElement: NodeTransform = (node, context) => {
     const vnodeTag = isComponent
       ? resolveComponentType(node as ComponentNode, context)
       : `"${tag}"`
+    const isDynamicComponent =
+      isObject(vnodeTag) && vnodeTag.callee === RESOLVE_DYNAMIC_COMPONENT
 
     let vnodeProps: VNodeCall['props']
     let vnodeChildren: VNodeCall['children']
@@ -78,15 +86,17 @@ export const transformElement: NodeTransform = (node, context) => {
     let vnodeDirectives: VNodeCall['directives']
 
     let shouldUseBlock =
-      !isComponent &&
-      // <svg> and <foreignObject> must be forced into blocks so that block
-      // updates inside get proper isSVG flag at runtime. (#639, #643)
-      // This is technically web-specific, but splitting the logic out of core
-      // leads to too much unnecessary complexity.
-      (tag === 'svg' ||
-        tag === 'foreignObject' ||
-        // #938: elements with dynamic keys should be forced into blocks
-        findProp(node, 'key', true))
+      // dynamic component may resolve to plain elements
+      isDynamicComponent ||
+      (!isComponent &&
+        // <svg> and <foreignObject> must be forced into blocks so that block
+        // updates inside get proper isSVG flag at runtime. (#639, #643)
+        // This is technically web-specific, but splitting the logic out of core
+        // leads to too much unnecessary complexity.
+        (tag === 'svg' ||
+          tag === 'foreignObject' ||
+          // #938: elements with dynamic keys should be forced into blocks
+          findProp(node, 'key', true)))
 
     // props
     if (props.length > 0) {