fix(compiler-core): template v-if should never be treated as dev root fragment

close #5189

diff --git a/packages/compiler-core/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/compile.spec.ts.snap
index a72a43782ce5098ed974f22134fa61ccf26c3337..a9189ac72a9fafcb0b9f0522cb1cf1aac1c7ad73 100644 (file)
--- a/packages/compiler-core/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/compile.spec.ts.snap
@@ -16,7 +16,7 @@ return function render(_ctx, _cache) {
         ? (_openBlock(), _createElementBlock(\\"div\\", { key: 0 }, \\"yes\\"))
         : (_openBlock(), _createElementBlock(_Fragment, { key: 1 }, [
             _createTextVNode(\\"no\\")
-          ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
+          ], 64 /* STABLE_FRAGMENT */)),
       (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(list, (value, index) => {
         return (_openBlock(), _createElementBlock(\\"div\\", null, [
           _createElementVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
@@ -40,7 +40,7 @@ return function render(_ctx, _cache) {
       ? (_openBlock(), _createElementBlock(\\"div\\", { key: 0 }, \\"yes\\"))
       : (_openBlock(), _createElementBlock(_Fragment, { key: 1 }, [
           _createTextVNode(\\"no\\")
-        ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
+        ], 64 /* STABLE_FRAGMENT */)),
     (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
       return (_openBlock(), _createElementBlock(\\"div\\", null, [
         _createElementVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
@@ -63,7 +63,7 @@ export function render(_ctx, _cache) {
       ? (_openBlock(), _createElementBlock(\\"div\\", { key: 0 }, \\"yes\\"))
       : (_openBlock(), _createElementBlock(_Fragment, { key: 1 }, [
           _createTextVNode(\\"no\\")
-        ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
+        ], 64 /* STABLE_FRAGMENT */)),
     (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
       return (_openBlock(), _createElementBlock(\\"div\\", null, [
         _createElementVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)

diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index 54fc7cbe7b6eaff2dec3476724948b28fadd4d2f..ee15a6558d963f20ff351b1afdbee0b8441628d7 100644 (file)
--- a/packages/compiler-core/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-core/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -111,7 +111,7 @@ return function render(_ctx, _cache) {
       ? (_openBlock(), _createElementBlock(\\"div\\", { key: 0 }))
       : orNot
         ? (_openBlock(), _createElementBlock(\\"p\\", { key: 1 }))
-        : (_openBlock(), _createElementBlock(_Fragment, { key: 2 }, [\\"fine\\"], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */))
+        : (_openBlock(), _createElementBlock(_Fragment, { key: 2 }, [\\"fine\\"], 64 /* STABLE_FRAGMENT */))
   }
 }"
 `;

diff --git a/packages/compiler-core/src/ast.ts b/packages/compiler-core/src/ast.ts
index 58fa76abe7ffcfe8cd4f6f4bf906acf2ff247f51..d6eda73bbbe5dbce35b043aa4fb7e20952b1bb16 100644 (file)
--- a/packages/compiler-core/src/ast.ts
+++ b/packages/compiler-core/src/ast.ts
@@ -259,6 +259,7 @@ export interface IfBranchNode extends Node {
   condition: ExpressionNode | undefined // else
   children: TemplateChildNode[]
   userKey?: AttributeNode | DirectiveNode
+  isTemplateIf?: boolean
 }
 
 export interface ForNode extends Node {

diff --git a/packages/compiler-core/src/transforms/vIf.ts b/packages/compiler-core/src/transforms/vIf.ts
index 71050a856435209542e86ea4eaf3d254da976294..2faa16374eeb931d5d0faa9f9ace11cdabe1de76 100644 (file)
--- a/packages/compiler-core/src/transforms/vIf.ts
+++ b/packages/compiler-core/src/transforms/vIf.ts
@@ -209,15 +209,14 @@ export function processIf(
 }
 
 function createIfBranch(node: ElementNode, dir: DirectiveNode): IfBranchNode {
+  const isTemplateIf = node.tagType === ElementTypes.TEMPLATE
   return {
     type: NodeTypes.IF_BRANCH,
     loc: node.loc,
     condition: dir.name === 'else' ? undefined : dir.exp,
-    children:
-      node.tagType === ElementTypes.TEMPLATE && !findDir(node, 'for')
-        ? node.children
-        : [node],
-    userKey: findProp(node, `key`)
+    children: isTemplateIf && !findDir(node, 'for') ? node.children : [node],
+    userKey: findProp(node, `key`),
+    isTemplateIf
   }
 }
 
@@ -274,6 +273,7 @@ function createChildrenCodegenNode(
       // the rest being comments
       if (
         __DEV__ &&
+        !branch.isTemplateIf &&
         children.filter(c => c.type !== NodeTypes.COMMENT).length === 1
       ) {
         patchFlag |= PatchFlags.DEV_ROOT_FRAGMENT