wip(ssr): scopeId in slots

This commit is contained in:
Evan You
2020-02-06 17:45:34 -05:00
parent 797cc18967
commit 7984a135ca
9 changed files with 239 additions and 69 deletions

View File

@@ -56,8 +56,12 @@ describe('ssr: components', () => {
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => {
_push(\`hello<div></div>\`)
default: (_, _push, _parent, _scopeId) => {
if (_scopeId) {
_push(\`hello<div \${_scopeId}></div>\`)
} else {
_push(\`hello<div></div>\`)
}
},
_compiled: true
}, _parent)
@@ -75,7 +79,7 @@ describe('ssr: components', () => {
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: ({ msg }, _push, _parent) => {
default: ({ msg }, _push, _parent, _scopeId) => {
_push(\`\${_ssrInterpolate(msg + _ctx.outer)}\`)
},
_compiled: true
@@ -98,10 +102,10 @@ describe('ssr: components', () => {
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => {
default: (_, _push, _parent, _scopeId) => {
_push(\`foo\`)
},
named: (_, _push, _parent) => {
named: (_, _push, _parent, _scopeId) => {
_push(\`bar\`)
},
_compiled: true
@@ -126,7 +130,7 @@ describe('ssr: components', () => {
(_ctx.ok)
? {
name: \\"named\\",
fn: (_, _push, _parent) => {
fn: (_, _push, _parent, _scopeId) => {
_push(\`foo\`)
}
}
@@ -152,7 +156,7 @@ describe('ssr: components', () => {
renderList(_ctx.names, (key) => {
return {
name: key,
fn: ({ msg }, _push, _parent) => {
fn: ({ msg }, _push, _parent, _scopeId) => {
_push(\`\${_ssrInterpolate(msg + key + _ctx.bar)}\`)
}
}

View File

@@ -0,0 +1,114 @@
import { compile } from '../src'
const scopeId = 'data-v-xxxxxxx'
describe('ssr: scopeId', () => {
test('basic', () => {
expect(
compile(`<div><span>hello</span></div>`, {
scopeId
}).code
).toMatchInlineSnapshot(`
"
return function ssrRender(_ctx, _push, _parent) {
_push(\`<div data-v-xxxxxxx><span data-v-xxxxxxx>hello</span></div>\`)
}"
`)
})
test('inside slots (only text)', () => {
// should have no branching inside slot
expect(
compile(`<foo>foo</foo>`, {
scopeId
}).code
).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`foo\`)
},
_compiled: true
}, _parent)
}"
`)
})
test('inside slots (with elements)', () => {
expect(
compile(`<foo><span>hello</span></foo>`, {
scopeId
}).code
).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
if (_scopeId) {
_push(\`<span data-v-xxxxxxx \${_scopeId}>hello</span>\`)
} else {
_push(\`<span data-v-xxxxxxx>hello</span>\`)
}
},
_compiled: true
}, _parent)
}"
`)
})
test('nested slots', () => {
expect(
compile(`<foo><span>hello</span><bar><span/></bar></foo>`, {
scopeId
}).code
).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_bar = resolveComponent(\\"bar\\")
const _component_foo = resolveComponent(\\"foo\\")
_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
if (_scopeId) {
_push(\`<span data-v-xxxxxxx \${_scopeId}>hello</span>\`)
_ssrRenderComponent(_component_bar, null, {
default: (_, _push, _parent, _scopeId) => {
if (_scopeId) {
_push(\`<span data-v-xxxxxxx \${_scopeId}></span>\`)
} else {
_push(\`<span data-v-xxxxxxx></span>\`)
}
},
_compiled: true
}, _parent)
} else {
_push(\`<span data-v-xxxxxxx>hello</span>\`)
_ssrRenderComponent(_component_bar, null, {
default: (_, _push, _parent, _scopeId) => {
if (_scopeId) {
_push(\`<span data-v-xxxxxxx \${_scopeId}></span>\`)
} else {
_push(\`<span data-v-xxxxxxx></span>\`)
}
},
_compiled: true
}, _parent)
}
},
_compiled: true
}, _parent)
}"
`)
})
})