test: tests for codegen

This commit is contained in:
Evan You
2019-09-24 15:49:02 -04:00
parent 76a1196935
commit 7a46e51815
12 changed files with 486 additions and 26 deletions

View File

@@ -0,0 +1,109 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler: codegen callExpression + objectExpression + arrayExpression 1`] = `
"return function render() {
with (this) {
return createVNode(\\"div\\", {
id: \\"foo\\",
[prop]: bar
}, [
foo,
createVNode(\\"p\\")
])
}
}"
`;
exports[`compiler: codegen comment 1`] = `
"return function render() {
with (this) {
return createVNode(Comment, 0, \\"foo\\")
}
}"
`;
exports[`compiler: codegen forNode 1`] = `
"return function render() {
with (this) {
return renderList(list, (v, k, i) => toString(v))
}
}"
`;
exports[`compiler: codegen function mode preamble 1`] = `
"const { helperOne, helperTwo } = Vue
return function render() {
with (this) {
return null
}
}"
`;
exports[`compiler: codegen ifNode 1`] = `
"return function render() {
with (this) {
return (foo)
? \\"foo\\"
: (bar)
? toString(bye)
: createVNode(Comment, 0, \\"foo\\")
}
}"
`;
exports[`compiler: codegen interpolation 1`] = `
"return function render() {
with (this) {
return toString(hello)
}
}"
`;
exports[`compiler: codegen module mode preamble 1`] = `
"import { helperOne, helperTwo } from 'vue'
export default function render() {
with (this) {
return null
}
}"
`;
exports[`compiler: codegen prefixIdentifiers: true should inject _ctx statement 1`] = `
"return function render() {
const _ctx = this
return null
}"
`;
exports[`compiler: codegen statement preambles 1`] = `
"return function render() {
const a = 1
const b = 2
with (this) {
return null
}
}"
`;
exports[`compiler: codegen static text 1`] = `
"return function render() {
with (this) {
return \\"hello\\"
}
}"
`;
exports[`compiler: codegen text + comment + interpolation 1`] = `
"return function render() {
with (this) {
return [
\\"foo\\",
toString(hello),
createVNode(Comment, 0, \\"foo\\")
]
}
}"
`;

View File

@@ -1,14 +1,298 @@
import { parse, generate } from '../src'
import {
parse,
generate,
NodeTypes,
RootNode,
SourceLocation,
createExpression,
Namespaces,
ElementTypes,
createObjectExpression,
createObjectProperty,
createArrayExpression
} from '../src'
import { SourceMapConsumer, RawSourceMap } from 'source-map'
import { CREATE_VNODE, COMMENT, TO_STRING } from '../src/runtimeConstants'
const mockLoc: SourceLocation = {
source: ``,
start: {
offset: 0,
line: 1,
column: 1
},
end: {
offset: 3,
line: 1,
column: 4
}
}
function createRoot(options: Partial<RootNode> = {}): RootNode {
return {
type: NodeTypes.ROOT,
children: [],
imports: [],
statements: [],
loc: mockLoc,
...options
}
}
describe('compiler: codegen', () => {
test('module mode preamble', () => {
const root = createRoot({
imports: [`helperOne`, `helperTwo`]
})
const { code } = generate(root, { mode: 'module' })
expect(code).toMatch(`import { helperOne, helperTwo } from 'vue'`)
expect(code).toMatchSnapshot()
})
test('function mode preamble', () => {
const root = createRoot({
imports: [`helperOne`, `helperTwo`]
})
const { code } = generate(root, { mode: 'function' })
expect(code).toMatch(`const { helperOne, helperTwo } = Vue`)
expect(code).toMatchSnapshot()
})
test('statement preambles', () => {
const root = createRoot({
statements: [`const a = 1`, `const b = 2`]
})
const { code } = generate(root, { mode: 'function' })
expect(code).toMatch(`const a = 1\n`)
expect(code).toMatch(`const b = 2\n`)
expect(code).toMatchSnapshot()
})
test('prefixIdentifiers: true should inject _ctx statement', () => {
const { code } = generate(createRoot(), { prefixIdentifiers: true })
expect(code).toMatch(`const _ctx = this\n`)
expect(code).toMatchSnapshot()
})
test('static text', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.TEXT,
content: 'hello',
isEmpty: false,
loc: mockLoc
}
]
})
)
expect(code).toMatch(`return "hello"`)
expect(code).toMatchSnapshot()
})
test('interpolation', () => {
const { code } = generate(
createRoot({
children: [createExpression(`hello`, false, mockLoc, true)]
})
)
expect(code).toMatch(`return toString(hello)`)
expect(code).toMatchSnapshot()
})
test('comment', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.COMMENT,
content: 'foo',
loc: mockLoc
}
]
})
)
expect(code).toMatch(`return ${CREATE_VNODE}(${COMMENT}, 0, "foo")`)
expect(code).toMatchSnapshot()
})
test('text + comment + interpolation', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.TEXT,
content: 'foo',
isEmpty: false,
loc: mockLoc
},
createExpression(`hello`, false, mockLoc, true),
{
type: NodeTypes.COMMENT,
content: 'foo',
loc: mockLoc
}
]
})
)
expect(code).toMatch(`
return [
"foo",
toString(hello),
${CREATE_VNODE}(${COMMENT}, 0, "foo")
]`)
expect(code).toMatchSnapshot()
})
test('ifNode', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.IF,
loc: mockLoc,
isRoot: true,
branches: [
{
type: NodeTypes.IF_BRANCH,
condition: createExpression('foo', false, mockLoc),
loc: mockLoc,
isRoot: true,
children: [
{
type: NodeTypes.TEXT,
content: 'foo',
isEmpty: false,
loc: mockLoc
}
]
},
{
type: NodeTypes.IF_BRANCH,
condition: createExpression('bar', false, mockLoc),
loc: mockLoc,
isRoot: true,
children: [createExpression(`bye`, false, mockLoc, true)]
},
{
type: NodeTypes.IF_BRANCH,
condition: undefined,
loc: mockLoc,
isRoot: true,
children: [
{
type: NodeTypes.COMMENT,
content: 'foo',
loc: mockLoc
}
]
}
]
}
]
})
)
expect(code).toMatch(`
return (foo)
? "foo"
: (bar)
? ${TO_STRING}(bye)
: ${CREATE_VNODE}(${COMMENT}, 0, "foo")`)
expect(code).toMatchSnapshot()
})
test('forNode', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.FOR,
loc: mockLoc,
source: createExpression(`list`, false, mockLoc),
valueAlias: createExpression(`v`, false, mockLoc),
keyAlias: createExpression(`k`, false, mockLoc),
objectIndexAlias: createExpression(`i`, false, mockLoc),
children: [createExpression(`v`, false, mockLoc, true)]
}
]
})
)
expect(code).toMatch(`renderList(list, (v, k, i) => toString(v))`)
expect(code).toMatchSnapshot()
})
test('callExpression + objectExpression + arrayExpression', () => {
const { code } = generate(
createRoot({
children: [
{
type: NodeTypes.ELEMENT,
loc: mockLoc,
ns: Namespaces.HTML,
tag: 'div',
tagType: ElementTypes.ELEMENT,
isSelfClosing: false,
props: [],
children: [],
codegenNode: {
type: NodeTypes.JS_CALL_EXPRESSION,
loc: mockLoc,
callee: CREATE_VNODE,
arguments: [
`"div"`,
createObjectExpression(
[
createObjectProperty(
createExpression(`id`, true, mockLoc),
createExpression(`foo`, true, mockLoc),
mockLoc
),
createObjectProperty(
createExpression(`prop`, false, mockLoc),
createExpression(`bar`, false, mockLoc),
mockLoc
)
],
mockLoc
),
createArrayExpression(
[
'foo',
{
type: NodeTypes.JS_CALL_EXPRESSION,
loc: mockLoc,
callee: CREATE_VNODE,
arguments: [`"p"`]
}
],
mockLoc
)
]
}
}
]
})
)
expect(code).toMatch(`
return ${CREATE_VNODE}("div", {
id: "foo",
[prop]: bar
}, [
foo,
${CREATE_VNODE}("p")
])`)
expect(code).toMatchSnapshot()
})
test('basic source map support', async () => {
const source = `hello {{ world }}`
const ast = parse(source)
const { code, map } = generate(ast, {
sourceMap: true,
filename: `foo.vue`
})
expect(code).toBe(
expect(code).toMatch(
`return function render() {
with (this) {
return [

View File

@@ -0,0 +1 @@
// Integration tests for parser + transform + codegen

View File

@@ -2,6 +2,7 @@ import { parse } from '../src/parse'
import { transform, NodeTransform } from '../src/transform'
import { ElementNode, NodeTypes } from '../src/ast'
import { ErrorCodes, createCompilerError } from '../src/errors'
import { TO_STRING, CREATE_VNODE, COMMENT } from '../src/runtimeConstants'
describe('compiler: transform', () => {
test('context state', () => {
@@ -180,4 +181,17 @@ describe('compiler: transform', () => {
}
])
})
test('should inject toString helper for interpolations', () => {
const ast = parse(`{{ foo }}`)
transform(ast, {})
expect(ast.imports).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)
})
})

View File

@@ -0,0 +1 @@
// TODO

View File

@@ -29,7 +29,9 @@ describe('compiler: transform v-if', () => {
test('basic v-if', () => {
const node = parseWithIfTransform(`<div v-if="ok"/>`)
expect(node.type).toBe(NodeTypes.IF)
expect(node.isRoot).toBe(true)
expect(node.branches.length).toBe(1)
expect(node.branches[0].isRoot).toBe(true)
expect(node.branches[0].condition!.content).toBe(`ok`)
expect(node.branches[0].children.length).toBe(1)
expect(node.branches[0].children[0].type).toBe(NodeTypes.ELEMENT)

View File

@@ -0,0 +1 @@
// TODO