bugfix: use portal as 'rootDom' for children when searching for neigh…

…bouring mounted element

packages/lib/src/dom.ts

@@ -10,6 +10,7 @@ import { EffectTag, elementTypes } from "./constants.js"
 import { Component } from "./component.js"
 import { Signal } from "./signal.js"
 import { renderMode } from "./globals.js"
+import { Portal } from "./portal.js"
 
 export { commitWork, createDom, updateDom }
 
@@ -210,7 +211,8 @@ function placeDom(
     // edge cases are encountered.
 
     // first, try to find next dom by traversing through siblings
-    let nextDom = findMountedDomRecursive(appCtx, vNode.sibling)
+    const rootDom = Portal.isPortal(node.type) ? element : appCtx.rootNode?.dom
+    let nextDom = findMountedDomRecursive(rootDom, vNode.sibling)
     if (nextDom === undefined) {
       // try to find next dom by traversing (up and across) through the tree
       // handles cases like the following:
@@ -227,7 +229,7 @@ function placeDom(
       let parent = vNode.parent
 
       while (!nextDom && parent && parent !== node) {
-        nextDom = findMountedDomRecursive(appCtx, parent.sibling)
+        nextDom = findMountedDomRecursive(rootDom, parent.sibling)
         parent = parent.parent
       }
     }
@@ -339,15 +341,14 @@ function commitDeletion(vNode: VNode, deleteSibling = false) {
 }
 
 function findMountedDomRecursive(
-  appCtx: AppContext,
+  rootDom: HTMLElement | SVGElement | Text | undefined,
   vNode?: VNode
 ): HTMLElement | SVGElement | Text | undefined {
   if (!vNode) return
   const stack: VNode[] = [vNode]
   while (stack.length) {
     const n = stack.pop()!
-    if (n.dom?.isConnected && appCtx.rootNode?.dom?.contains(n.dom))
-      return n.dom
+    if (n.dom?.isConnected && rootDom?.contains(n.dom)) return n.dom
     if (n.sibling) stack.push(n.sibling)
     if (n.child) stack.push(n.child)
   }

packages/lib/src/portal.ts

@@ -7,13 +7,20 @@ type PortalProps = {
   container: HTMLElement
 }
 
+const portalIdentifier = Symbol.for("kaioken.portal")
+
 class Portal extends Component<PortalProps> {
   doNotModifyDom = true
+  static [portalIdentifier] = true
   constructor(props: PortalProps) {
     super(props)
     this.vNode.dom = this.props.container
   }
 
+  static isPortal(type: unknown): type is typeof Portal {
+    return !!type && typeof type === "function" && portalIdentifier in type
+  }
+
   render(): JSX.Element {
     return (this.props.children as JSX.Element) ?? null
   }