test('basic', () => {
expect(compile(`<foo id="a" :prop="b" />`).code).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, {
+ _ssrRenderComponent(_component_foo, {
id: \\"a\\",
prop: _ctx.b
}, null, _parent)
expect(compile(`<component is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, { prop: \\"b\\" }, null, _parent)
+ _ssrRenderComponent(_component_foo, { prop: \\"b\\" }, null, _parent)
}"
`)
expect(compile(`<compoonent :is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_compoonent = resolveComponent(\\"compoonent\\")
- _renderComponent(_component_compoonent, {
+ _ssrRenderComponent(_component_compoonent, {
is: _ctx.foo,
prop: \\"b\\"
}, null, _parent)
test('implicit default slot', () => {
expect(compile(`<foo>hello<div/></foo>`).code).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, null, {
+ _ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => {
_push(\`hello<div></div>\`)
},
expect(compile(`<foo v-slot="{ msg }">{{ msg + outer }}</foo>`).code)
.toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent, _interpolate } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, null, {
+ _ssrRenderComponent(_component_foo, null, {
default: ({ msg }, _push, _parent) => {
- _push(\`\${_interpolate(msg + _ctx.outer)}\`)
+ _push(\`\${_ssrInterpolate(msg + _ctx.outer)}\`)
},
_compiled: true
}, _parent)
</foo>`).code
).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, null, {
+ _ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => {
_push(\`foo\`)
},
</foo>`).code
).toMatchInlineSnapshot(`
"const { resolveComponent, createSlots } = require(\\"vue\\")
- const { _renderComponent } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, null, createSlots({ _compiled: true }, [
+ _ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
(_ctx.ok)
? {
name: \\"named\\",
</foo>`).code
).toMatchInlineSnapshot(`
"const { resolveComponent, renderList, createSlots } = require(\\"vue\\")
- const { _renderComponent, _interpolate } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderComponent, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\")
- _renderComponent(_component_foo, null, createSlots({ _compiled: true }, [
+ _ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
renderList(_ctx.names, (key) => {
return {
name: key,
fn: ({ msg }, _push, _parent) => {
- _push(\`\${_interpolate(msg + key + _ctx.bar)}\`)
+ _push(\`\${_ssrInterpolate(msg + key + _ctx.bar)}\`)
}
}
})
test('v-text', () => {
expect(getCompiledString(`<div v-text="foo"/>`)).toMatchInlineSnapshot(
- `"\`<div>\${_interpolate(_ctx.foo)}</div>\`"`
+ `"\`<div>\${_ssrInterpolate(_ctx.foo)}</div>\`"`
)
})
expect(
getCompiledString(`<textarea :value="foo"/>`)
).toMatchInlineSnapshot(
- `"\`<textarea>\${_interpolate(_ctx.foo)}</textarea>\`"`
+ `"\`<textarea>\${_ssrInterpolate(_ctx.foo)}</textarea>\`"`
)
})
test('<textarea> with dynamic v-bind', () => {
expect(compile(`<textarea v-bind="obj">fallback</textarea>`).code)
.toMatchInlineSnapshot(`
- "const { _renderAttrs, _interpolate } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttrs, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
_push(\`<textarea\${
- _renderAttrs(_temp0 = _ctx.obj)
+ _ssrRenderAttrs(_temp0 = _ctx.obj)
}>\${
- _interpolate((\\"value\\" in _temp0) ? _temp0.value : \\"fallback\\")
+ _ssrInterpolate((\\"value\\" in _temp0) ? _temp0.value : \\"fallback\\")
}</textarea>\`)
}"
`)
expect(
getCompiledString(`<div id="foo" :class="bar"></div>`)
).toMatchInlineSnapshot(
- `"\`<div id=\\"foo\\"\${_renderClass(_ctx.bar)}></div>\`"`
+ `"\`<div id=\\"foo\\"\${_ssrRenderClass(_ctx.bar)}></div>\`"`
)
})
expect(
getCompiledString(`<div class="foo" :class="bar"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderClass([_ctx.bar, \\"foo\\"])}></div>\`"`
+ `"\`<div\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}></div>\`"`
)
})
expect(
getCompiledString(`<div id="foo" :style="bar"></div>`)
).toMatchInlineSnapshot(
- `"\`<div id=\\"foo\\"\${_renderStyle(_ctx.bar)}></div>\`"`
+ `"\`<div id=\\"foo\\"\${_ssrRenderStyle(_ctx.bar)}></div>\`"`
)
})
expect(
getCompiledString(`<div style="color:red;" :style="bar"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderStyle([_hoisted_1, _ctx.bar])}></div>\`"`
+ `"\`<div\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}></div>\`"`
)
})
expect(
getCompiledString(`<div :id="id" class="bar"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderAttr(\\"id\\", _ctx.id)} class=\\"bar\\"></div>\`"`
+ `"\`<div\${_ssrRenderAttr(\\"id\\", _ctx.id)} class=\\"bar\\"></div>\`"`
)
})
expect(
getCompiledString(`<div v-bind:[key]="value"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderAttrs({ [_ctx.key]: _ctx.value })}></div>\`"`
+ `"\`<div\${_ssrRenderAttrs({ [_ctx.key]: _ctx.value })}></div>\`"`
)
expect(getCompiledString(`<div class="foo" v-bind:[key]="value"></div>`))
.toMatchInlineSnapshot(`
- "\`<div\${_renderAttrs({
+ "\`<div\${_ssrRenderAttrs({
class: \\"foo\\",
[_ctx.key]: _ctx.value
})}></div>\`"
expect(getCompiledString(`<div :id="id" v-bind:[key]="value"></div>`))
.toMatchInlineSnapshot(`
- "\`<div\${_renderAttrs({
+ "\`<div\${_ssrRenderAttrs({
id: _ctx.id,
[_ctx.key]: _ctx.value
})}></div>\`"
test('v-bind="obj"', () => {
expect(
getCompiledString(`<div v-bind="obj"></div>`)
- ).toMatchInlineSnapshot(`"\`<div\${_renderAttrs(_ctx.obj)}></div>\`"`)
+ ).toMatchInlineSnapshot(`"\`<div\${_ssrRenderAttrs(_ctx.obj)}></div>\`"`)
expect(
getCompiledString(`<div class="foo" v-bind="obj"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderAttrs(mergeProps({ class: \\"foo\\" }, _ctx.obj))}></div>\`"`
+ `"\`<div\${_ssrRenderAttrs(mergeProps({ class: \\"foo\\" }, _ctx.obj))}></div>\`"`
)
expect(
getCompiledString(`<div :id="id" v-bind="obj"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderAttrs(mergeProps({ id: _ctx.id }, _ctx.obj))}></div>\`"`
+ `"\`<div\${_ssrRenderAttrs(mergeProps({ id: _ctx.id }, _ctx.obj))}></div>\`"`
)
// dynamic key + v-bind="object"
expect(
getCompiledString(`<div :[key]="id" v-bind="obj"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_renderAttrs(mergeProps({ [_ctx.key]: _ctx.id }, _ctx.obj))}></div>\`"`
+ `"\`<div\${_ssrRenderAttrs(mergeProps({ [_ctx.key]: _ctx.id }, _ctx.obj))}></div>\`"`
)
// should merge class and :class
expect(getCompiledString(`<div class="a" :class="b" v-bind="obj"></div>`))
.toMatchInlineSnapshot(`
- "\`<div\${_renderAttrs(mergeProps({
+ "\`<div\${_ssrRenderAttrs(mergeProps({
class: [\\"a\\", _ctx.b]
}, _ctx.obj))}></div>\`"
`)
`<div style="color:red;" :style="b" v-bind="obj"></div>`
)
).toMatchInlineSnapshot(`
- "\`<div\${_renderAttrs(mergeProps({
+ "\`<div\${_ssrRenderAttrs(mergeProps({
style: [_hoisted_1, _ctx.b]
}, _ctx.obj))}></div>\`"
`)
).toMatchInlineSnapshot(`"\`<div id=\\"foo\\"></div>\`"`)
expect(
getCompiledString(`<div v-bind="foo" v-on="bar"/>`)
- ).toMatchInlineSnapshot(`"\`<div\${_renderAttrs(_ctx.foo)}></div>\`"`)
+ ).toMatchInlineSnapshot(`"\`<div\${_ssrRenderAttrs(_ctx.foo)}></div>\`"`)
})
})
})
describe('ssr: <slot>', () => {
test('basic', () => {
expect(compile(`<slot/>`).code).toMatchInlineSnapshot(`
- "const { _renderSlot } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _renderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
+ _ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
}"
`)
})
test('with name', () => {
expect(compile(`<slot name="foo" />`).code).toMatchInlineSnapshot(`
- "const { _renderSlot } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _renderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent)
+ _ssrRenderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent)
}"
`)
})
test('with dynamic name', () => {
expect(compile(`<slot :name="bar.baz" />`).code).toMatchInlineSnapshot(`
- "const { _renderSlot } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _renderSlot(_ctx.$slots, _ctx.bar.baz, {}, null, _push, _parent)
+ _ssrRenderSlot(_ctx.$slots, _ctx.bar.baz, {}, null, _push, _parent)
}"
`)
})
test('with props', () => {
expect(compile(`<slot name="foo" :p="1" bar="2" />`).code)
.toMatchInlineSnapshot(`
- "const { _renderSlot } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _renderSlot(_ctx.$slots, \\"foo\\", {
+ _ssrRenderSlot(_ctx.$slots, \\"foo\\", {
p: 1,
bar: \\"2\\"
}, null, _push, _parent)
test('with fallback', () => {
expect(compile(`<slot>some {{ fallback }} content</slot>`).code)
.toMatchInlineSnapshot(`
- "const { _renderSlot, _interpolate } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderSlot, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _renderSlot(_ctx.$slots, \\"default\\", {}, () => {
- _push(\`some \${_interpolate(_ctx.fallback)} content\`)
+ _ssrRenderSlot(_ctx.$slots, \\"default\\", {}, () => {
+ _push(\`some \${_ssrInterpolate(_ctx.fallback)} content\`)
}, _push, _parent)
}"
`)
test('interpolation', () => {
expect(compile(`foo {{ bar }} baz`).code).toMatchInlineSnapshot(`
- "const { _interpolate } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`foo \${_interpolate(_ctx.bar)} baz\`)
+ _push(\`foo \${_ssrInterpolate(_ctx.bar)} baz\`)
}"
`)
})
compile(`<div><span>{{ foo }} bar</span><span>baz {{ qux }}</span></div>`)
.code
).toMatchInlineSnapshot(`
- "const { _interpolate } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<div><span>\${
- _interpolate(_ctx.foo)
+ _ssrInterpolate(_ctx.foo)
} bar</span><span>baz \${
- _interpolate(_ctx.qux)
+ _ssrInterpolate(_ctx.qux)
}</span></div>\`)
}"
`)
describe('ssr: v-for', () => {
test('basic', () => {
expect(compile(`<div v-for="i in list" />`).code).toMatchInlineSnapshot(`
- "const { _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
+ _ssrRenderList(_ctx.list, (i) => {
_push(\`<div></div>\`)
})
_push(\`<!---->\`)
test('nested content', () => {
expect(compile(`<div v-for="i in list">foo<span>bar</span></div>`).code)
.toMatchInlineSnapshot(`
- "const { _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
+ _ssrRenderList(_ctx.list, (i) => {
_push(\`<div>foo<span>bar</span></div>\`)
})
_push(\`<!---->\`)
`</div>`
).code
).toMatchInlineSnapshot(`
- "const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (row, i) => {
+ _ssrRenderList(_ctx.list, (row, i) => {
_push(\`<div><!---->\`)
- _renderList(row, (j) => {
+ _ssrRenderList(row, (j) => {
_push(\`<div>\${
- _interpolate(i)
+ _ssrInterpolate(i)
},\${
- _interpolate(j)
+ _ssrInterpolate(j)
}</div>\`)
})
_push(\`<!----></div>\`)
test('template v-for (text)', () => {
expect(compile(`<template v-for="i in list">{{ i }}</template>`).code)
.toMatchInlineSnapshot(`
- "const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
- _push(\`<!---->\${_interpolate(i)}<!---->\`)
+ _ssrRenderList(_ctx.list, (i) => {
+ _push(\`<!---->\${_ssrInterpolate(i)}<!---->\`)
})
_push(\`<!---->\`)
}"
compile(`<template v-for="i in list"><span>{{ i }}</span></template>`)
.code
).toMatchInlineSnapshot(`
- "const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
- _push(\`<span>\${_interpolate(i)}</span>\`)
+ _ssrRenderList(_ctx.list, (i) => {
+ _push(\`<span>\${_ssrInterpolate(i)}</span>\`)
})
_push(\`<!---->\`)
}"
`<template v-for="i in list"><span>{{ i }}</span><span>{{ i + 1 }}</span></template>`
).code
).toMatchInlineSnapshot(`
- "const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
+ _ssrRenderList(_ctx.list, (i) => {
_push(\`<!----><span>\${
- _interpolate(i)
+ _ssrInterpolate(i)
}</span><span>\${
- _interpolate(i + 1)
+ _ssrInterpolate(i + 1)
}</span><!---->\`)
})
_push(\`<!---->\`)
expect(code).not.toMatch(`_ctx.foo`)
expect(code).not.toMatch(`_ctx.index`)
expect(code).toMatchInlineSnapshot(`
- "const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
- _renderList(_ctx.list, ({ foo }, index) => {
- _push(\`<div>\${_interpolate(foo + _ctx.bar + index)}</div>\`)
+ _ssrRenderList(_ctx.list, ({ foo }, index) => {
+ _push(\`<div>\${_ssrInterpolate(foo + _ctx.bar + index)}</div>\`)
})
_push(\`<!---->\`)
}"
expect(
compile(`<template v-if="foo"><div v-for="i in list"/></template>`).code
).toMatchInlineSnapshot(`
- "const { _renderList } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
if (_ctx.foo) {
_push(\`<!---->\`)
- _renderList(_ctx.list, (i) => {
+ _ssrRenderList(_ctx.list, (i) => {
_push(\`<div></div>\`)
})
_push(\`<!---->\`)
describe('ssr: v-model', () => {
test('<input> (text types)', () => {
expect(compile(`<input v-model="bar">`).code).toMatchInlineSnapshot(`
- "const { _renderAttr } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<input\${_renderAttr(\\"value\\", _ctx.bar)}>\`)
+ _push(\`<input\${_ssrRenderAttr(\\"value\\", _ctx.bar)}>\`)
}"
`)
expect(compile(`<input type="email" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _renderAttr } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<input type=\\"email\\"\${_renderAttr(\\"value\\", _ctx.bar)}>\`)
+ _push(\`<input type=\\"email\\"\${_ssrRenderAttr(\\"value\\", _ctx.bar)}>\`)
}"
`)
})
test('<input type="radio">', () => {
expect(compile(`<input type="radio" value="foo" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _looseEqual } = require(\\"@vue/server-renderer\\")
+ "const { _ssrLooseEqual } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<input type=\\"radio\\" value=\\"foo\\"\${(_looseEqual(_ctx.bar, \\"foo\\")) ? \\" checked\\" : \\"\\"}>\`)
+ _push(\`<input type=\\"radio\\" value=\\"foo\\"\${(_ssrLooseEqual(_ctx.bar, \\"foo\\")) ? \\" checked\\" : \\"\\"}>\`)
}"
`)
})
test('<input type="checkbox"', () => {
expect(compile(`<input type="checkbox" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _looseContain } = require(\\"@vue/server-renderer\\")
+ "const { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\"\${((Array.isArray(_ctx.bar))
- ? _looseContain(_ctx.bar, null)
+ ? _ssrLooseContain(_ctx.bar, null)
: _ctx.bar) ? \\" checked\\" : \\"\\"}>\`)
}"
`)
expect(compile(`<input type="checkbox" value="foo" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _looseContain } = require(\\"@vue/server-renderer\\")
+ "const { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\" value=\\"foo\\"\${((Array.isArray(_ctx.bar))
- ? _looseContain(_ctx.bar, \\"foo\\")
+ ? _ssrLooseContain(_ctx.bar, \\"foo\\")
: _ctx.bar) ? \\" checked\\" : \\"\\"}>\`)
}"
`)
test('<textarea>', () => {
expect(compile(`<textarea v-model="foo">bar</textarea>`).code)
.toMatchInlineSnapshot(`
- "const { _interpolate } = require(\\"@vue/server-renderer\\")
+ "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<textarea>\${_interpolate(_ctx.foo)}</textarea>\`)
+ _push(\`<textarea>\${_ssrInterpolate(_ctx.foo)}</textarea>\`)
}"
`)
})
test('<input :type="x">', () => {
expect(compile(`<input :type="x" v-model="foo">`).code)
.toMatchInlineSnapshot(`
- "const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
- _renderAttr(\\"type\\", _ctx.x)
+ _ssrRenderAttr(\\"type\\", _ctx.x)
}\${
- _renderDynamicModel(_ctx.x, _ctx.foo, null)
+ _ssrRenderDynamicModel(_ctx.x, _ctx.foo, null)
}>\`)
}"
`)
expect(compile(`<input :type="x" v-model="foo" value="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
- _renderAttr(\\"type\\", _ctx.x)
+ _ssrRenderAttr(\\"type\\", _ctx.x)
}\${
- _renderDynamicModel(_ctx.x, _ctx.foo, \\"bar\\")
+ _ssrRenderDynamicModel(_ctx.x, _ctx.foo, \\"bar\\")
} value=\\"bar\\">\`)
}"
`)
expect(compile(`<input :type="x" v-model="foo" :value="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
- _renderAttr(\\"type\\", _ctx.x)
+ _ssrRenderAttr(\\"type\\", _ctx.x)
}\${
- _renderDynamicModel(_ctx.x, _ctx.foo, _ctx.bar)
+ _ssrRenderDynamicModel(_ctx.x, _ctx.foo, _ctx.bar)
}\${
- _renderAttr(\\"value\\", _ctx.bar)
+ _ssrRenderAttr(\\"value\\", _ctx.bar)
}>\`)
}"
`)
expect(compile(`<input v-bind="obj" v-model="foo">`).code)
.toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\")
- const { _renderAttrs, _getDynamicModelProps } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
- _push(\`<input\${_renderAttrs(_temp0 = _ctx.obj, mergeProps(_temp0, _getDynamicModelProps(_temp0, _ctx.foo)))}>\`)
+ _push(\`<input\${_ssrRenderAttrs(_temp0 = _ctx.obj, mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo)))}>\`)
}"
`)
expect(compile(`<input id="x" v-bind="obj" v-model="foo" class="y">`).code)
.toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\")
- const { _renderAttrs, _getDynamicModelProps } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
- _push(\`<input\${_renderAttrs(_temp0 = mergeProps({ id: \\"x\\" }, _ctx.obj, { class: \\"y\\" }), mergeProps(_temp0, _getDynamicModelProps(_temp0, _ctx.foo)))}>\`)
+ _push(\`<input\${_ssrRenderAttrs(_temp0 = mergeProps({ id: \\"x\\" }, _ctx.obj, { class: \\"y\\" }), mergeProps(_temp0, _ssrGetDynamicModelProps(_temp0, _ctx.foo)))}>\`)
}"
`)
})
describe('ssr: v-show', () => {
test('basic', () => {
expect(compile(`<div v-show="foo"/>`).code).toMatchInlineSnapshot(`
- "const { _renderStyle } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_renderStyle((_ctx.foo) ? null : { display: \\"none\\" })}></div>\`)
+ _push(\`<div\${_ssrRenderStyle((_ctx.foo) ? null : { display: \\"none\\" })}></div>\`)
}"
`)
})
test('with static style', () => {
expect(compile(`<div style="color:red" v-show="foo"/>`).code)
.toMatchInlineSnapshot(`
- "const { _renderStyle } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_renderStyle([
+ _push(\`<div\${_ssrRenderStyle([
_hoisted_1,
(_ctx.foo) ? null : { display: \\"none\\" }
])}></div>\`)
test('with dynamic style', () => {
expect(compile(`<div :style="{ color: 'red' }" v-show="foo"/>`).code)
.toMatchInlineSnapshot(`
- "const { _renderStyle } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_renderStyle([
+ _push(\`<div\${_ssrRenderStyle([
{ color: 'red' },
(_ctx.foo) ? null : { display: \\"none\\" }
])}></div>\`)
compile(`<div style="color:red" :style="{ fontSize: 14 }" v-show="foo"/>`)
.code
).toMatchInlineSnapshot(`
- "const { _renderStyle } = require(\\"@vue/server-renderer\\")
+ "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_renderStyle([
+ _push(\`<div\${_ssrRenderStyle([
_hoisted_1,
{ fontSize: 14 },
(_ctx.foo) ? null : { display: \\"none\\" }
).code
).toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\")
- const { _renderAttrs } = require(\\"@vue/server-renderer\\")
+ const { _ssrRenderAttrs } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_renderAttrs(mergeProps(_ctx.baz, {
+ _push(\`<div\${_ssrRenderAttrs(mergeProps(_ctx.baz, {
style: [
_hoisted_1,
{ fontSize: 14 },