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

fix #1508
This commit is contained in:
Evan You
2020-07-06 21:23:29 -04:00
parent d7184c99e6
commit 41db49dfb7
6 changed files with 117 additions and 18 deletions

View File

@@ -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>`)
})
})