fix(compiler-ssr/teleport): correct the target prop of teleport (#2053)

This commit is contained in:
HcySunYang 2020-09-15 21:59:36 +08:00 committed by GitHub
parent cdd849a09c
commit 7455dca11c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 6 additions and 8 deletions

View File

@ -2,7 +2,7 @@ import { compile } from '../src'
describe('ssr compile: teleport', () => { describe('ssr compile: teleport', () => {
test('should work', () => { test('should work', () => {
expect(compile(`<teleport :target="target"><div/></teleport>`).code) expect(compile(`<teleport :to="target"><div/></teleport>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\") "const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\")
@ -15,9 +15,8 @@ describe('ssr compile: teleport', () => {
}) })
test('disabled prop handling', () => { test('disabled prop handling', () => {
expect( expect(compile(`<teleport :to="target" disabled><div/></teleport>`).code)
compile(`<teleport :target="target" disabled><div/></teleport>`).code .toMatchInlineSnapshot(`
).toMatchInlineSnapshot(`
"const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\") "const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) { return function ssrRender(_ctx, _push, _parent, _attrs) {
@ -28,8 +27,7 @@ describe('ssr compile: teleport', () => {
`) `)
expect( expect(
compile(`<teleport :target="target" :disabled="foo"><div/></teleport>`) compile(`<teleport :to="target" :disabled="foo"><div/></teleport>`).code
.code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\") "const { ssrRenderTeleport: _ssrRenderTeleport } = require(\\"@vue/server-renderer\\")

View File

@ -26,6 +26,6 @@ export const enum SSRErrorCodes {
export const SSRErrorMessages: { [code: number]: string } = { export const SSRErrorMessages: { [code: number]: string } = {
[SSRErrorCodes.X_SSR_CUSTOM_DIRECTIVE_NO_TRANSFORM]: `Custom directive is missing corresponding SSR transform and will be ignored.`, [SSRErrorCodes.X_SSR_CUSTOM_DIRECTIVE_NO_TRANSFORM]: `Custom directive is missing corresponding SSR transform and will be ignored.`,
[SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME]: `Unsafe attribute name for SSR.`, [SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME]: `Unsafe attribute name for SSR.`,
[SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET]: `No target prop on teleport element.`, [SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET]: `Missing the 'to' prop on teleport element.`,
[SSRErrorCodes.X_SSR_INVALID_AST_NODE]: `Invalid AST node during SSR transform.` [SSRErrorCodes.X_SSR_INVALID_AST_NODE]: `Invalid AST node during SSR transform.`
} }

View File

@ -19,7 +19,7 @@ export function ssrProcessTeleport(
node: ComponentNode, node: ComponentNode,
context: SSRTransformContext context: SSRTransformContext
) { ) {
const targetProp = findProp(node, 'target') const targetProp = findProp(node, 'to')
if (!targetProp) { if (!targetProp) {
context.onError( context.onError(
createSSRCompilerError(SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET, node.loc) createSSRCompilerError(SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET, node.loc)