fix(ssr/teleport): support nested teleports in ssr

fix #5242

packages/server-renderer/src/helpers/ssrRenderTeleport.ts

@@ -10,28 +10,28 @@ export function ssrRenderTeleport(
 ) {
   parentPush('<!--teleport start-->')
 
-  let teleportContent: SSRBufferItem
-
-  if (disabled) {
-    contentRenderFn(parentPush)
-    teleportContent = `<!---->`
-  } else {
-    const { getBuffer, push } = createBuffer()
-    contentRenderFn(push)
-    push(`<!---->`) // teleport end anchor
-    teleportContent = getBuffer()
-  }
-
   const context = parentComponent.appContext.provides[
     ssrContextKey as any
   ] as SSRContext
   const teleportBuffers =
     context.__teleportBuffers || (context.__teleportBuffers = {})
-  if (teleportBuffers[target]) {
-    teleportBuffers[target].push(teleportContent)
+  const targetBuffer = teleportBuffers[target] || (teleportBuffers[target] = [])
+  // record current index of the target buffer to handle nested teleports
+  // since the parent needs to be rendered before the child
+  const bufferIndex = targetBuffer.length
+
+  let teleportContent: SSRBufferItem
+
+  if (disabled) {
+    contentRenderFn(parentPush)
+    teleportContent = `<!--teleport anchor-->`
   } else {
-    teleportBuffers[target] = [teleportContent]
+    const { getBuffer, push } = createBuffer()
+    contentRenderFn(push)
+    push(`<!--teleport anchor-->`)
+    teleportContent = getBuffer()
   }
 
+  targetBuffer.splice(bufferIndex, 0, teleportContent)
   parentPush('<!--teleport end-->')
 }