fix(compiler-vapor): don't mutate ast

diff --git a/packages/compiler-vapor/src/transform.ts b/packages/compiler-vapor/src/transform.ts
index 0c81c5e4c45f0db474a2339ac9d013aa04abd58f..69b3573acdcdacebca9c771b642be73cce636ef6 100644 (file)
--- a/packages/compiler-vapor/src/transform.ts
+++ b/packages/compiler-vapor/src/transform.ts
@@ -404,14 +404,8 @@ export function createStructuralDirectiveTransform(
         return
       }
       const exitFns = []
-      for (let i = 0; i < props.length; i++) {
-        const prop = props[i]
+      for (const prop of props) {
         if (prop.type === NodeTypes.DIRECTIVE && matches(prop.name)) {
-          // structural directives are removed to avoid infinite recursion
-          // also we remove them *before* applying so that it can further
-          // traverse itself in case it moves the node around
-          props.splice(i, 1)
-          i--
           const onExit = fn(node, prop as VaporDirectiveNode, context)
           if (onExit) exitFns.push(onExit)
         }

diff --git a/packages/compiler-vapor/src/transforms/vIf.ts b/packages/compiler-vapor/src/transforms/vIf.ts
index a3c69307e9781f20a562383e18ff1fcd6feb2c6e..d3f47fb375a2ae47f49d1fc2f06f23968631ed4d 100644 (file)
--- a/packages/compiler-vapor/src/transforms/vIf.ts
+++ b/packages/compiler-vapor/src/transforms/vIf.ts
@@ -65,16 +65,25 @@ export function createIfBranch(
     node.tagType !== ElementTypes.TEMPLATE
   ) {
     node = extend({}, node, {
+      type: NodeTypes.ELEMENT,
+      tag: 'template',
+      props: [],
       tagType: ElementTypes.TEMPLATE,
-      children: [node],
-    } as TemplateNode)
+      children: [
+        extend({}, node, {
+          props: node.props.filter(
+            (p) => p.type !== NodeTypes.DIRECTIVE && p.name !== 'if',
+          ),
+        } as TemplateChildNode),
+      ],
+    } as Partial<TemplateNode>)
     context.node = node
   }
 
   const branch: BlockFunctionIRNode = {
     type: IRNodeTypes.BLOCK_FUNCTION,
     loc: dir.loc,
-    node: node,
+    node,
     templateIndex: -1,
     dynamic: {
       id: null,