wip(ssr): should apply app context when rendering app instance

This commit is contained in:
Evan You 2020-01-30 12:20:23 -05:00
parent 5c2fe536dc
commit c02e7bc7d6
3 changed files with 35 additions and 5 deletions

View File

@ -24,6 +24,7 @@ export interface App<HostElement = any> {
_component: Component _component: Component
_props: Data | null _props: Data | null
_container: HostElement | null _container: HostElement | null
_context: AppContext
} }
export interface AppConfig { export interface AppConfig {
@ -103,6 +104,7 @@ export function createAppAPI<HostNode, HostElement>(
_component: rootComponent, _component: rootComponent,
_props: rootProps, _props: rootProps,
_container: null, _container: null,
_context: context,
get config() { get config() {
return context.config return context.config

View File

@ -1,7 +1,28 @@
import { createApp, h, createCommentVNode, withScopeId } from 'vue' import {
createApp,
h,
createCommentVNode,
withScopeId,
resolveComponent,
ComponentOptions
} from 'vue'
import { renderToString, renderComponent, renderSlot, escapeHtml } from '../src' import { renderToString, renderComponent, renderSlot, escapeHtml } from '../src'
describe('ssr: renderToString', () => { describe('ssr: renderToString', () => {
test('should apply app context', async () => {
const app = createApp({
render() {
const Foo = resolveComponent('foo') as ComponentOptions
return h(Foo)
}
})
app.component('foo', {
render: () => h('div', 'foo')
})
const html = await renderToString(app)
expect(html).toBe(`<div>foo</div>`)
})
describe('components', () => { describe('components', () => {
test('vnode components', async () => { test('vnode components', async () => {
expect( expect(

View File

@ -83,10 +83,17 @@ function unrollBuffer(buffer: ResolvedSSRBuffer): string {
} }
export async function renderToString(input: App | VNode): Promise<string> { export async function renderToString(input: App | VNode): Promise<string> {
const resolvedBuffer = await (isVNode(input) let buffer: ResolvedSSRBuffer
? renderComponent({ render: () => input }) if (isVNode(input)) {
: renderComponent(input._component, input._props)) // raw vnode, wrap with component
return unrollBuffer(resolvedBuffer) buffer = await renderComponent({ render: () => input })
} else {
// rendering an app
const vnode = createVNode(input._component, input._props)
vnode.appContext = input._context
buffer = await renderComponentVNode(vnode)
}
return unrollBuffer(buffer)
} }
export function renderComponent( export function renderComponent(