/
ssrSlotOutlet.spec.ts
117 lines (100 loc) 路 3.78 KB
/
ssrSlotOutlet.spec.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
import { compile } from '../src'
describe('ssr: <slot>', () => {
test('basic', () => {
expect(compile(`<slot/>`).code).toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
}"
`)
})
test('with name', () => {
expect(compile(`<slot name="foo" />`).code).toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent)
}"
`)
})
test('with dynamic name', () => {
expect(compile(`<slot :name="bar.baz" />`).code).toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, _ctx.bar.baz, {}, null, _push, _parent)
}"
`)
})
test('with props', () => {
expect(compile(`<slot name="foo" :p="1" bar="2" />`).code)
.toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"foo\\", {
p: 1,
bar: \\"2\\"
}, null, _push, _parent)
}"
`)
})
test('with fallback', () => {
expect(compile(`<slot>some {{ fallback }} content</slot>`).code)
.toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot, ssrInterpolate: _ssrInterpolate } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, () => {
_push(\`some \${_ssrInterpolate(_ctx.fallback)} content\`)
}, _push, _parent)
}"
`)
})
test('with scopeId', async () => {
expect(
compile(`<slot/>`, {
scopeId: 'hello'
}).code
).toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent, \\"hello-s\\")
}"
`)
})
test('with scopeId + slotted:false', async () => {
expect(
compile(`<slot/>`, {
scopeId: 'hello',
slotted: false
}).code
).toMatchInlineSnapshot(`
"const { ssrRenderSlot: _ssrRenderSlot } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
}"
`)
})
test('with forwarded scopeId', async () => {
expect(
compile(`<Comp><slot/></Comp>`, {
scopeId: 'hello'
}).code
).toMatchInlineSnapshot(`
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, renderSlot: _renderSlot } = require(\\"vue\\")
const { ssrRenderSlot: _ssrRenderSlot, ssrRenderComponent: _ssrRenderComponent } = require(\\"vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent, _attrs) {
const _component_Comp = _resolveComponent(\\"Comp\\")
_push(_ssrRenderComponent(_component_Comp, _attrs, {
default: _withCtx((_, _push, _parent, _scopeId) => {
if (_push) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent, \\"hello-s\\" + _scopeId)
} else {
return [
_renderSlot(_ctx.$slots, \\"default\\")
]
}
}),
_: 3 /* FORWARDED */
}, _parent))
}"
`)
})
})