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

refactor(compiler): use symbols for runtime helpers

Browse Source
This commit is contained in:
Evan You
2019-10-05 17:18:25 -04:00
parent 7c4eea6048
commit bfecf2cdce
26 changed files with 420 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap
View File

@@ -17,15 +17,15 @@ exports[`compiler: codegen Element (callExpression + objectExpression + arrayExp
"
return function render() {
with (this) {
return createVNode(\\"div\\", {
return _createVNode(\\"div\\", {
id: \\"foo\\",
[prop]: bar,
[foo + bar]: bar
}, [
createVNode(\\"p\\", { \\"some-key\\": \\"foo\\" })
_createVNode(\\"p\\", { \\"some-key\\": \\"foo\\" })
], [
foo,
createVNode(\\"p\\")
_createVNode(\\"p\\")
])
}
}"
@@ -40,6 +40,19 @@ return function render() {
}"
`;
exports[`compiler: codegen assets 1`] = `
"
return function render() {
with (this) {
const _component_Foo = _resolveComponent(\\"Foo\\")
const _component_barbaz = _resolveComponent(\\"bar-baz\\")
const _directive_my_dir = _resolveDirective(\\"my_dir\\")
return null
}
}"
`;
exports[`compiler: codegen comment 1`] = `
"
return function render() {
@@ -72,7 +85,7 @@ exports[`compiler: codegen function mode preamble 1`] = `
return function render() {
with (this) {
const { helperOne: _helperOne, helperTwo: _helperTwo } = _Vue
const { createVNode: _createVNode, resolveDirective: _resolveDirective } = _Vue
return null
}
@@ -80,7 +93,7 @@ return function render() {
`;
exports[`compiler: codegen function mode preamble w/ prefixIdentifiers: true 1`] = `
"const { helperOne, helperTwo } = Vue
"const { createVNode, resolveDirective } = Vue
return function render() {
const _ctx = this
@@ -119,7 +132,7 @@ return function render() {
`;
exports[`compiler: codegen module mode preamble 1`] = `
"import { helperOne, helperTwo } from \\"vue\\"
"import { createVNode, resolveDirective } from \\"vue\\"
export default function render() {
const _ctx = this
@@ -135,18 +148,6 @@ return function render() {
}"
`;
exports[`compiler: codegen statements 1`] = `
"
return function render() {
with (this) {
const a = 1
const b = 2
return null
}
}"
`;
exports[`compiler: codegen static text 1`] = `
"
return function render() {

4
packages/compiler-core/__tests__/__snapshots__/compile.spec.ts.snap
View File

@@ -56,13 +56,13 @@ export default function render() {
id: \\"foo\\",
class: _ctx.bar.baz
}, [
_toString(_ctx.world.burn()),
toString(_ctx.world.burn()),
(openBlock(), (_ctx.ok)
? createBlock(\\"div\\", { key: 0 }, \\"yes\\")
: createBlock(Fragment, { key: 1 }, [\\"no\\"])),
(openBlock(), createBlock(Fragment, null, renderList(_ctx.list, (value, index) => {
return (openBlock(), createBlock(\\"div\\", null, [
createVNode(\\"span\\", null, _toString(value + index), 1 /* TEXT */)
createVNode(\\"span\\", null, toString(value + index), 1 /* TEXT */)
]))
}), 128 /* UNKEYED_FRAGMENT */))
], 2 /* CLASS */))

74
packages/compiler-core/__tests__/codegen.spec.ts
View File

@@ -13,15 +13,23 @@ import {
createCallExpression,
createConditionalExpression
} from '../src'
import { CREATE_VNODE, COMMENT, TO_STRING } from '../src/runtimeConstants'
import {
CREATE_VNODE,
COMMENT,
TO_STRING,
RESOLVE_DIRECTIVE,
helperNameMap,
RESOLVE_COMPONENT
} from '../src/runtimeHelpers'
import { createElementWithCodegen } from './testUtils'
function createRoot(options: Partial<RootNode> = {}): RootNode {
return {
type: NodeTypes.ROOT,
children: [],
imports: [],
statements: [],
helpers: [],
components: [],
directives: [],
hoists: [],
codegenNode: undefined,
loc: locStub,
@@ -32,45 +40,69 @@ function createRoot(options: Partial<RootNode> = {}): RootNode {
describe('compiler: codegen', () => {
test('module mode preamble', () => {
const root = createRoot({
imports: [`helperOne`, `helperTwo`]
helpers: [CREATE_VNODE, RESOLVE_DIRECTIVE]
})
const { code } = generate(root, { mode: 'module' })
expect(code).toMatch(`import { helperOne, helperTwo } from "vue"`)
expect(code).toMatch(
`import { ${helperNameMap[CREATE_VNODE]}, ${
helperNameMap[RESOLVE_DIRECTIVE]
} } from "vue"`
)
expect(code).toMatchSnapshot()
})
test('function mode preamble', () => {
const root = createRoot({
imports: [`helperOne`, `helperTwo`]
helpers: [CREATE_VNODE, RESOLVE_DIRECTIVE]
})
const { code } = generate(root, { mode: 'function' })
expect(code).toMatch(`const _Vue = Vue`)
expect(code).toMatch(
`const { helperOne: _helperOne, helperTwo: _helperTwo } = _Vue`
`const { ${helperNameMap[CREATE_VNODE]}: _${
helperNameMap[CREATE_VNODE]
}, ${helperNameMap[RESOLVE_DIRECTIVE]}: _${
helperNameMap[RESOLVE_DIRECTIVE]
} } = _Vue`
)
expect(code).toMatchSnapshot()
})
test('function mode preamble w/ prefixIdentifiers: true', () => {
const root = createRoot({
imports: [`helperOne`, `helperTwo`]
helpers: [CREATE_VNODE, RESOLVE_DIRECTIVE]
})
const { code } = generate(root, {
mode: 'function',
prefixIdentifiers: true
})
expect(code).not.toMatch(`const _Vue = Vue`)
expect(code).toMatch(`const { helperOne, helperTwo } = Vue`)
expect(code).toMatch(
`const { ${helperNameMap[CREATE_VNODE]}, ${
helperNameMap[RESOLVE_DIRECTIVE]
} } = Vue`
)
expect(code).toMatchSnapshot()
})
test('statements', () => {
test('assets', () => {
const root = createRoot({
statements: [`const a = 1`, `const b = 2`]
components: [`Foo`, `bar-baz`],
directives: [`my_dir`]
})
const { code } = generate(root, { mode: 'function' })
expect(code).toMatch(`const a = 1\n`)
expect(code).toMatch(`const b = 2\n`)
expect(code).toMatch(
`const _component_Foo = _${helperNameMap[RESOLVE_COMPONENT]}("Foo")\n`
)
expect(code).toMatch(
`const _component_barbaz = _${
helperNameMap[RESOLVE_COMPONENT]
}("bar-baz")\n`
)
expect(code).toMatch(
`const _directive_my_dir = _${
helperNameMap[RESOLVE_DIRECTIVE]
}("my_dir")\n`
)
expect(code).toMatchSnapshot()
})
@@ -122,7 +154,7 @@ describe('compiler: codegen', () => {
codegenNode: createInterpolation(`hello`, locStub)
})
)
expect(code).toMatch(`return _${TO_STRING}(hello)`)
expect(code).toMatch(`return _${helperNameMap[TO_STRING]}(hello)`)
expect(code).toMatchSnapshot()
})
@@ -136,7 +168,11 @@ describe('compiler: codegen', () => {
}
})
)
expect(code).toMatch(`return _${CREATE_VNODE}(_${COMMENT}, 0, "foo")`)
expect(code).toMatch(
`return _${helperNameMap[CREATE_VNODE]}(_${
helperNameMap[COMMENT]
}, 0, "foo")`
)
expect(code).toMatchSnapshot()
})
@@ -155,7 +191,7 @@ describe('compiler: codegen', () => {
])
})
)
expect(code).toMatch(`return _ctx.foo + _${TO_STRING}(bar)`)
expect(code).toMatch(`return _ctx.foo + _${helperNameMap[TO_STRING]}(bar)`)
expect(code).toMatchSnapshot()
})
@@ -264,15 +300,15 @@ describe('compiler: codegen', () => {
})
)
expect(code).toMatch(`
return ${CREATE_VNODE}("div", {
return _${helperNameMap[CREATE_VNODE]}("div", {
id: "foo",
[prop]: bar,
[foo + bar]: bar
}, [
${CREATE_VNODE}("p", { "some-key": "foo" })
_${helperNameMap[CREATE_VNODE]}("p", { "some-key": "foo" })
], [
foo,
${CREATE_VNODE}("p")
_${helperNameMap[CREATE_VNODE]}("p")
])`)
expect(code).toMatchSnapshot()
})

2
packages/compiler-core/__tests__/testUtils.ts
View File

@@ -6,7 +6,7 @@ import {
Namespaces,
ElementTypes
} from '../src'
import { CREATE_VNODE } from '../src/runtimeConstants'
import { CREATE_VNODE } from '../src/runtimeHelpers'
import { isString } from '@vue/shared'
const leadingBracketRE = /^\[/

16
packages/compiler-core/__tests__/transform.spec.ts
View File

@@ -15,7 +15,7 @@ import {
CREATE_BLOCK,
FRAGMENT,
RENDER_SLOT
} from '../src/runtimeConstants'
} from '../src/runtimeHelpers'
import { transformIf } from '../src/transforms/vIf'
import { transformFor } from '../src/transforms/vFor'
import { transformElement } from '../src/transforms/transformElement'
@@ -225,14 +225,14 @@ describe('compiler: transform', () => {
test('should inject toString helper for interpolations', () => {
const ast = parse(`{{ foo }}`)
transform(ast, {})
expect(ast.imports).toContain(TO_STRING)
expect(ast.helpers).toContain(TO_STRING)
})
test('should inject createVNode and Comment for comments', () => {
const ast = parse(`<!--foo-->`)
transform(ast, {})
expect(ast.imports).toContain(CREATE_VNODE)
expect(ast.imports).toContain(COMMENT)
expect(ast.helpers).toContain(CREATE_VNODE)
expect(ast.helpers).toContain(COMMENT)
})
describe('root codegenNode', () => {
@@ -256,11 +256,11 @@ describe('compiler: transform', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`
callee: OPEN_BLOCK
},
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`,
callee: CREATE_BLOCK,
arguments: args
}
]
@@ -277,7 +277,7 @@ describe('compiler: transform', () => {
expect(ast.codegenNode).toMatchObject({
codegenNode: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`
callee: RENDER_SLOT
}
})
})
@@ -326,7 +326,7 @@ describe('compiler: transform', () => {
const ast = transformWithCodegen(`<div/><div/>`)
expect(ast.codegenNode).toMatchObject(
createBlockMatcher([
`_${FRAGMENT}`,
FRAGMENT,
`null`,
[
{ type: NodeTypes.ELEMENT, tag: `div` },

76
packages/compiler-core/__tests__/transforms/transformElement.spec.ts
View File

@@ -12,7 +12,7 @@ import {
RESOLVE_DIRECTIVE,
APPLY_DIRECTIVES,
TO_HANDLERS
} from '../../src/runtimeConstants'
} from '../../src/runtimeHelpers'
import {
CallExpression,
NodeTypes,
@@ -52,13 +52,13 @@ function parseWithElementTransform(
describe('compiler: element transform', () => {
test('import + resolve component', () => {
const { root } = parseWithElementTransform(`<Foo/>`)
expect(root.imports).toContain(RESOLVE_COMPONENT)
expect(root.statements[0]).toMatch(`${RESOLVE_COMPONENT}("Foo")`)
expect(root.helpers).toContain(RESOLVE_COMPONENT)
expect(root.components).toContain(`Foo`)
})
test('static props', () => {
const { node } = parseWithElementTransform(`<div id="foo" class="bar" />`)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments).toMatchObject([
`"div"`,
createObjectMatcher({
@@ -70,7 +70,7 @@ describe('compiler: element transform', () => {
test('props + children', () => {
const { node } = parseWithElementTransform(`<div id="foo"><span/></div>`)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments).toMatchObject([
`"div"`,
createObjectMatcher({
@@ -81,7 +81,7 @@ describe('compiler: element transform', () => {
type: NodeTypes.ELEMENT,
tag: 'span',
codegenNode: {
callee: `_${CREATE_VNODE}`,
callee: CREATE_VNODE,
arguments: [`"span"`]
}
}
@@ -91,7 +91,7 @@ describe('compiler: element transform', () => {
test('0 placeholder for children with no props', () => {
const { node } = parseWithElementTransform(`<div><span/></div>`)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments).toMatchObject([
`"div"`,
`null`,
@@ -100,7 +100,7 @@ describe('compiler: element transform', () => {
type: NodeTypes.ELEMENT,
tag: 'span',
codegenNode: {
callee: `_${CREATE_VNODE}`,
callee: CREATE_VNODE,
arguments: [`"span"`]
}
}
@@ -111,8 +111,8 @@ describe('compiler: element transform', () => {
test('v-bind="obj"', () => {
const { root, node } = parseWithElementTransform(`<div v-bind="obj" />`)
// single v-bind doesn't need mergeProps
expect(root.imports).not.toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).not.toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
// should directly use `obj` in props position
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.SIMPLE_EXPRESSION,
@@ -124,11 +124,11 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div id="foo" v-bind="obj" />`
)
expect(root.imports).toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({
id: 'foo'
@@ -145,11 +145,11 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div v-bind="obj" id="foo" />`
)
expect(root.imports).toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
{
type: NodeTypes.SIMPLE_EXPRESSION,
@@ -166,11 +166,11 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div id="foo" v-bind="obj" class="bar" />`
)
expect(root.imports).toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({
id: 'foo'
@@ -190,18 +190,18 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div id="foo" v-on="obj" class="bar" />`
)
expect(root.imports).toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({
id: 'foo'
}),
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${TO_HANDLERS}`,
callee: TO_HANDLERS,
arguments: [
{
type: NodeTypes.SIMPLE_EXPRESSION,
@@ -220,18 +220,18 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div id="foo" v-on="handlers" v-bind="obj" />`
)
expect(root.imports).toContain(MERGE_PROPS)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(root.helpers).toContain(MERGE_PROPS)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({
id: 'foo'
}),
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${TO_HANDLERS}`,
callee: TO_HANDLERS,
arguments: [
{
type: NodeTypes.SIMPLE_EXPRESSION,
@@ -249,7 +249,7 @@ describe('compiler: element transform', () => {
test('should handle plain <template> as normal element', () => {
const { node } = parseWithElementTransform(`<template id="foo" />`)
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments).toMatchObject([
`"template"`,
createObjectMatcher({
@@ -281,7 +281,7 @@ describe('compiler: element transform', () => {
}
}
})
expect(node.callee).toBe(`_${CREATE_VNODE}`)
expect(node.callee).toBe(CREATE_VNODE)
expect(node.arguments[1]).toMatchObject({
type: NodeTypes.JS_OBJECT_EXPRESSION,
properties: [
@@ -312,14 +312,14 @@ describe('compiler: element transform', () => {
}
}
)
expect(root.imports).toContain(RESOLVE_DIRECTIVE)
expect(root.statements[0]).toMatch(`${RESOLVE_DIRECTIVE}("foo")`)
expect(root.helpers).toContain(RESOLVE_DIRECTIVE)
expect(root.directives).toContain(`foo`)
expect(node.callee).toBe(`_${APPLY_DIRECTIVES}`)
expect(node.callee).toBe(APPLY_DIRECTIVES)
expect(node.arguments).toMatchObject([
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_VNODE}`,
callee: CREATE_VNODE,
arguments: [
`"div"`,
`null`,
@@ -357,12 +357,12 @@ describe('compiler: element transform', () => {
const { root, node } = parseWithElementTransform(
`<div v-foo v-bar="x" v-baz:[arg].mod.mad="y" />`
)
expect(root.imports).toContain(RESOLVE_DIRECTIVE)
expect(root.statements[0]).toMatch(`${RESOLVE_DIRECTIVE}("foo")`)
expect(root.statements[1]).toMatch(`${RESOLVE_DIRECTIVE}("bar")`)
expect(root.statements[2]).toMatch(`${RESOLVE_DIRECTIVE}("baz")`)
expect(root.helpers).toContain(RESOLVE_DIRECTIVE)
expect(root.directives).toContain(`foo`)
expect(root.directives).toContain(`bar`)
expect(root.directives).toContain(`baz`)
expect(node.callee).toBe(`_${APPLY_DIRECTIVES}`)
expect(node.callee).toBe(APPLY_DIRECTIVES)
expect(node.arguments).toMatchObject([
{
type: NodeTypes.JS_CALL_EXPRESSION

22
packages/compiler-core/__tests__/transforms/transformSlotOutlet.spec.ts
View File

@@ -10,7 +10,7 @@ import { transformElement } from '../../src/transforms/transformElement'
import { transformOn } from '../../src/transforms/vOn'
import { transformBind } from '../../src/transforms/vBind'
import { transformExpression } from '../../src/transforms/transformExpression'
import { RENDER_SLOT } from '../../src/runtimeConstants'
import { RENDER_SLOT } from '../../src/runtimeHelpers'
import { transformSlotOutlet } from '../../src/transforms/transformSlotOutlet'
function parseWithSlots(template: string, options: CompilerOptions = {}) {
@@ -35,7 +35,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot/>`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [`$slots`, `"default"`]
})
})
@@ -44,7 +44,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot name="foo" />`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [`$slots`, `"foo"`]
})
})
@@ -53,7 +53,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot :name="foo" />`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
{
@@ -98,7 +98,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot foo="bar" :baz="qux" />`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"default"`,
@@ -135,7 +135,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot name="foo" foo="bar" :baz="qux" />`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"foo"`,
@@ -173,7 +173,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot :name="foo" foo="bar" :baz="qux" />`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
{ content: `foo`, isStatic: false },
@@ -211,7 +211,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot><div/></slot>`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"default"`,
@@ -230,7 +230,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot name="foo"><div/></slot>`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"foo"`,
@@ -249,7 +249,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot :foo="bar"><div/></slot>`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"default"`,
@@ -282,7 +282,7 @@ describe('compiler: transform <slot> outlets', () => {
const ast = parseWithSlots(`<slot name="foo" :foo="bar"><div/></slot>`)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: [
`$slots`,
`"foo"`,

6
packages/compiler-core/__tests__/transforms/vBind.spec.ts
View File

@@ -9,7 +9,7 @@ import {
} from '../../src'
import { transformBind } from '../../src/transforms/vBind'
import { transformElement } from '../../src/transforms/transformElement'
import { CAMELIZE } from '../../src/runtimeConstants'
import { CAMELIZE, helperNameMap } from '../../src/runtimeHelpers'
import { transformExpression } from '../../src/transforms/transformExpression'
function parseWithVBind(
@@ -123,7 +123,7 @@ describe('compiler: transform v-bind', () => {
.arguments[1] as ObjectExpression
expect(props.properties[0]).toMatchObject({
key: {
content: `_${CAMELIZE}(foo)`,
content: `_${helperNameMap[CAMELIZE]}(foo)`,
isStatic: false
},
value: {
@@ -142,7 +142,7 @@ describe('compiler: transform v-bind', () => {
expect(props.properties[0]).toMatchObject({
key: {
children: [
`${CAMELIZE}(`,
`${helperNameMap[CAMELIZE]}(`,
{ content: `_ctx.foo` },
`(`,
{ content: `_ctx.bar` },

34
packages/compiler-core/__tests__/transforms/vFor.spec.ts
View File

@@ -23,7 +23,7 @@ import {
FRAGMENT,
RENDER_LIST,
RENDER_SLOT
} from '../../src/runtimeConstants'
} from '../../src/runtimeHelpers'
import { PatchFlags } from '@vue/runtime-dom'
import { PatchFlagNames } from '@vue/shared'
import { createObjectMatcher } from '../testUtils'
@@ -575,17 +575,17 @@ describe('compiler: v-for', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`
callee: OPEN_BLOCK
},
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`,
callee: CREATE_BLOCK,
arguments: [
`_${FRAGMENT}`,
FRAGMENT,
`null`,
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_LIST}`,
callee: RENDER_LIST,
arguments: [
{}, // to be asserted by each test
{
@@ -597,11 +597,11 @@ describe('compiler: v-for', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`
callee: OPEN_BLOCK
},
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`
callee: CREATE_BLOCK
}
]
}
@@ -703,7 +703,7 @@ describe('compiler: v-for', () => {
source: { content: `items` },
params: [{ content: `item` }],
blockArgs: [
`_${FRAGMENT}`,
FRAGMENT,
`null`,
[
{ type: NodeTypes.TEXT, content: `hello` },
@@ -728,7 +728,7 @@ describe('compiler: v-for', () => {
params: [{ content: `item` }],
returns: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`
callee: RENDER_SLOT
}
})
expect(generate(root).code).toMatchSnapshot()
@@ -746,7 +746,7 @@ describe('compiler: v-for', () => {
params: [{ content: `item` }],
returns: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`
callee: RENDER_SLOT
}
})
expect(generate(root).code).toMatchSnapshot()
@@ -781,7 +781,7 @@ describe('compiler: v-for', () => {
source: { content: `items` },
params: [{ content: `item` }],
blockArgs: [
`_${FRAGMENT}`,
FRAGMENT,
createObjectMatcher({
key: `[item]`
}),
@@ -804,7 +804,7 @@ describe('compiler: v-for', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`,
callee: OPEN_BLOCK,
arguments: []
},
{
@@ -812,14 +812,14 @@ describe('compiler: v-for', () => {
test: { content: `ok` },
consequent: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`,
callee: CREATE_BLOCK,
// should optimize v-if + v-for into a single Fragment block
arguments: [
`_${FRAGMENT}`,
FRAGMENT,
createObjectMatcher({ key: `[0]` }),
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_LIST}`,
callee: RENDER_LIST,
arguments: [
{ content: `list` },
{
@@ -830,11 +830,11 @@ describe('compiler: v-for', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`
callee: OPEN_BLOCK
},
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`,
callee: CREATE_BLOCK,
arguments: [`"div"`]
}
]

32
packages/compiler-core/__tests__/transforms/vIf.spec.ts
View File

@@ -24,7 +24,7 @@ import {
MERGE_PROPS,
APPLY_DIRECTIVES,
RENDER_SLOT
} from '../../src/runtimeConstants'
} from '../../src/runtimeHelpers'
import { createObjectMatcher } from '../testUtils'
function parseWithIfTransform(
@@ -271,7 +271,7 @@ describe('compiler: v-if', () => {
expressions: [
{
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${OPEN_BLOCK}`,
callee: OPEN_BLOCK,
arguments: []
},
{
@@ -281,13 +281,13 @@ describe('compiler: v-if', () => {
},
consequent: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`
callee: CREATE_BLOCK
},
alternate:
depth < 1
? {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`
callee: CREATE_BLOCK
}
: {
type: NodeTypes.JS_CONDITIONAL_EXPRESSION,
@@ -296,11 +296,11 @@ describe('compiler: v-if', () => {
},
consequent: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`
callee: CREATE_BLOCK
},
alternate: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_BLOCK}`
callee: CREATE_BLOCK
}
}
}
@@ -322,7 +322,7 @@ describe('compiler: v-if', () => {
])
const branch2 = (codegenNode.expressions[1] as ConditionalExpression)
.alternate as CallExpression
expect(branch2.arguments).toMatchObject([`_${EMPTY}`])
expect(branch2.arguments).toMatchObject([EMPTY])
expect(generate(root).code).toMatchSnapshot()
})
@@ -335,7 +335,7 @@ describe('compiler: v-if', () => {
const branch1 = (codegenNode.expressions[1] as ConditionalExpression)
.consequent as CallExpression
expect(branch1.arguments).toMatchObject([
`_${FRAGMENT}`,
FRAGMENT,
createObjectMatcher({ key: `[0]` }),
[
{ type: NodeTypes.ELEMENT, tag: 'div' },
@@ -345,7 +345,7 @@ describe('compiler: v-if', () => {
])
const branch2 = (codegenNode.expressions[1] as ConditionalExpression)
.alternate as CallExpression
expect(branch2.arguments).toMatchObject([`_${EMPTY}`])
expect(branch2.arguments).toMatchObject([EMPTY])
expect(generate(root).code).toMatchSnapshot()
})
@@ -359,7 +359,7 @@ describe('compiler: v-if', () => {
.consequent as CallExpression
expect(branch1).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: ['$slots', '"default"', createObjectMatcher({ key: `[0]` })]
})
expect(generate(root).code).toMatchSnapshot()
@@ -375,7 +375,7 @@ describe('compiler: v-if', () => {
.consequent as CallExpression
expect(branch1).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${RENDER_SLOT}`,
callee: RENDER_SLOT,
arguments: ['$slots', '"default"', createObjectMatcher({ key: `[0]` })]
})
expect(generate(root).code).toMatchSnapshot()
@@ -444,7 +444,7 @@ describe('compiler: v-if', () => {
createObjectMatcher({ key: `[1]` })
])
expect((branch2.alternate as CallExpression).arguments).toMatchObject([
`_${FRAGMENT}`,
FRAGMENT,
createObjectMatcher({ key: `[2]` }),
[
{
@@ -464,7 +464,7 @@ describe('compiler: v-if', () => {
.consequent as CallExpression
expect(branch1.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [createObjectMatcher({ key: `[0]` }), { content: `obj` }]
})
})
@@ -477,7 +477,7 @@ describe('compiler: v-if', () => {
.consequent as CallExpression
expect(branch1.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({
key: '[0]',
@@ -496,7 +496,7 @@ describe('compiler: v-if', () => {
.consequent as CallExpression
expect(branch1.arguments[1]).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${MERGE_PROPS}`,
callee: MERGE_PROPS,
arguments: [
createObjectMatcher({ key: `[0]` }),
{ content: `obj` },
@@ -513,7 +513,7 @@ describe('compiler: v-if', () => {
} = parseWithIfTransform(`<div v-if="ok" v-foo />`)
const branch1 = (codegenNode.expressions[1] as ConditionalExpression)
.consequent as CallExpression
expect(branch1.callee).toBe(`_${APPLY_DIRECTIVES}`)
expect(branch1.callee).toBe(APPLY_DIRECTIVES)
const realBranch = branch1.arguments[0] as CallExpression
expect(realBranch.arguments[1]).toMatchObject(
createObjectMatcher({ key: `[0]` })

6
packages/compiler-core/__tests__/transforms/vSlot.spec.ts
View File

@@ -17,7 +17,7 @@ import {
trackSlotScopes,
trackVForSlotScopes
} from '../../src/transforms/vSlot'
import { CREATE_SLOTS, RENDER_LIST } from '../../src/runtimeConstants'
import { CREATE_SLOTS, RENDER_LIST } from '../../src/runtimeHelpers'
import { createObjectMatcher } from '../testUtils'
import { PatchFlags, PatchFlagNames } from '@vue/shared'
import { transformFor } from '../../src/transforms/vFor'
@@ -360,7 +360,7 @@ describe('compiler: transform component slots', () => {
)
expect(slots).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_SLOTS}`,
callee: CREATE_SLOTS,
arguments: [
createObjectMatcher({
_compiled: `[true]`
@@ -451,7 +451,7 @@ describe('compiler: transform component slots', () => {
)
expect(slots).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: `_${CREATE_SLOTS}`,
callee: CREATE_SLOTS,
arguments: [
createObjectMatcher({
_compiled: `[true]`