theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

test: update snapshots

Browse Source
This commit is contained in:
Evan You 2020-02-06 12:09:09 -05:00
parent bc8f91d181
commit ae8fc9297d
8 changed files with 114 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/compiler-ssr/__tests__/ssrComponent.spec.ts
View File

@ -4,12 +4,12 @@ describe('ssr: components', () => {
test('basic', () => { test('basic', () => {
expect(compile(`<foo id="a" :prop="b" />`).code).toMatchInlineSnapshot(` expect(compile(`<foo id="a" :prop="b" />`).code).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, { _ssrRenderComponent(_component_foo, {
id: \\"a\\", id: \\"a\\",
prop: _ctx.b prop: _ctx.b
}, null, _parent) }, null, _parent)
@ -21,24 +21,24 @@ describe('ssr: components', () => {
expect(compile(`<component is="foo" prop="b" />`).code) expect(compile(`<component is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") 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) expect(compile(`<compoonent :is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_compoonent = resolveComponent(\\"compoonent\\") const _component_compoonent = resolveComponent(\\"compoonent\\")
_renderComponent(_component_compoonent, { _ssrRenderComponent(_component_compoonent, {
is: _ctx.foo, is: _ctx.foo,
prop: \\"b\\" prop: \\"b\\"
}, null, _parent) }, null, _parent)
@ -50,12 +50,12 @@ describe('ssr: components', () => {
test('implicit default slot', () => { test('implicit default slot', () => {
expect(compile(`<foo>hello<div/></foo>`).code).toMatchInlineSnapshot(` expect(compile(`<foo>hello<div/></foo>`).code).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, null, { _ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => { default: (_, _push, _parent) => {
_push(\`hello<div></div>\`) _push(\`hello<div></div>\`)
}, },
@ -69,14 +69,14 @@ describe('ssr: components', () => {
expect(compile(`<foo v-slot="{ msg }">{{ msg + outer }}</foo>`).code) expect(compile(`<foo v-slot="{ msg }">{{ msg + outer }}</foo>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent, _interpolate } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, null, { _ssrRenderComponent(_component_foo, null, {
default: ({ msg }, _push, _parent) => { default: ({ msg }, _push, _parent) => {
_push(\`\${_interpolate(msg + _ctx.outer)}\`) _push(\`\${_ssrInterpolate(msg + _ctx.outer)}\`)
}, },
_compiled: true _compiled: true
}, _parent) }, _parent)
@ -92,12 +92,12 @@ describe('ssr: components', () => {
</foo>`).code </foo>`).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { resolveComponent } = require(\\"vue\\") "const { resolveComponent } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, null, { _ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent) => { default: (_, _push, _parent) => {
_push(\`foo\`) _push(\`foo\`)
}, },
@ -117,12 +117,12 @@ describe('ssr: components', () => {
</foo>`).code </foo>`).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { resolveComponent, createSlots } = require(\\"vue\\") "const { resolveComponent, createSlots } = require(\\"vue\\")
const { _renderComponent } = require(\\"@vue/server-renderer\\") const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, null, createSlots({ _compiled: true }, [ _ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
(_ctx.ok) (_ctx.ok)
? { ? {
name: \\"named\\", name: \\"named\\",
@ -143,17 +143,17 @@ describe('ssr: components', () => {
</foo>`).code </foo>`).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { resolveComponent, renderList, createSlots } = require(\\"vue\\") "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) { return function ssrRender(_ctx, _push, _parent) {
const _component_foo = resolveComponent(\\"foo\\") const _component_foo = resolveComponent(\\"foo\\")
_renderComponent(_component_foo, null, createSlots({ _compiled: true }, [ _ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
renderList(_ctx.names, (key) => { renderList(_ctx.names, (key) => {
return { return {
name: key, name: key,
fn: ({ msg }, _push, _parent) => { fn: ({ msg }, _push, _parent) => {
_push(\`\${_interpolate(msg + key + _ctx.bar)}\`) _push(\`\${_ssrInterpolate(msg + key + _ctx.bar)}\`)
} }
} }
}) })

40
packages/compiler-ssr/__tests__/ssrElement.spec.ts
View File

@ -30,7 +30,7 @@ describe('ssr: element', () => {
test('v-text', () => { test('v-text', () => {
expect(getCompiledString(`<div v-text="foo"/>`)).toMatchInlineSnapshot( expect(getCompiledString(`<div v-text="foo"/>`)).toMatchInlineSnapshot(
`"\`<div>\${_interpolate(_ctx.foo)}</div>\`"` `"\`<div>\${_ssrInterpolate(_ctx.foo)}</div>\`"`
) )
}) })
@ -38,7 +38,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<textarea :value="foo"/>`) getCompiledString(`<textarea :value="foo"/>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<textarea>\${_interpolate(_ctx.foo)}</textarea>\`"` `"\`<textarea>\${_ssrInterpolate(_ctx.foo)}</textarea>\`"`
) )
}) })
@ -51,15 +51,15 @@ describe('ssr: element', () => {
test('<textarea> with dynamic v-bind', () => { test('<textarea> with dynamic v-bind', () => {
expect(compile(`<textarea v-bind="obj">fallback</textarea>`).code) expect(compile(`<textarea v-bind="obj">fallback</textarea>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderAttrs, _interpolate } = require(\\"@vue/server-renderer\\") "const { _ssrRenderAttrs, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
let _temp0 let _temp0
_push(\`<textarea\${ _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>\`) }</textarea>\`)
}" }"
`) `)
@ -77,7 +77,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div id="foo" :class="bar"></div>`) getCompiledString(`<div id="foo" :class="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div id=\\"foo\\"\${_renderClass(_ctx.bar)}></div>\`"` `"\`<div id=\\"foo\\"\${_ssrRenderClass(_ctx.bar)}></div>\`"`
) )
}) })
@ -85,7 +85,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div class="foo" :class="bar"></div>`) getCompiledString(`<div class="foo" :class="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_renderClass([_ctx.bar, \\"foo\\"])}></div>\`"` `"\`<div\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}></div>\`"`
) )
}) })
@ -93,7 +93,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div id="foo" :style="bar"></div>`) getCompiledString(`<div id="foo" :style="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div id=\\"foo\\"\${_renderStyle(_ctx.bar)}></div>\`"` `"\`<div id=\\"foo\\"\${_ssrRenderStyle(_ctx.bar)}></div>\`"`
) )
}) })
@ -101,7 +101,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div style="color:red;" :style="bar"></div>`) getCompiledString(`<div style="color:red;" :style="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_renderStyle([_hoisted_1, _ctx.bar])}></div>\`"` `"\`<div\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}></div>\`"`
) )
}) })
@ -117,7 +117,7 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div :id="id" class="bar"></div>`) getCompiledString(`<div :id="id" class="bar"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_renderAttr(\\"id\\", _ctx.id)} class=\\"bar\\"></div>\`"` `"\`<div\${_ssrRenderAttr(\\"id\\", _ctx.id)} class=\\"bar\\"></div>\`"`
) )
}) })
@ -125,12 +125,12 @@ describe('ssr: element', () => {
expect( expect(
getCompiledString(`<div v-bind:[key]="value"></div>`) getCompiledString(`<div v-bind:[key]="value"></div>`)
).toMatchInlineSnapshot( ).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>`)) expect(getCompiledString(`<div class="foo" v-bind:[key]="value"></div>`))
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"\`<div\${_renderAttrs({ "\`<div\${_ssrRenderAttrs({
class: \\"foo\\", class: \\"foo\\",
[_ctx.key]: _ctx.value [_ctx.key]: _ctx.value
})}></div>\`" })}></div>\`"
@ -138,7 +138,7 @@ describe('ssr: element', () => {
expect(getCompiledString(`<div :id="id" v-bind:[key]="value"></div>`)) expect(getCompiledString(`<div :id="id" v-bind:[key]="value"></div>`))
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"\`<div\${_renderAttrs({ "\`<div\${_ssrRenderAttrs({
id: _ctx.id, id: _ctx.id,
[_ctx.key]: _ctx.value [_ctx.key]: _ctx.value
})}></div>\`" })}></div>\`"
@ -148,31 +148,31 @@ describe('ssr: element', () => {
test('v-bind="obj"', () => { test('v-bind="obj"', () => {
expect( expect(
getCompiledString(`<div v-bind="obj"></div>`) getCompiledString(`<div v-bind="obj"></div>`)
).toMatchInlineSnapshot(`"\`<div\${_renderAttrs(_ctx.obj)}></div>\`"`) ).toMatchInlineSnapshot(`"\`<div\${_ssrRenderAttrs(_ctx.obj)}></div>\`"`)
expect( expect(
getCompiledString(`<div class="foo" v-bind="obj"></div>`) getCompiledString(`<div class="foo" v-bind="obj"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_renderAttrs(mergeProps({ class: \\"foo\\" }, _ctx.obj))}></div>\`"` `"\`<div\${_ssrRenderAttrs(mergeProps({ class: \\"foo\\" }, _ctx.obj))}></div>\`"`
) )
expect( expect(
getCompiledString(`<div :id="id" v-bind="obj"></div>`) getCompiledString(`<div :id="id" v-bind="obj"></div>`)
).toMatchInlineSnapshot( ).toMatchInlineSnapshot(
`"\`<div\${_renderAttrs(mergeProps({ id: _ctx.id }, _ctx.obj))}></div>\`"` `"\`<div\${_ssrRenderAttrs(mergeProps({ id: _ctx.id }, _ctx.obj))}></div>\`"`
) )
// dynamic key + v-bind="object" // dynamic key + v-bind="object"
expect( expect(
getCompiledString(`<div :[key]="id" v-bind="obj"></div>`) getCompiledString(`<div :[key]="id" v-bind="obj"></div>`)
).toMatchInlineSnapshot( ).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 // should merge class and :class
expect(getCompiledString(`<div class="a" :class="b" v-bind="obj"></div>`)) expect(getCompiledString(`<div class="a" :class="b" v-bind="obj"></div>`))
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"\`<div\${_renderAttrs(mergeProps({ "\`<div\${_ssrRenderAttrs(mergeProps({
class: [\\"a\\", _ctx.b] class: [\\"a\\", _ctx.b]
}, _ctx.obj))}></div>\`" }, _ctx.obj))}></div>\`"
`) `)
@ -183,7 +183,7 @@ describe('ssr: element', () => {
`<div style="color:red;" :style="b" v-bind="obj"></div>` `<div style="color:red;" :style="b" v-bind="obj"></div>`
) )
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"\`<div\${_renderAttrs(mergeProps({ "\`<div\${_ssrRenderAttrs(mergeProps({
style: [_hoisted_1, _ctx.b] style: [_hoisted_1, _ctx.b]
}, _ctx.obj))}></div>\`" }, _ctx.obj))}></div>\`"
`) `)
@ -198,7 +198,7 @@ describe('ssr: element', () => {
).toMatchInlineSnapshot(`"\`<div id=\\"foo\\"></div>\`"`) ).toMatchInlineSnapshot(`"\`<div id=\\"foo\\"></div>\`"`)
expect( expect(
getCompiledString(`<div v-bind="foo" v-on="bar"/>`) getCompiledString(`<div v-bind="foo" v-on="bar"/>`)
).toMatchInlineSnapshot(`"\`<div\${_renderAttrs(_ctx.foo)}></div>\`"`) ).toMatchInlineSnapshot(`"\`<div\${_ssrRenderAttrs(_ctx.foo)}></div>\`"`)
}) })
}) })
}) })

22
packages/compiler-ssr/__tests__/ssrSlotOutlet.spec.ts
View File

@ -3,30 +3,30 @@ import { compile } from '../src'
describe('ssr: <slot>', () => { describe('ssr: <slot>', () => {
test('basic', () => { test('basic', () => {
expect(compile(`<slot/>`).code).toMatchInlineSnapshot(` expect(compile(`<slot/>`).code).toMatchInlineSnapshot(`
"const { _renderSlot } = require(\\"@vue/server-renderer\\") "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_renderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent) _ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
}" }"
`) `)
}) })
test('with name', () => { test('with name', () => {
expect(compile(`<slot name="foo" />`).code).toMatchInlineSnapshot(` 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) { return function ssrRender(_ctx, _push, _parent) {
_renderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent) _ssrRenderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent)
}" }"
`) `)
}) })
test('with dynamic name', () => { test('with dynamic name', () => {
expect(compile(`<slot :name="bar.baz" />`).code).toMatchInlineSnapshot(` 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) { return function ssrRender(_ctx, _push, _parent) {
_renderSlot(_ctx.$slots, _ctx.bar.baz, {}, null, _push, _parent) _ssrRenderSlot(_ctx.$slots, _ctx.bar.baz, {}, null, _push, _parent)
}" }"
`) `)
}) })
@ -34,10 +34,10 @@ describe('ssr: <slot>', () => {
test('with props', () => { test('with props', () => {
expect(compile(`<slot name="foo" :p="1" bar="2" />`).code) expect(compile(`<slot name="foo" :p="1" bar="2" />`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderSlot } = require(\\"@vue/server-renderer\\") "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_renderSlot(_ctx.$slots, \\"foo\\", { _ssrRenderSlot(_ctx.$slots, \\"foo\\", {
p: 1, p: 1,
bar: \\"2\\" bar: \\"2\\"
}, null, _push, _parent) }, null, _push, _parent)
@ -48,11 +48,11 @@ describe('ssr: <slot>', () => {
test('with fallback', () => { test('with fallback', () => {
expect(compile(`<slot>some {{ fallback }} content</slot>`).code) expect(compile(`<slot>some {{ fallback }} content</slot>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderSlot, _interpolate } = require(\\"@vue/server-renderer\\") "const { _ssrRenderSlot, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_renderSlot(_ctx.$slots, \\"default\\", {}, () => { _ssrRenderSlot(_ctx.$slots, \\"default\\", {}, () => {
_push(\`some \${_interpolate(_ctx.fallback)} content\`) _push(\`some \${_ssrInterpolate(_ctx.fallback)} content\`)
}, _push, _parent) }, _push, _parent)
}" }"
`) `)

10
packages/compiler-ssr/__tests__/ssrText.spec.ts
View File

@ -22,10 +22,10 @@ describe('ssr: text', () => {
test('interpolation', () => { test('interpolation', () => {
expect(compile(`foo {{ bar }} baz`).code).toMatchInlineSnapshot(` 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) { return function ssrRender(_ctx, _push, _parent) {
_push(\`foo \${_interpolate(_ctx.bar)} baz\`) _push(\`foo \${_ssrInterpolate(_ctx.bar)} baz\`)
}" }"
`) `)
}) })
@ -35,13 +35,13 @@ describe('ssr: text', () => {
compile(`<div><span>{{ foo }} bar</span><span>baz {{ qux }}</span></div>`) compile(`<div><span>{{ foo }} bar</span><span>baz {{ qux }}</span></div>`)
.code .code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _interpolate } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div><span>\${ _push(\`<div><span>\${
_interpolate(_ctx.foo) _ssrInterpolate(_ctx.foo)
} bar</span><span>baz \${ } bar</span><span>baz \${
_interpolate(_ctx.qux) _ssrInterpolate(_ctx.qux)
}</span></div>\`) }</span></div>\`)
}" }"
`) `)

44
packages/compiler-ssr/__tests__/ssrVFor.spec.ts
View File

@ -3,11 +3,11 @@ import { compile } from '../src'
describe('ssr: v-for', () => { describe('ssr: v-for', () => {
test('basic', () => { test('basic', () => {
expect(compile(`<div v-for="i in list" />`).code).toMatchInlineSnapshot(` 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) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<div></div>\`) _push(\`<div></div>\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
@ -18,11 +18,11 @@ describe('ssr: v-for', () => {
test('nested content', () => { test('nested content', () => {
expect(compile(`<div v-for="i in list">foo<span>bar</span></div>`).code) expect(compile(`<div v-for="i in list">foo<span>bar</span></div>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<div>foo<span>bar</span></div>\`) _push(\`<div>foo<span>bar</span></div>\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
@ -38,17 +38,17 @@ describe('ssr: v-for', () => {
`</div>` `</div>`
).code ).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (row, i) => { _ssrRenderList(_ctx.list, (row, i) => {
_push(\`<div><!---->\`) _push(\`<div><!---->\`)
_renderList(row, (j) => { _ssrRenderList(row, (j) => {
_push(\`<div>\${ _push(\`<div>\${
_interpolate(i) _ssrInterpolate(i)
},\${ },\${
_interpolate(j) _ssrInterpolate(j)
}</div>\`) }</div>\`)
}) })
_push(\`<!----></div>\`) _push(\`<!----></div>\`)
@ -61,12 +61,12 @@ describe('ssr: v-for', () => {
test('template v-for (text)', () => { test('template v-for (text)', () => {
expect(compile(`<template v-for="i in list">{{ i }}</template>`).code) expect(compile(`<template v-for="i in list">{{ i }}</template>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<!---->\${_interpolate(i)}<!---->\`) _push(\`<!---->\${_ssrInterpolate(i)}<!---->\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
}" }"
@ -78,12 +78,12 @@ describe('ssr: v-for', () => {
compile(`<template v-for="i in list"><span>{{ i }}</span></template>`) compile(`<template v-for="i in list"><span>{{ i }}</span></template>`)
.code .code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<span>\${_interpolate(i)}</span>\`) _push(\`<span>\${_ssrInterpolate(i)}</span>\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
}" }"
@ -96,15 +96,15 @@ describe('ssr: v-for', () => {
`<template v-for="i in list"><span>{{ i }}</span><span>{{ i + 1 }}</span></template>` `<template v-for="i in list"><span>{{ i }}</span><span>{{ i + 1 }}</span></template>`
).code ).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<!----><span>\${ _push(\`<!----><span>\${
_interpolate(i) _ssrInterpolate(i)
}</span><span>\${ }</span><span>\${
_interpolate(i + 1) _ssrInterpolate(i + 1)
}</span><!---->\`) }</span><!---->\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
@ -120,12 +120,12 @@ describe('ssr: v-for', () => {
expect(code).not.toMatch(`_ctx.foo`) expect(code).not.toMatch(`_ctx.foo`)
expect(code).not.toMatch(`_ctx.index`) expect(code).not.toMatch(`_ctx.index`)
expect(code).toMatchInlineSnapshot(` expect(code).toMatchInlineSnapshot(`
"const { _interpolate, _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, ({ foo }, index) => { _ssrRenderList(_ctx.list, ({ foo }, index) => {
_push(\`<div>\${_interpolate(foo + _ctx.bar + index)}</div>\`) _push(\`<div>\${_ssrInterpolate(foo + _ctx.bar + index)}</div>\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)
}" }"

4
packages/compiler-ssr/__tests__/ssrVIf.spec.ts
View File

@ -122,12 +122,12 @@ describe('ssr: v-if', () => {
expect( expect(
compile(`<template v-if="foo"><div v-for="i in list"/></template>`).code compile(`<template v-if="foo"><div v-for="i in list"/></template>`).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _renderList } = require(\\"@vue/server-renderer\\") "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
if (_ctx.foo) { if (_ctx.foo) {
_push(\`<!---->\`) _push(\`<!---->\`)
_renderList(_ctx.list, (i) => { _ssrRenderList(_ctx.list, (i) => {
_push(\`<div></div>\`) _push(\`<div></div>\`)
}) })
_push(\`<!---->\`) _push(\`<!---->\`)

52
packages/compiler-ssr/__tests__/ssrVModel.spec.ts
View File

@ -3,19 +3,19 @@ import { compile } from '../src'
describe('ssr: v-model', () => { describe('ssr: v-model', () => {
test('<input> (text types)', () => { test('<input> (text types)', () => {
expect(compile(`<input v-model="bar">`).code).toMatchInlineSnapshot(` 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) { 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) expect(compile(`<input type="email" v-model="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderAttr } = require(\\"@vue/server-renderer\\") "const { _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"email\\"\${_renderAttr(\\"value\\", _ctx.bar)}>\`) _push(\`<input type=\\"email\\"\${_ssrRenderAttr(\\"value\\", _ctx.bar)}>\`)
}" }"
`) `)
}) })
@ -23,10 +23,10 @@ describe('ssr: v-model', () => {
test('<input type="radio">', () => { test('<input type="radio">', () => {
expect(compile(`<input type="radio" value="foo" v-model="bar">`).code) expect(compile(`<input type="radio" value="foo" v-model="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _looseEqual } = require(\\"@vue/server-renderer\\") "const { _ssrLooseEqual } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { 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\\" : \\"\\"}>\`)
}" }"
`) `)
}) })
@ -34,22 +34,22 @@ describe('ssr: v-model', () => {
test('<input type="checkbox"', () => { test('<input type="checkbox"', () => {
expect(compile(`<input type="checkbox" v-model="bar">`).code) expect(compile(`<input type="checkbox" v-model="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _looseContain } = require(\\"@vue/server-renderer\\") "const { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\"\${((Array.isArray(_ctx.bar)) _push(\`<input type=\\"checkbox\\"\${((Array.isArray(_ctx.bar))
? _looseContain(_ctx.bar, null) ? _ssrLooseContain(_ctx.bar, null)
: _ctx.bar) ? \\" checked\\" : \\"\\"}>\`) : _ctx.bar) ? \\" checked\\" : \\"\\"}>\`)
}" }"
`) `)
expect(compile(`<input type="checkbox" value="foo" v-model="bar">`).code) expect(compile(`<input type="checkbox" value="foo" v-model="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _looseContain } = require(\\"@vue/server-renderer\\") "const { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\" value=\\"foo\\"\${((Array.isArray(_ctx.bar)) _push(\`<input type=\\"checkbox\\" value=\\"foo\\"\${((Array.isArray(_ctx.bar))
? _looseContain(_ctx.bar, \\"foo\\") ? _ssrLooseContain(_ctx.bar, \\"foo\\")
: _ctx.bar) ? \\" checked\\" : \\"\\"}>\`) : _ctx.bar) ? \\" checked\\" : \\"\\"}>\`)
}" }"
`) `)
@ -58,10 +58,10 @@ describe('ssr: v-model', () => {
test('<textarea>', () => { test('<textarea>', () => {
expect(compile(`<textarea v-model="foo">bar</textarea>`).code) expect(compile(`<textarea v-model="foo">bar</textarea>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _interpolate } = require(\\"@vue/server-renderer\\") "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<textarea>\${_interpolate(_ctx.foo)}</textarea>\`) _push(\`<textarea>\${_ssrInterpolate(_ctx.foo)}</textarea>\`)
}" }"
`) `)
}) })
@ -69,41 +69,41 @@ describe('ssr: v-model', () => {
test('<input :type="x">', () => { test('<input :type="x">', () => {
expect(compile(`<input :type="x" v-model="foo">`).code) expect(compile(`<input :type="x" v-model="foo">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\") "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${ _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) expect(compile(`<input :type="x" v-model="foo" value="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\") "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${ _push(\`<input\${
_renderAttr(\\"type\\", _ctx.x) _ssrRenderAttr(\\"type\\", _ctx.x)
}\${ }\${
_renderDynamicModel(_ctx.x, _ctx.foo, \\"bar\\") _ssrRenderDynamicModel(_ctx.x, _ctx.foo, \\"bar\\")
} value=\\"bar\\">\`) } value=\\"bar\\">\`)
}" }"
`) `)
expect(compile(`<input :type="x" v-model="foo" :value="bar">`).code) expect(compile(`<input :type="x" v-model="foo" :value="bar">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderAttr, _renderDynamicModel } = require(\\"@vue/server-renderer\\") "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${ _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)
}>\`) }>\`)
}" }"
`) `)
@ -113,24 +113,24 @@ describe('ssr: v-model', () => {
expect(compile(`<input v-bind="obj" v-model="foo">`).code) expect(compile(`<input v-bind="obj" v-model="foo">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\") "const { mergeProps } = require(\\"vue\\")
const { _renderAttrs, _getDynamicModelProps } = require(\\"@vue/server-renderer\\") const { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
let _temp0 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) expect(compile(`<input id="x" v-bind="obj" v-model="foo" class="y">`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\") "const { mergeProps } = require(\\"vue\\")
const { _renderAttrs, _getDynamicModelProps } = require(\\"@vue/server-renderer\\") const { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
let _temp0 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)))}>\`)
}" }"
`) `)
}) })

20
packages/compiler-ssr/__tests__/ssrVShow.spec.ts
View File

@ -3,10 +3,10 @@ import { compile } from '../src'
describe('ssr: v-show', () => { describe('ssr: v-show', () => {
test('basic', () => { test('basic', () => {
expect(compile(`<div v-show="foo"/>`).code).toMatchInlineSnapshot(` 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) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_renderStyle((_ctx.foo) ? null : { display: \\"none\\" })}></div>\`) _push(\`<div\${_ssrRenderStyle((_ctx.foo) ? null : { display: \\"none\\" })}></div>\`)
}" }"
`) `)
}) })
@ -14,12 +14,12 @@ describe('ssr: v-show', () => {
test('with static style', () => { test('with static style', () => {
expect(compile(`<div style="color:red" v-show="foo"/>`).code) expect(compile(`<div style="color:red" v-show="foo"/>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderStyle } = require(\\"@vue/server-renderer\\") "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"} const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_renderStyle([ _push(\`<div\${_ssrRenderStyle([
_hoisted_1, _hoisted_1,
(_ctx.foo) ? null : { display: \\"none\\" } (_ctx.foo) ? null : { display: \\"none\\" }
])}></div>\`) ])}></div>\`)
@ -30,10 +30,10 @@ describe('ssr: v-show', () => {
test('with dynamic style', () => { test('with dynamic style', () => {
expect(compile(`<div :style="{ color: 'red' }" v-show="foo"/>`).code) expect(compile(`<div :style="{ color: 'red' }" v-show="foo"/>`).code)
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
"const { _renderStyle } = require(\\"@vue/server-renderer\\") "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_renderStyle([ _push(\`<div\${_ssrRenderStyle([
{ color: 'red' }, { color: 'red' },
(_ctx.foo) ? null : { display: \\"none\\" } (_ctx.foo) ? null : { display: \\"none\\" }
])}></div>\`) ])}></div>\`)
@ -46,12 +46,12 @@ describe('ssr: v-show', () => {
compile(`<div style="color:red" :style="{ fontSize: 14 }" v-show="foo"/>`) compile(`<div style="color:red" :style="{ fontSize: 14 }" v-show="foo"/>`)
.code .code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { _renderStyle } = require(\\"@vue/server-renderer\\") "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"} const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_renderStyle([ _push(\`<div\${_ssrRenderStyle([
_hoisted_1, _hoisted_1,
{ fontSize: 14 }, { fontSize: 14 },
(_ctx.foo) ? null : { display: \\"none\\" } (_ctx.foo) ? null : { display: \\"none\\" }
@ -67,12 +67,12 @@ describe('ssr: v-show', () => {
).code ).code
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
"const { mergeProps } = require(\\"vue\\") "const { mergeProps } = require(\\"vue\\")
const { _renderAttrs } = require(\\"@vue/server-renderer\\") const { _ssrRenderAttrs } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"} const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) { return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_renderAttrs(mergeProps(_ctx.baz, { _push(\`<div\${_ssrRenderAttrs(mergeProps(_ctx.baz, {
style: [ style: [
_hoisted_1, _hoisted_1,
{ fontSize: 14 }, { fontSize: 14 },