fix: generate v-if fallback comment as block

packages/compiler-core/__tests__/transforms/__snapshots__/hoistStatic.spec.ts.snap

@@ -389,7 +389,7 @@ return function render() {
         ? _createBlock(\\"div\\", _hoisted_1, [
             _hoisted_2
           ])
-        : _createCommentVNode())
+        : _createCommentVNode(\\"v-if\\", true))
     ]))
   }
 }"

packages/compiler-core/__tests__/transforms/__snapshots__/vFor.spec.ts.snap

@@ -161,7 +161,7 @@ return function render() {
       ? _createBlock(_Fragment, { key: 0 }, _renderList(list, (i) => {
           return (_openBlock(), _createBlock(\\"div\\"))
         }), 128 /* UNKEYED_FRAGMENT */)
-      : _createCommentVNode())
+      : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;

packages/compiler-core/__tests__/transforms/__snapshots__/vIf.spec.ts.snap

@@ -9,7 +9,7 @@ return function render() {
     
     return (_openBlock(), ok
       ? _createBlock(\\"div\\", { key: 0 })
-      : _createCommentVNode())
+      : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;
@@ -27,7 +27,7 @@ return function render() {
           \\"hello\\",
           _createVNode(\\"p\\")
         ])
-      : _createCommentVNode())
+      : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;
@@ -41,7 +41,7 @@ return function render() {
     
     return (_openBlock(), ok
       ? _renderSlot($slots, \\"default\\", { key: 0 })
-      : _createCommentVNode())
+      : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;
@@ -87,7 +87,7 @@ return function render() {
       ? _createBlock(\\"div\\", { key: 0 })
       : orNot
         ? _createBlock(\\"p\\", { key: 1 })
-        : _createCommentVNode())
+        : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;
@@ -101,7 +101,7 @@ return function render() {
     
     return (_openBlock(), ok
       ? _renderSlot($slots, \\"default\\", { key: 0 })
-      : _createCommentVNode())
+      : _createCommentVNode(\\"v-if\\", true))
   }
 }"
 `;

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

@@ -152,7 +152,12 @@ function createCodegenNodeForBranch(
     return createConditionalExpression(
       branch.condition,
       createChildrenCodegenNode(branch, index, context),
-      createCallExpression(context.helper(CREATE_COMMENT))
+      // make sure to pass in asBlock: true so that the comment node call
+      // closes the current block.
+      createCallExpression(context.helper(CREATE_COMMENT), [
+        __DEV__ ? '"v-if"' : '""',
+        'true'
+      ])
     ) as IfConditionalExpression
   } else {
     return createChildrenCodegenNode(branch, index, context) as BlockCodegenNode

packages/runtime-core/src/vnode.ts

@@ -258,8 +258,15 @@ export function createTextVNode(text: string = ' ', flag: number = 0): VNode {
   return createVNode(Text, null, text, flag)
 }
 
-export function createCommentVNode(text: string = ''): VNode {
-  return createVNode(Comment, null, text)
+export function createCommentVNode(
+  text: string = '',
+  // when used as the v-else branch, the comment node must be created as a
+  // block to ensure correct updates.
+  asBlock: boolean = false
+): VNode {
+  return asBlock
+    ? createBlock(Comment, null, text)
+    : createVNode(Comment, null, text)
 }
 
 export function normalizeVNode(child: VNodeChild): VNode {