fix(ssr): support dynamic components that resolve to element or vnode

fix #1508

packages/server-renderer/__tests__/ssrDynamicComponent.spec.ts

@@ -0,0 +1,63 @@
+import { createApp, createVNode } from 'vue'
+import { renderToString } from '../src/renderToString'
+
+describe('ssr: dynamic component', () => {
+  test('resolved to component', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          components: {
+            one: {
+              template: `<div><slot/></div>`
+            }
+          },
+          template: `<component :is="'one'"><span>slot</span></component>`
+        })
+      )
+    ).toBe(`<div><!--[--><span>slot</span><!--]--></div>`)
+  })
+
+  test('resolve to element', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          template: `<component :is="'p'"><span>slot</span></component>`
+        })
+      )
+    ).toBe(`<p><span>slot</span></p>`)
+  })
+
+  test('resolve to component vnode', async () => {
+    const Child = {
+      props: ['id'],
+      template: `<div>{{ id }}<slot/></div>`
+    }
+    expect(
+      await renderToString(
+        createApp({
+          setup() {
+            return {
+              vnode: createVNode(Child, { id: 'test' })
+            }
+          },
+          template: `<component :is="vnode"><span>slot</span></component>`
+        })
+      )
+    ).toBe(`<div>test<!--[--><span>slot</span><!--]--></div>`)
+  })
+
+  test('resolve to element vnode', async () => {
+    expect(
+      await renderToString(
+        createApp({
+          setup() {
+            return {
+              vnode: createVNode('div', { id: 'test' })
+            }
+          },
+          template: `<component :is="vnode"><span>slot</span></component>`
+        })
+      )
+    ).toBe(`<div id="test"><span>slot</span></div>`)
+  })
+})

packages/server-renderer/src/index.ts

@@ -4,6 +4,7 @@ export { renderToString } from './renderToString'
 export { renderToStream } from './renderToStream'
 
 // internal runtime helpers
+export { renderVNode as ssrRenderVNode } from './render'
 export { ssrRenderComponent } from './helpers/ssrRenderComponent'
 export { ssrRenderSlot } from './helpers/ssrRenderSlot'
 export { ssrRenderTeleport } from './helpers/ssrRenderTeleport'

packages/server-renderer/src/render.ts

@@ -142,7 +142,7 @@ function renderComponentSubTree(
   return getBuffer()
 }
 
-function renderVNode(
+export function renderVNode(
   push: PushFn,
   vnode: VNode,
   parentComponent: ComponentInternalInstance