fix(runtime-vapor): supports the use of slots with v-if

packages/reactivity/src/effectScope.ts

@@ -62,13 +62,13 @@ export class EffectScope {
     }
   }
 
-  prevScope: EffectScope | undefined
+  prevScope: (EffectScope | undefined)[] = []
   /**
    * This should only be called on non-detached scopes
    * @internal
    */
   on() {
-    this.prevScope = activeEffectScope
+    this.prevScope.push(activeEffectScope)
     activeEffectScope = this
   }
 
@@ -77,7 +77,7 @@ export class EffectScope {
    * @internal
    */
   off() {
-    activeEffectScope = this.prevScope
+    activeEffectScope = this.prevScope.pop()
   }
 
   stop(fromParent?: boolean) {

packages/runtime-vapor/__tests__/componentSlots.spec.ts

@@ -3,6 +3,7 @@
 import {
   createComponent,
   createForSlots,
+  createIf,
   createSlot,
   createVaporApp,
   defineComponent,
@@ -672,5 +673,47 @@ describe('component: slots', () => {
 
       expect(host.innerHTML).toBe('<p>fallback<!--slot--></p>')
     })
+
+    test('should work with createIf', async () => {
+      const show = ref(true)
+      const spyConditionFn = vi.fn(() => show.value)
+      const t0 = template('<p>show</p>')
+      const t1 = template('<p>hide</p>')
+
+      const Child = defineComponent(() => {
+        const t0 = template('<p></p>')
+        const n1 = t0()
+        const n2 = createSlot('default')
+        insert(n2, n1 as ParentNode)
+        return n2
+      })
+
+      const { render, host } = define({
+        setup() {
+          return createComponent(Child, null, [
+            {
+              default: () =>
+                createIf(
+                  spyConditionFn,
+                  () => {
+                    const n0 = t0()
+                    return n0
+                  },
+                  () => {
+                    const n1 = t1()
+                    return n1
+                  },
+                ),
+            },
+          ])
+        },
+      })
+      render()
+
+      expect(host.innerHTML).toBe('<p>show</p><!--if-->')
+      show.value = false
+      await nextTick()
+      expect(host.innerHTML).toBe('<p>hide</p><!--if-->')
+    })
   })
 })

packages/runtime-vapor/__tests__/dom/prop.spec.ts

@@ -23,7 +23,7 @@ beforeEach(() => {
   const prev = getCurrentScope()
   instance.scope.on()
   removeComponentInstance = () => {
-    instance.scope.prevScope = prev
+    instance.scope.prevScope.push(prev)
     instance.scope.off()
     reset()
     removeComponentInstance = NOOP

packages/runtime-vapor/src/componentSlots.ts

@@ -94,11 +94,14 @@ export function initSlots(
 
   function withCtx(fn: Slot): Slot {
     return (...args: any[]) => {
-      const reset = setCurrentInstance(instance.parent!)
+      const parentInstance = instance.parent!
+      const reset = setCurrentInstance(parentInstance)
+      parentInstance.scope.on()
       try {
         return fn(...(args as any))
       } finally {
         reset()
+        parentInstance.scope.off()
       }
     }
   }