fix(compiler-core): dynamic component should always be made blocks

since it can potentially resolve to plain elements

fix #1018

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,7 +86,9 @@ export const transformElement: NodeTransform = (node, context) => {
     let vnodeDirectives: VNodeCall['directives']
 
     let shouldUseBlock =
-      !isComponent &&
+      // 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
@@ -86,7 +96,7 @@ export const transformElement: NodeTransform = (node, context) => {
         (tag === 'svg' ||
           tag === 'foreignObject' ||
           // #938: elements with dynamic keys should be forced into blocks
-        findProp(node, 'key', true))
+          findProp(node, 'key', true)))
 
     // props
     if (props.length > 0) {