fix(compiler-core): always compile Teleport and Suspense as blocks

packages/compiler-core/src/transforms/transformElement.ts

@@ -35,7 +35,8 @@ import {
   MERGE_PROPS,
   TO_HANDLERS,
   TELEPORT,
-  KEEP_ALIVE
+  KEEP_ALIVE,
+  SUSPENSE
 } from '../runtimeHelpers'
 import {
   getInnerRange,
@@ -89,6 +90,8 @@ export const transformElement: NodeTransform = (node, context) => {
     let shouldUseBlock =
       // dynamic component may resolve to plain elements
       isDynamicComponent ||
+      vnodeTag === TELEPORT ||
+      vnodeTag === SUSPENSE ||
       (!isComponent &&
         // <svg> and <foreignObject> must be forced into blocks so that block
         // updates inside get proper isSVG flag at runtime. (#639, #643)

packages/runtime-core/src/vnode.ts

@@ -411,11 +411,7 @@ function _createVNode(
     // the EVENTS flag is only for hydration and if it is the only flag, the
     // vnode should not be considered dynamic due to handler caching.
     patchFlag !== PatchFlags.HYDRATE_EVENTS &&
-    (patchFlag > 0 ||
-      shapeFlag & ShapeFlags.SUSPENSE ||
-      shapeFlag & ShapeFlags.TELEPORT ||
-      shapeFlag & ShapeFlags.STATEFUL_COMPONENT ||
-      shapeFlag & ShapeFlags.FUNCTIONAL_COMPONENT)
+    (patchFlag > 0 || shapeFlag & ShapeFlags.COMPONENT)
   ) {
     currentBlock.push(vnode)
   }