Skip to content

Commit d5dbd27

Browse files
committed
fix(ssr): handle fallthrough attrs in ssr compile output
1 parent 30584bc commit d5dbd27

21 files changed

+774
-486
lines changed

packages/compiler-core/src/codegen.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,7 @@ export function generate(
210210
if (!ssr) {
211211
push(`function render(_ctx, _cache) {`)
212212
} else {
213-
push(`function ssrRender(_ctx, _push, _parent) {`)
213+
push(`function ssrRender(_ctx, _push, _parent, _attrs) {`)
214214
}
215215
indent()
216216

packages/compiler-ssr/__tests__/ssrComponent.spec.ts

+25-25
Original file line numberDiff line numberDiff line change
@@ -3,38 +3,38 @@ import { compile } from '../src'
33
describe('ssr: components', () => {
44
test('basic', () => {
55
expect(compile(`<foo id="a" :prop="b" />`).code).toMatchInlineSnapshot(`
6-
"const { resolveComponent: _resolveComponent } = require(\\"vue\\")
6+
"const { resolveComponent: _resolveComponent, mergeProps: _mergeProps } = require(\\"vue\\")
77
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
88
9-
return function ssrRender(_ctx, _push, _parent) {
9+
return function ssrRender(_ctx, _push, _parent, _attrs) {
1010
const _component_foo = _resolveComponent(\\"foo\\")
1111
12-
_push(_ssrRenderComponent(_component_foo, {
12+
_push(_ssrRenderComponent(_component_foo, _mergeProps({
1313
id: \\"a\\",
1414
prop: _ctx.b
15-
}, null, _parent))
15+
}, _attrs), null, _parent))
1616
}"
1717
`)
1818
})
1919

2020
test('dynamic component', () => {
2121
expect(compile(`<component is="foo" prop="b" />`).code)
2222
.toMatchInlineSnapshot(`
23-
"const { resolveDynamicComponent: _resolveDynamicComponent } = require(\\"vue\\")
23+
"const { resolveDynamicComponent: _resolveDynamicComponent, mergeProps: _mergeProps } = require(\\"vue\\")
2424
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
2525
26-
return function ssrRender(_ctx, _push, _parent) {
27-
_push(_ssrRenderComponent(_resolveDynamicComponent(\\"foo\\"), { prop: \\"b\\" }, null, _parent))
26+
return function ssrRender(_ctx, _push, _parent, _attrs) {
27+
_push(_ssrRenderComponent(_resolveDynamicComponent(\\"foo\\"), _mergeProps({ prop: \\"b\\" }, _attrs), null, _parent))
2828
}"
2929
`)
3030

3131
expect(compile(`<component :is="foo" prop="b" />`).code)
3232
.toMatchInlineSnapshot(`
33-
"const { resolveDynamicComponent: _resolveDynamicComponent } = require(\\"vue\\")
33+
"const { resolveDynamicComponent: _resolveDynamicComponent, mergeProps: _mergeProps } = require(\\"vue\\")
3434
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
3535
36-
return function ssrRender(_ctx, _push, _parent) {
37-
_push(_ssrRenderComponent(_resolveDynamicComponent(_ctx.foo), { prop: \\"b\\" }, null, _parent))
36+
return function ssrRender(_ctx, _push, _parent, _attrs) {
37+
_push(_ssrRenderComponent(_resolveDynamicComponent(_ctx.foo), _mergeProps({ prop: \\"b\\" }, _attrs), null, _parent))
3838
}"
3939
`)
4040
})
@@ -45,10 +45,10 @@ describe('ssr: components', () => {
4545
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, createVNode: _createVNode, createTextVNode: _createTextVNode } = require(\\"vue\\")
4646
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
4747
48-
return function ssrRender(_ctx, _push, _parent) {
48+
return function ssrRender(_ctx, _push, _parent, _attrs) {
4949
const _component_foo = _resolveComponent(\\"foo\\")
5050
51-
_push(_ssrRenderComponent(_component_foo, null, {
51+
_push(_ssrRenderComponent(_component_foo, _attrs, {
5252
default: _withCtx((_, _push, _parent, _scopeId) => {
5353
if (_push) {
5454
_push(\`hello<div\${_scopeId}></div>\`)
@@ -71,10 +71,10 @@ describe('ssr: components', () => {
7171
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, toDisplayString: _toDisplayString, createTextVNode: _createTextVNode } = require(\\"vue\\")
7272
const { ssrRenderComponent: _ssrRenderComponent, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
7373
74-
return function ssrRender(_ctx, _push, _parent) {
74+
return function ssrRender(_ctx, _push, _parent, _attrs) {
7575
const _component_foo = _resolveComponent(\\"foo\\")
7676
77-
_push(_ssrRenderComponent(_component_foo, null, {
77+
_push(_ssrRenderComponent(_component_foo, _attrs, {
7878
default: _withCtx(({ msg }, _push, _parent, _scopeId) => {
7979
if (_push) {
8080
_push(\`\${_ssrInterpolate(msg + _ctx.outer)}\`)
@@ -100,10 +100,10 @@ describe('ssr: components', () => {
100100
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, createTextVNode: _createTextVNode } = require(\\"vue\\")
101101
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
102102
103-
return function ssrRender(_ctx, _push, _parent) {
103+
return function ssrRender(_ctx, _push, _parent, _attrs) {
104104
const _component_foo = _resolveComponent(\\"foo\\")
105105
106-
_push(_ssrRenderComponent(_component_foo, null, {
106+
_push(_ssrRenderComponent(_component_foo, _attrs, {
107107
default: _withCtx((_, _push, _parent, _scopeId) => {
108108
if (_push) {
109109
_push(\`foo\`)
@@ -137,10 +137,10 @@ describe('ssr: components', () => {
137137
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, createTextVNode: _createTextVNode, createSlots: _createSlots } = require(\\"vue\\")
138138
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
139139
140-
return function ssrRender(_ctx, _push, _parent) {
140+
return function ssrRender(_ctx, _push, _parent, _attrs) {
141141
const _component_foo = _resolveComponent(\\"foo\\")
142142
143-
_push(_ssrRenderComponent(_component_foo, null, _createSlots({ _: 1 }, [
143+
_push(_ssrRenderComponent(_component_foo, _attrs, _createSlots({ _: 1 }, [
144144
(_ctx.ok)
145145
? {
146146
name: \\"named\\",
@@ -169,10 +169,10 @@ describe('ssr: components', () => {
169169
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, toDisplayString: _toDisplayString, createTextVNode: _createTextVNode, renderList: _renderList, createSlots: _createSlots } = require(\\"vue\\")
170170
const { ssrRenderComponent: _ssrRenderComponent, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
171171
172-
return function ssrRender(_ctx, _push, _parent) {
172+
return function ssrRender(_ctx, _push, _parent, _attrs) {
173173
const _component_foo = _resolveComponent(\\"foo\\")
174174
175-
_push(_ssrRenderComponent(_component_foo, null, _createSlots({ _: 1 }, [
175+
_push(_ssrRenderComponent(_component_foo, _attrs, _createSlots({ _: 1 }, [
176176
_renderList(_ctx.names, (key) => {
177177
return {
178178
name: key,
@@ -210,10 +210,10 @@ describe('ssr: components', () => {
210210
"const { resolveComponent: _resolveComponent, withCtx: _withCtx, renderList: _renderList, Fragment: _Fragment, openBlock: _openBlock, createBlock: _createBlock, createVNode: _createVNode, createCommentVNode: _createCommentVNode } = require(\\"vue\\")
211211
const { ssrRenderComponent: _ssrRenderComponent, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
212212
213-
return function ssrRender(_ctx, _push, _parent) {
213+
return function ssrRender(_ctx, _push, _parent, _attrs) {
214214
const _component_foo = _resolveComponent(\\"foo\\")
215215
216-
_push(_ssrRenderComponent(_component_foo, null, {
216+
_push(_ssrRenderComponent(_component_foo, _attrs, {
217217
foo: _withCtx(({ list }, _push, _parent, _scopeId) => {
218218
if (_push) {
219219
if (_ctx.ok) {
@@ -270,15 +270,15 @@ describe('ssr: components', () => {
270270
expect(compile(`<transition><div/></transition>`).code)
271271
.toMatchInlineSnapshot(`
272272
"
273-
return function ssrRender(_ctx, _push, _parent) {
273+
return function ssrRender(_ctx, _push, _parent, _attrs) {
274274
_push(\`<div></div>\`)
275275
}"
276276
`)
277277

278278
expect(compile(`<transition-group><div/></transition-group>`).code)
279279
.toMatchInlineSnapshot(`
280280
"
281-
return function ssrRender(_ctx, _push, _parent) {
281+
return function ssrRender(_ctx, _push, _parent, _attrs) {
282282
_push(\`<!--[--><div></div><!--]-->\`)
283283
}"
284284
`)
@@ -288,7 +288,7 @@ describe('ssr: components', () => {
288288
"const { resolveComponent: _resolveComponent } = require(\\"vue\\")
289289
const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
290290
291-
return function ssrRender(_ctx, _push, _parent) {
291+
return function ssrRender(_ctx, _push, _parent, _attrs) {
292292
const _component_foo = _resolveComponent(\\"foo\\")
293293
294294
_push(_ssrRenderComponent(_component_foo, null, null, _parent))

0 commit comments

Comments
 (0)