const _ctx = this
const _cache = _ctx.$cache
return _cache[1] || (
- setBlockTracking(-1),
+ _setBlockTracking(-1),
_cache[1] = foo,
- setBlockTracking(1),
+ _setBlockTracking(1),
_cache[1]
)
}"
`;
exports[`compiler: codegen function mode preamble w/ prefixIdentifiers: true 1`] = `
-"const { createVNode, resolveDirective } = Vue
+"const { createVNode: _createVNode, resolveDirective: _resolveDirective } = Vue
return function render() {
const _ctx = this
`;
exports[`compiler: codegen module mode preamble 1`] = `
+"import { createVNode as _createVNode, resolveDirective as _resolveDirective } from \\"vue\\"
+
+export function render() {
+ const _ctx = this
+ return null
+}"
+`;
+
+exports[`compiler: codegen module mode preamble w/ optimizeBindings: true 1`] = `
"import { createVNode, resolveDirective } from \\"vue\\"
+// Binding optimization for webpack code-split
+const _createVNode = createVNode, _resolveDirective = resolveDirective
+
export function render() {
const _ctx = this
return null
`;
exports[`compiler: integration tests function mode w/ prefixIdentifiers: true 1`] = `
-"const { toDisplayString, createVNode, openBlock, createBlock, createCommentVNode, Fragment, renderList, createTextVNode } = Vue
+"const { toDisplayString: _toDisplayString, createVNode: _createVNode, openBlock: _openBlock, createBlock: _createBlock, createCommentVNode: _createCommentVNode, Fragment: _Fragment, renderList: _renderList, createTextVNode: _createTextVNode } = Vue
return function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"div\\", {
+ return (_openBlock(), _createBlock(\\"div\\", {
id: \\"foo\\",
class: _ctx.bar.baz
}, [
- createTextVNode(toDisplayString(_ctx.world.burn()) + \\" \\", 1 /* TEXT */),
- (openBlock(), (_ctx.ok)
- ? createBlock(\\"div\\", { key: 0 }, \\"yes\\")
- : createBlock(Fragment, { key: 1 }, [\\"no\\"])),
- (openBlock(false), createBlock(Fragment, null, renderList(_ctx.list, (value, index) => {
- return (openBlock(), createBlock(\\"div\\", null, [
- createVNode(\\"span\\", null, toDisplayString(value + index), 1 /* TEXT */)
+ _createTextVNode(_toDisplayString(_ctx.world.burn()) + \\" \\", 1 /* TEXT */),
+ (_openBlock(), (_ctx.ok)
+ ? _createBlock(\\"div\\", { key: 0 }, \\"yes\\")
+ : _createBlock(_Fragment, { key: 1 }, [\\"no\\"])),
+ (_openBlock(false), _createBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
+ return (_openBlock(), _createBlock(\\"div\\", null, [
+ _createVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
]))
}), 256 /* UNKEYED_FRAGMENT */))
], 2 /* CLASS */))
`;
exports[`compiler: integration tests module mode 1`] = `
-"import { toDisplayString, createVNode, openBlock, createBlock, createCommentVNode, Fragment, renderList, createTextVNode } from \\"vue\\"
+"import { toDisplayString as _toDisplayString, createVNode as _createVNode, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, Fragment as _Fragment, renderList as _renderList, createTextVNode as _createTextVNode } from \\"vue\\"
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"div\\", {
+ return (_openBlock(), _createBlock(\\"div\\", {
id: \\"foo\\",
class: _ctx.bar.baz
}, [
- createTextVNode(toDisplayString(_ctx.world.burn()) + \\" \\", 1 /* TEXT */),
- (openBlock(), (_ctx.ok)
- ? createBlock(\\"div\\", { key: 0 }, \\"yes\\")
- : createBlock(Fragment, { key: 1 }, [\\"no\\"])),
- (openBlock(false), createBlock(Fragment, null, renderList(_ctx.list, (value, index) => {
- return (openBlock(), createBlock(\\"div\\", null, [
- createVNode(\\"span\\", null, toDisplayString(value + index), 1 /* TEXT */)
+ _createTextVNode(_toDisplayString(_ctx.world.burn()) + \\" \\", 1 /* TEXT */),
+ (_openBlock(), (_ctx.ok)
+ ? _createBlock(\\"div\\", { key: 0 }, \\"yes\\")
+ : _createBlock(_Fragment, { key: 1 }, [\\"no\\"])),
+ (_openBlock(false), _createBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
+ return (_openBlock(), _createBlock(\\"div\\", null, [
+ _createVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
]))
}), 256 /* UNKEYED_FRAGMENT */))
], 2 /* CLASS */))
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`scopeId compiler support should push scopeId for hoisted nodes 1`] = `
-"import { createVNode, createBlock, openBlock, withScopeId, pushScopeId, popScopeId } from \\"vue\\"
-const withId = withScopeId(\\"test\\")
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock, withScopeId as _withScopeId, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \\"vue\\"
+const _withId = _withScopeId(\\"test\\")
-pushScopeId(\\"test\\")
-const _hoisted_1 = createVNode(\\"div\\", null, \\"hello\\")
-const _hoisted_2 = createVNode(\\"div\\", null, \\"world\\")
-popScopeId()
+_pushScopeId(\\"test\\")
+const _hoisted_1 = _createVNode(\\"div\\", null, \\"hello\\")
+const _hoisted_2 = _createVNode(\\"div\\", null, \\"world\\")
+_popScopeId()
-export const render = withId(function render() {
+export const render = _withId(function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"div\\", null, [
+ return (_openBlock(), _createBlock(\\"div\\", null, [
_hoisted_1,
_hoisted_2
]))
`;
exports[`scopeId compiler support should wrap default slot 1`] = `
-"import { createVNode, resolveComponent, createBlock, openBlock, withScopeId } from \\"vue\\"
-const withId = withScopeId(\\"test\\")
+"import { createVNode as _createVNode, resolveComponent as _resolveComponent, createBlock as _createBlock, openBlock as _openBlock, withScopeId as _withScopeId } from \\"vue\\"
+const _withId = _withScopeId(\\"test\\")
-export const render = withId(function render() {
+export const render = _withId(function render() {
const _ctx = this
- const _component_Child = resolveComponent(\\"Child\\")
+ const _component_Child = _resolveComponent(\\"Child\\")
- return (openBlock(), createBlock(_component_Child, null, {
- default: withId(() => [
- createVNode(\\"div\\")
+ return (_openBlock(), _createBlock(_component_Child, null, {
+ default: _withId(() => [
+ _createVNode(\\"div\\")
]),
_compiled: true
}))
`;
exports[`scopeId compiler support should wrap dynamic slots 1`] = `
-"import { createVNode, resolveComponent, renderList, createSlots, createBlock, openBlock, withScopeId } from \\"vue\\"
-const withId = withScopeId(\\"test\\")
+"import { createVNode as _createVNode, resolveComponent as _resolveComponent, renderList as _renderList, createSlots as _createSlots, createBlock as _createBlock, openBlock as _openBlock, withScopeId as _withScopeId } from \\"vue\\"
+const _withId = _withScopeId(\\"test\\")
-export const render = withId(function render() {
+export const render = _withId(function render() {
const _ctx = this
- const _component_Child = resolveComponent(\\"Child\\")
+ const _component_Child = _resolveComponent(\\"Child\\")
- return (openBlock(), createBlock(_component_Child, null, createSlots({ _compiled: true }, [
+ return (_openBlock(), _createBlock(_component_Child, null, _createSlots({ _compiled: true }, [
(_ctx.ok)
? {
name: \\"foo\\",
- fn: withId(() => [
- createVNode(\\"div\\")
+ fn: _withId(() => [
+ _createVNode(\\"div\\")
])
}
: undefined,
- renderList(_ctx.list, (i) => {
+ _renderList(_ctx.list, (i) => {
return {
name: i,
- fn: withId(() => [
- createVNode(\\"div\\")
+ fn: _withId(() => [
+ _createVNode(\\"div\\")
])
}
})
`;
exports[`scopeId compiler support should wrap named slots 1`] = `
-"import { toDisplayString, createTextVNode, createVNode, resolveComponent, createBlock, openBlock, withScopeId } from \\"vue\\"
-const withId = withScopeId(\\"test\\")
+"import { toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, createVNode as _createVNode, resolveComponent as _resolveComponent, createBlock as _createBlock, openBlock as _openBlock, withScopeId as _withScopeId } from \\"vue\\"
+const _withId = _withScopeId(\\"test\\")
-export const render = withId(function render() {
+export const render = _withId(function render() {
const _ctx = this
- const _component_Child = resolveComponent(\\"Child\\")
+ const _component_Child = _resolveComponent(\\"Child\\")
- return (openBlock(), createBlock(_component_Child, null, {
- foo: withId(({ msg }) => [
- createTextVNode(toDisplayString(msg), 1 /* TEXT */)
+ return (_openBlock(), _createBlock(_component_Child, null, {
+ foo: _withId(({ msg }) => [
+ _createTextVNode(_toDisplayString(msg), 1 /* TEXT */)
]),
- bar: withId(() => [
- createVNode(\\"div\\")
+ bar: _withId(() => [
+ _createVNode(\\"div\\")
]),
_compiled: true
}))
`;
exports[`scopeId compiler support should wrap render function 1`] = `
-"import { createVNode, createBlock, openBlock, withScopeId } from \\"vue\\"
-const withId = withScopeId(\\"test\\")
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock, withScopeId as _withScopeId } from \\"vue\\"
+const _withId = _withScopeId(\\"test\\")
-export const render = withId(function render() {
+export const render = _withId(function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"div\\"))
+ return (_openBlock(), _createBlock(\\"div\\"))
})"
`;
helpers: [CREATE_VNODE, RESOLVE_DIRECTIVE]
})
const { code } = generate(root, { mode: 'module' })
+ expect(code).toMatch(
+ `import { ${helperNameMap[CREATE_VNODE]} as _${
+ helperNameMap[CREATE_VNODE]
+ }, ${helperNameMap[RESOLVE_DIRECTIVE]} as _${
+ helperNameMap[RESOLVE_DIRECTIVE]
+ } } from "vue"`
+ )
+ expect(code).toMatchSnapshot()
+ })
+
+ test('module mode preamble w/ optimizeBindings: true', () => {
+ const root = createRoot({
+ helpers: [CREATE_VNODE, RESOLVE_DIRECTIVE]
+ })
+ const { code } = generate(root, { mode: 'module', optimizeBindings: true })
expect(code).toMatch(
`import { ${helperNameMap[CREATE_VNODE]}, ${
helperNameMap[RESOLVE_DIRECTIVE]
} } from "vue"`
)
+ expect(code).toMatch(
+ `const _${helperNameMap[CREATE_VNODE]} = ${
+ helperNameMap[CREATE_VNODE]
+ }, _${helperNameMap[RESOLVE_DIRECTIVE]} = ${
+ helperNameMap[RESOLVE_DIRECTIVE]
+ }`
+ )
expect(code).toMatchSnapshot()
})
})
expect(code).not.toMatch(`const _Vue = Vue`)
expect(code).toMatch(
- `const { ${helperNameMap[CREATE_VNODE]}, ${
+ `const { ${helperNameMap[CREATE_VNODE]}: _${
+ helperNameMap[CREATE_VNODE]
+ }, ${helperNameMap[RESOLVE_DIRECTIVE]}: _${
helperNameMap[RESOLVE_DIRECTIVE]
} } = Vue`
)
expect(code).toMatch(
`
_cache[1] || (
- setBlockTracking(-1),
+ _setBlockTracking(-1),
_cache[1] = foo,
- setBlockTracking(1),
+ _setBlockTracking(1),
_cache[1]
)
`.trim()
scopeId: 'test'
})
expect(ast.helpers).toContain(WITH_SCOPE_ID)
- expect(code).toMatch(`const withId = withScopeId("test")`)
- expect(code).toMatch(`export const render = withId(function render() {`)
+ expect(code).toMatch(`const _withId = _withScopeId("test")`)
+ expect(code).toMatch(`export const render = _withId(function render() {`)
expect(code).toMatchSnapshot()
})
mode: 'module',
scopeId: 'test'
})
- expect(code).toMatch(`default: withId(() => [`)
+ expect(code).toMatch(`default: _withId(() => [`)
expect(code).toMatchSnapshot()
})
scopeId: 'test'
}
)
- expect(code).toMatch(`foo: withId(({ msg }) => [`)
- expect(code).toMatch(`bar: withId(() => [`)
+ expect(code).toMatch(`foo: _withId(({ msg }) => [`)
+ expect(code).toMatch(`bar: _withId(() => [`)
expect(code).toMatchSnapshot()
})
scopeId: 'test'
}
)
- expect(code).toMatch(/name: "foo",\s+fn: withId\(/)
- expect(code).toMatch(/name: i,\s+fn: withId\(/)
+ expect(code).toMatch(/name: "foo",\s+fn: _withId\(/)
+ expect(code).toMatch(/name: i,\s+fn: _withId\(/)
expect(code).toMatchSnapshot()
})
expect(ast.hoists.length).toBe(2)
expect(code).toMatch(
[
- `pushScopeId("test")`,
- `const _hoisted_1 = createVNode("div", null, "hello")`,
- `const _hoisted_2 = createVNode("div", null, "world")`,
- `popScopeId()`
+ `_pushScopeId("test")`,
+ `const _hoisted_1 = _createVNode("div", null, "hello")`,
+ `const _hoisted_2 = _createVNode("div", null, "world")`,
+ `_popScopeId()`
].join('\n')
)
expect(code).toMatchSnapshot()
`;
exports[`compiler: hoistStatic transform prefixIdentifiers should NOT hoist elements with cached handlers 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
export function render() {
const _ctx = this
const _cache = _ctx.$cache
- return (openBlock(), createBlock(\\"div\\", null, [
- createVNode(\\"div\\", null, [
- createVNode(\\"div\\", {
+ return (_openBlock(), _createBlock(\\"div\\", null, [
+ _createVNode(\\"div\\", null, [
+ _createVNode(\\"div\\", {
onClick: _cache[1] || (_cache[1] = $event => (_ctx.foo($event)))
})
])
`;
exports[`compiler: transform text with prefixIdentifiers: true 1`] = `
-"const { toDisplayString } = Vue
+"const { toDisplayString: _toDisplayString } = Vue
return function render() {
const _ctx = this
- return toDisplayString(_ctx.foo) + \\" bar \\" + toDisplayString(_ctx.baz + _ctx.qux)
+ return _toDisplayString(_ctx.foo) + \\" bar \\" + _toDisplayString(_ctx.baz + _ctx.qux)
}"
`;
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler: transform v-model compound expression (with prefixIdentifiers) 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"input\\", {
+ return (_openBlock(), _createBlock(\\"input\\", {
modelValue: _ctx.model[_ctx.index],
\\"onUpdate:modelValue\\": $event => (_ctx.model[_ctx.index] = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"]))
`;
exports[`compiler: transform v-model simple exprssion (with prefixIdentifiers) 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"input\\", {
+ return (_openBlock(), _createBlock(\\"input\\", {
modelValue: _ctx.model,
\\"onUpdate:modelValue\\": $event => (_ctx.model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"]))
`;
exports[`compiler: transform v-model with dynamic argument (with prefixIdentifiers) 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"input\\", {
+ return (_openBlock(), _createBlock(\\"input\\", {
[_ctx.value]: _ctx.model,
[\\"onUpdate:\\" + _ctx.value]: $event => (_ctx.model = $event)
}, null, 16 /* FULL_PROPS */))
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler: transform component slots dynamically named slots 1`] = `
-"const { toDisplayString, resolveComponent, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, {
- [_ctx.one]: ({ foo }) => [toDisplayString(foo), toDisplayString(_ctx.bar)],
- [_ctx.two]: ({ bar }) => [toDisplayString(_ctx.foo), toDisplayString(bar)],
+ return (_openBlock(), _createBlock(_component_Comp, null, {
+ [_ctx.one]: ({ foo }) => [_toDisplayString(foo), _toDisplayString(_ctx.bar)],
+ [_ctx.two]: ({ bar }) => [_toDisplayString(_ctx.foo), _toDisplayString(bar)],
_compiled: true
}, 512 /* DYNAMIC_SLOTS */))
}"
`;
exports[`compiler: transform component slots implicit default slot 1`] = `
-"const { createVNode, resolveComponent, createBlock, openBlock } = Vue
+"const { createVNode: _createVNode, resolveComponent: _resolveComponent, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, {
+ return (_openBlock(), _createBlock(_component_Comp, null, {
default: () => [
- createVNode(\\"div\\")
+ _createVNode(\\"div\\")
],
_compiled: true
}))
`;
exports[`compiler: transform component slots named slot with v-for w/ prefixIdentifiers: true 1`] = `
-"const { toDisplayString, resolveComponent, renderList, createSlots, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, renderList: _renderList, createSlots: _createSlots, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, createSlots({ _compiled: true }, [
- renderList(_ctx.list, (name) => {
+ return (_openBlock(), _createBlock(_component_Comp, null, _createSlots({ _compiled: true }, [
+ _renderList(_ctx.list, (name) => {
return {
name: name,
- fn: () => [toDisplayString(name)]
+ fn: () => [_toDisplayString(name)]
}
})
]), 512 /* DYNAMIC_SLOTS */))
`;
exports[`compiler: transform component slots named slot with v-if + prefixIdentifiers: true 1`] = `
-"const { toDisplayString, resolveComponent, createSlots, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, createSlots: _createSlots, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, createSlots({ _compiled: true }, [
+ return (_openBlock(), _createBlock(_component_Comp, null, _createSlots({ _compiled: true }, [
(_ctx.ok)
? {
name: \\"one\\",
- fn: (props) => [toDisplayString(props)]
+ fn: (props) => [_toDisplayString(props)]
}
: undefined
]), 512 /* DYNAMIC_SLOTS */))
`;
exports[`compiler: transform component slots named slots 1`] = `
-"const { toDisplayString, resolveComponent, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, {
- one: ({ foo }) => [toDisplayString(foo), toDisplayString(_ctx.bar)],
- two: ({ bar }) => [toDisplayString(_ctx.foo), toDisplayString(bar)],
+ return (_openBlock(), _createBlock(_component_Comp, null, {
+ one: ({ foo }) => [_toDisplayString(foo), _toDisplayString(_ctx.bar)],
+ two: ({ bar }) => [_toDisplayString(_ctx.foo), _toDisplayString(bar)],
_compiled: true
}))
}"
`;
exports[`compiler: transform component slots nested slots scoping 1`] = `
-"const { toDisplayString, resolveComponent, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Inner = resolveComponent(\\"Inner\\")
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Inner = _resolveComponent(\\"Inner\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, {
+ return (_openBlock(), _createBlock(_component_Comp, null, {
default: ({ foo }) => [
- createVNode(_component_Inner, null, {
- default: ({ bar }) => [toDisplayString(foo), toDisplayString(bar), toDisplayString(_ctx.baz)],
+ _createVNode(_component_Inner, null, {
+ default: ({ bar }) => [_toDisplayString(foo), _toDisplayString(bar), _toDisplayString(_ctx.baz)],
_compiled: true
}, 512 /* DYNAMIC_SLOTS */),
\\" \\",
- toDisplayString(foo),
- toDisplayString(_ctx.bar),
- toDisplayString(_ctx.baz)
+ _toDisplayString(foo),
+ _toDisplayString(_ctx.bar),
+ _toDisplayString(_ctx.baz)
],
_compiled: true
}))
`;
exports[`compiler: transform component slots on-component default slot 1`] = `
-"const { toDisplayString, resolveComponent, createVNode, createBlock, openBlock } = Vue
+"const { toDisplayString: _toDisplayString, resolveComponent: _resolveComponent, createVNode: _createVNode, createBlock: _createBlock, openBlock: _openBlock } = Vue
return function render() {
const _ctx = this
- const _component_Comp = resolveComponent(\\"Comp\\")
+ const _component_Comp = _resolveComponent(\\"Comp\\")
- return (openBlock(), createBlock(_component_Comp, null, {
- default: ({ foo }) => [toDisplayString(foo), toDisplayString(_ctx.bar)],
+ return (_openBlock(), _createBlock(_component_Comp, null, {
+ default: ({ foo }) => [_toDisplayString(foo), _toDisplayString(_ctx.bar)],
_compiled: true
}))
}"
// enter render function
if (genScopeId && !ssr) {
- push(`const render = withId(`)
+ push(`const render = _withId(`)
}
if (!ssr) {
push(`function render() {`)
}
if (genScopeId) {
- push(`const withId = ${helper(WITH_SCOPE_ID)}("${scopeId}")`)
+ push(`const _withId = ${helper(WITH_SCOPE_ID)}("${scopeId}")`)
newline()
}
!__BROWSER__ && isSlot && scopeId != null && mode !== 'function'
if (genScopeId) {
- push(`withId(`)
+ push(`_withId(`)
}
push(`(`, node)
if (isArray(params)) {
exports[`source map 1`] = `
Object {
- "mappings": ";;;;UAAA,aACE,YAA8B;IAAzB,YAAmB,2BAAbA,WAAM",
+ "mappings": ";;;;UAAA,cACE,aAA8B;IAAzB,aAAmB,4BAAbA,WAAM",
"names": Array [
"render",
],
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler sfc: transform asset url support uri fragment 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
import _imports_0 from '@svg/file.svg'
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"use\\", { href: _hoisted_1 }))
+ return (_openBlock(), _createBlock(\\"use\\", { href: _hoisted_1 }))
}"
`;
exports[`compiler sfc: transform asset url support uri is empty 1`] = `
-"import { createVNode, createBlock, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, openBlock as _openBlock } from \\"vue\\"
export function render() {
const _ctx = this
- return (openBlock(), createBlock(\\"use\\", { href: '' }))
+ return (_openBlock(), _createBlock(\\"use\\", { href: '' }))
}"
`;
exports[`compiler sfc: transform asset url transform assetUrls 1`] = `
-"import { createVNode, createBlock, Fragment, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, Fragment as _Fragment, openBlock as _openBlock } from \\"vue\\"
import _imports_0 from './logo.png'
import _imports_1 from 'fixtures/logo.png'
export function render() {
const _ctx = this
- return (openBlock(), createBlock(Fragment, null, [
- createVNode(\\"img\\", { src: _imports_0 }),
- createVNode(\\"img\\", { src: _imports_1 }),
- createVNode(\\"img\\", { src: _imports_1 }),
- createVNode(\\"img\\", { src: \\"http://example.com/fixtures/logo.png\\" }),
- createVNode(\\"img\\", { src: \\"/fixtures/logo.png\\" })
+ return (_openBlock(), _createBlock(_Fragment, null, [
+ _createVNode(\\"img\\", { src: _imports_0 }),
+ _createVNode(\\"img\\", { src: _imports_1 }),
+ _createVNode(\\"img\\", { src: _imports_1 }),
+ _createVNode(\\"img\\", { src: \\"http://example.com/fixtures/logo.png\\" }),
+ _createVNode(\\"img\\", { src: \\"/fixtures/logo.png\\" })
], 64 /* STABLE_FRAGMENT */))
}"
`;
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler sfc: transform srcset transform srcset 1`] = `
-"import { createVNode, createBlock, Fragment, openBlock } from \\"vue\\"
+"import { createVNode as _createVNode, createBlock as _createBlock, Fragment as _Fragment, openBlock as _openBlock } from \\"vue\\"
import _imports_0 from './logo.png'
export function render() {
const _ctx = this
- return (openBlock(), createBlock(Fragment, null, [
- createVNode(\\"img\\", {
+ return (_openBlock(), _createBlock(_Fragment, null, [
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_1
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_2
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_3
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_4
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_5
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_6
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_7
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: \\"/logo.png, /logo.png 2x\\"
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"https://example.com/logo.png\\",
srcset: \\"https://example.com/logo.png, https://example.com/logo.png 2x\\"
}),
- createVNode(\\"img\\", {
+ _createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: _hoisted_8
})
describe('ssr: components', () => {
test('basic', () => {
expect(compile(`<foo id="a" :prop="b" />`).code).toMatchInlineSnapshot(`
- "const { resolveComponent } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, {
id: \\"a\\",
test('dynamic component', () => {
expect(compile(`<component is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(`
- "const { resolveComponent } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, { prop: \\"b\\" }, null, _parent))
}"
expect(compile(`<compoonent :is="foo" prop="b" />`).code)
.toMatchInlineSnapshot(`
- "const { resolveComponent } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_compoonent = resolveComponent(\\"compoonent\\")
+ const _component_compoonent = _resolveComponent(\\"compoonent\\")
_push(_ssrRenderComponent(_component_compoonent, {
is: _ctx.foo,
describe('slots', () => {
test('implicit default slot', () => {
expect(compile(`<foo>hello<div/></foo>`).code).toMatchInlineSnapshot(`
- "const { resolveComponent, createVNode, createTextVNode } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createVNode: _createVNode, createTextVNode: _createTextVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`hello<div\${_scopeId}></div>\`)
} else {
return [
- createTextVNode(\\"hello\\"),
- createVNode(\\"div\\")
+ _createTextVNode(\\"hello\\"),
+ _createVNode(\\"div\\")
]
}
},
test('explicit default slot', () => {
expect(compile(`<foo v-slot="{ msg }">{{ msg + outer }}</foo>`).code)
.toMatchInlineSnapshot(`
- "const { resolveComponent, createTextVNode } = require(\\"vue\\")
- const { _ssrRenderComponent, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createTextVNode: _createTextVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: ({ msg }, _push, _parent, _scopeId) => {
_push(\`\${_ssrInterpolate(msg + _ctx.outer)}\`)
} else {
return [
- createTextVNode(toDisplayString(msg + _ctx.outer))
+ _createTextVNode(_toDisplayString(msg + _ctx.outer))
]
}
},
<template v-slot:named>bar</template>
</foo>`).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createTextVNode } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createTextVNode: _createTextVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`foo\`)
} else {
return [
- createTextVNode(\\"foo\\")
+ _createTextVNode(\\"foo\\")
]
}
},
_push(\`bar\`)
} else {
return [
- createTextVNode(\\"bar\\")
+ _createTextVNode(\\"bar\\")
]
}
},
<template v-slot:named v-if="ok">foo</template>
</foo>`).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createTextVNode, createSlots } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createTextVNode: _createTextVNode, createSlots: _createSlots } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
- _push(_ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
+ _push(_ssrRenderComponent(_component_foo, null, _createSlots({ _compiled: true }, [
(_ctx.ok)
? {
name: \\"named\\",
_push(\`foo\`)
} else {
return [
- createTextVNode(\\"foo\\")
+ _createTextVNode(\\"foo\\")
]
}
}
<template v-for="key in names" v-slot:[key]="{ msg }">{{ msg + key + bar }}</template>
</foo>`).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createTextVNode, renderList, createSlots } = require(\\"vue\\")
- const { _ssrRenderComponent, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createTextVNode: _createTextVNode, renderList: _renderList, createSlots: _createSlots } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
- _push(_ssrRenderComponent(_component_foo, null, createSlots({ _compiled: true }, [
- renderList(_ctx.names, (key) => {
+ _push(_ssrRenderComponent(_component_foo, null, _createSlots({ _compiled: true }, [
+ _renderList(_ctx.names, (key) => {
return {
name: key,
fn: ({ msg }, _push, _parent, _scopeId) => {
_push(\`\${_ssrInterpolate(msg + key + _ctx.bar)}\`)
} else {
return [
- createTextVNode(toDisplayString(msg + _ctx.key + _ctx.bar))
+ _createTextVNode(_toDisplayString(msg + _ctx.key + _ctx.bar))
]
}
}
</template>
</foo>`).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, renderList, openBlock, createBlock, Fragment, createVNode, createCommentVNode } = require(\\"vue\\")
- const { _ssrRenderComponent, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, renderList: _renderList, openBlock: _openBlock, createBlock: _createBlock, Fragment: _Fragment, createVNode: _createVNode, createCommentVNode: _createCommentVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
foo: ({ list }, _push, _parent, _scopeId) => {
}
} else {
return [
- (openBlock(), (_ctx.ok)
- ? createBlock(\\"div\\", { key: 0 }, [
- (openBlock(false), createBlock(Fragment, null, renderList(list, (i) => {
- return (openBlock(), createBlock(\\"span\\"))
+ (_openBlock(), (_ctx.ok)
+ ? _createBlock(\\"div\\", { key: 0 }, [
+ (_openBlock(false), _createBlock(_Fragment, null, _renderList(list, (i) => {
+ return (_openBlock(), _createBlock(\\"span\\"))
}), 256 /* UNKEYED_FRAGMENT */))
])
- : createCommentVNode(\\"v-if\\", true))
+ : _createCommentVNode(\\"v-if\\", true))
]
}
},
}
} else {
return [
- (openBlock(), ok
- ? createBlock(\\"div\\", { key: 0 }, [
- (openBlock(false), createBlock(Fragment, null, renderList(_ctx.list, (i) => {
- return (openBlock(), createBlock(\\"span\\"))
+ (_openBlock(), ok
+ ? _createBlock(\\"div\\", { key: 0 }, [
+ (_openBlock(false), _createBlock(_Fragment, null, _renderList(_ctx.list, (i) => {
+ return (_openBlock(), _createBlock(\\"span\\"))
}), 256 /* UNKEYED_FRAGMENT */))
])
- : createCommentVNode(\\"v-if\\", true))
+ : _createCommentVNode(\\"v-if\\", true))
]
}
},
// no fragment
expect(compile(`<keep-alive><foo/></keep-alive>`).code)
.toMatchInlineSnapshot(`
- "const { resolveComponent } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, null, _parent))
}"
test('<textarea> with dynamic v-bind', () => {
expect(compile(`<textarea v-bind="obj">fallback</textarea>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderAttrs, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttrs: _ssrRenderAttrs, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
expect(
getCompiledString(`<div class="foo" v-bind="obj"></div>`)
).toMatchInlineSnapshot(
- `"\`<div\${_ssrRenderAttrs(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\${_ssrRenderAttrs(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\${_ssrRenderAttrs(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\${_ssrRenderAttrs(mergeProps({
+ "\`<div\${_ssrRenderAttrs(_mergeProps({
class: [\\"a\\", _ctx.b]
}, _ctx.obj))}></div>\`"
`)
`<div style="color:red;" :style="b" v-bind="obj"></div>`
)
).toMatchInlineSnapshot(`
- "\`<div\${_ssrRenderAttrs(mergeProps({
+ "\`<div\${_ssrRenderAttrs(_mergeProps({
style: [_hoisted_1, _ctx.b]
}, _ctx.obj))}></div>\`"
`)
scopeId
}).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createTextVNode } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createTextVNode: _createTextVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`foo\`)
} else {
return [
- createTextVNode(\\"foo\\")
+ _createTextVNode(\\"foo\\")
]
}
},
scopeId
}).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createVNode } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createVNode: _createVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`<span data-v-xxxxxxx\${_scopeId}>hello</span>\`)
} else {
return [
- createVNode(\\"span\\", null, \\"hello\\")
+ _createVNode(\\"span\\", null, \\"hello\\")
]
}
},
scopeId
}).code
).toMatchInlineSnapshot(`
- "const { resolveComponent, createVNode } = require(\\"vue\\")
- const { _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
+ "const { resolveComponent: _resolveComponent, createVNode: _createVNode } = require(\\"vue\\")
+ const { ssrRenderComponent: _ssrRenderComponent } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
- const _component_foo = resolveComponent(\\"foo\\")
- const _component_bar = resolveComponent(\\"bar\\")
+ const _component_foo = _resolveComponent(\\"foo\\")
+ const _component_bar = _resolveComponent(\\"bar\\")
_push(_ssrRenderComponent(_component_foo, null, {
default: (_, _push, _parent, _scopeId) => {
_push(\`<span data-v-xxxxxxx\${_scopeId}></span>\`)
} else {
return [
- createVNode(\\"span\\")
+ _createVNode(\\"span\\")
]
}
},
}, _parent))
} else {
return [
- createVNode(\\"span\\", null, \\"hello\\"),
- createVNode(_component_bar, null, {
+ _createVNode(\\"span\\", null, \\"hello\\"),
+ _createVNode(_component_bar, null, {
default: () => [
- createVNode(\\"span\\")
+ _createVNode(\\"span\\")
],
_compiled: true
})
describe('ssr: <slot>', () => {
test('basic', () => {
expect(compile(`<slot/>`).code).toMatchInlineSnapshot(`
- "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderSlot: _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, null, _push, _parent)
test('with name', () => {
expect(compile(`<slot name="foo" />`).code).toMatchInlineSnapshot(`
- "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderSlot: _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_ssrRenderSlot(_ctx.$slots, \\"foo\\", {}, null, _push, _parent)
test('with dynamic name', () => {
expect(compile(`<slot :name="bar.baz" />`).code).toMatchInlineSnapshot(`
- "const { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderSlot: _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _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 { _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderSlot: _ssrRenderSlot } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_ssrRenderSlot(_ctx.$slots, \\"foo\\", {
test('with fallback', () => {
expect(compile(`<slot>some {{ fallback }} content</slot>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderSlot, _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderSlot: _ssrRenderSlot, ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_ssrRenderSlot(_ctx.$slots, \\"default\\", {}, () => {
test('interpolation', () => {
expect(compile(`foo {{ bar }} baz`).code).toMatchInlineSnapshot(`
- "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`foo \${_ssrInterpolate(_ctx.bar)} baz\`)
compile(`<div><span>{{ foo }} bar</span><span>baz {{ qux }}</span></div>`)
.code
).toMatchInlineSnapshot(`
- "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<div><span>\${
describe('ssr: v-for', () => {
test('basic', () => {
expect(compile(`<div v-for="i in list" />`).code).toMatchInlineSnapshot(`
- "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
test('nested content', () => {
expect(compile(`<div v-for="i in list">foo<span>bar</span></div>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
`</div>`
).code
).toMatchInlineSnapshot(`
- "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
test('template v-for (text)', () => {
expect(compile(`<template v-for="i in list">{{ i }}</template>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
compile(`<template v-for="i in list"><span>{{ i }}</span></template>`)
.code
).toMatchInlineSnapshot(`
- "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
`<template v-for="i in list"><span>{{ i }}</span><span>{{ i + 1 }}</span></template>`
).code
).toMatchInlineSnapshot(`
- "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
expect(code).not.toMatch(`_ctx.foo`)
expect(code).not.toMatch(`_ctx.index`)
expect(code).toMatchInlineSnapshot(`
- "const { _ssrInterpolate, _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate, ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<!---->\`)
expect(
compile(`<template v-if="foo"><div v-for="i in list"/></template>`).code
).toMatchInlineSnapshot(`
- "const { _ssrRenderList } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderList: _ssrRenderList } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
if (_ctx.foo) {
describe('ssr: v-model', () => {
test('<input> (text types)', () => {
expect(compile(`<input v-model="bar">`).code).toMatchInlineSnapshot(`
- "const { _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttr: _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${_ssrRenderAttr(\\"value\\", _ctx.bar)}>\`)
expect(compile(`<input type="email" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttr: _ssrRenderAttr } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_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 { _ssrLooseEqual } = require(\\"@vue/server-renderer\\")
+ "const { ssrLooseEqual: _ssrLooseEqual } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_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 { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
+ "const { ssrLooseContain: _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\"\${((Array.isArray(_ctx.bar))
expect(compile(`<input type="checkbox" value="foo" v-model="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _ssrLooseContain } = require(\\"@vue/server-renderer\\")
+ "const { ssrLooseContain: _ssrLooseContain } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input type=\\"checkbox\\" value=\\"foo\\"\${((Array.isArray(_ctx.bar))
test('<textarea>', () => {
expect(compile(`<textarea v-model="foo">bar</textarea>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrInterpolate } = require(\\"@vue/server-renderer\\")
+ "const { ssrInterpolate: _ssrInterpolate } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<textarea>\${_ssrInterpolate(_ctx.foo)}</textarea>\`)
test('<input :type="x">', () => {
expect(compile(`<input :type="x" v-model="foo">`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttr: _ssrRenderAttr, ssrRenderDynamicModel: _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
expect(compile(`<input :type="x" v-model="foo" value="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttr: _ssrRenderAttr, ssrRenderDynamicModel: _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
expect(compile(`<input :type="x" v-model="foo" :value="bar">`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderAttr, _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderAttr: _ssrRenderAttr, ssrRenderDynamicModel: _ssrRenderDynamicModel } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<input\${
test('<input v-bind="obj">', () => {
expect(compile(`<input v-bind="obj" v-model="foo">`).code)
.toMatchInlineSnapshot(`
- "const { mergeProps } = require(\\"vue\\")
- const { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
+ "const { mergeProps: _mergeProps } = require(\\"vue\\")
+ const { ssrRenderAttrs: _ssrRenderAttrs, ssrGetDynamicModelProps: _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
- _push(\`<input\${_ssrRenderAttrs(_temp0 = _ctx.obj, mergeProps(_temp0, _ssrGetDynamicModelProps(_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 { _ssrRenderAttrs, _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
+ "const { mergeProps: _mergeProps } = require(\\"vue\\")
+ const { ssrRenderAttrs: _ssrRenderAttrs, ssrGetDynamicModelProps: _ssrGetDynamicModelProps } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
let _temp0
- _push(\`<input\${_ssrRenderAttrs(_temp0 = mergeProps({ id: \\"x\\" }, _ctx.obj, { class: \\"y\\" }), mergeProps(_temp0, _ssrGetDynamicModelProps(_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 { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderStyle: _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_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 { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderStyle: _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
test('with dynamic style', () => {
expect(compile(`<div :style="{ color: 'red' }" v-show="foo"/>`).code)
.toMatchInlineSnapshot(`
- "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderStyle: _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
return function ssrRender(_ctx, _push, _parent) {
_push(\`<div\${_ssrRenderStyle([
compile(`<div style="color:red" :style="{ fontSize: 14 }" v-show="foo"/>`)
.code
).toMatchInlineSnapshot(`
- "const { _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
+ "const { ssrRenderStyle: _ssrRenderStyle } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
`<div v-bind="baz" style="color:red" :style="{ fontSize: 14 }" v-show="foo"/>`
).code
).toMatchInlineSnapshot(`
- "const { mergeProps } = require(\\"vue\\")
- const { _ssrRenderAttrs } = require(\\"@vue/server-renderer\\")
+ "const { mergeProps: _mergeProps } = require(\\"vue\\")
+ const { ssrRenderAttrs: _ssrRenderAttrs } = require(\\"@vue/server-renderer\\")
const _hoisted_1 = {\\"color\\":\\"red\\"}
return function ssrRender(_ctx, _push, _parent) {
- _push(\`<div\${_ssrRenderAttrs(mergeProps(_ctx.baz, {
+ _push(\`<div\${_ssrRenderAttrs(_mergeProps(_ctx.baz, {
style: [
_hoisted_1,
{ fontSize: 14 },