fix(compiler-core): should apply text transform to <template v-for> children
This commit is contained in:
parent
8ffd79c754
commit
c36941c498
@ -1,5 +1,21 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`compiler: transform text <template v-for> 1`] = `
|
||||||
|
"const _Vue = Vue
|
||||||
|
|
||||||
|
return function render() {
|
||||||
|
with (this) {
|
||||||
|
const { renderList: _renderList, openBlock: _openBlock, createBlock: _createBlock, Fragment: _Fragment, createTextVNode: _createTextVNode } = _Vue
|
||||||
|
|
||||||
|
return (_openBlock(false), _createBlock(_Fragment, null, _renderList(list, (i) => {
|
||||||
|
return (_openBlock(), _createBlock(_Fragment, null, [
|
||||||
|
_createTextVNode(\\"foo\\")
|
||||||
|
], 64 /* STABLE_FRAGMENT */))
|
||||||
|
}), 256 /* UNKEYED_FRAGMENT */))
|
||||||
|
}
|
||||||
|
}"
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`compiler: transform text consecutive text 1`] = `
|
exports[`compiler: transform text consecutive text 1`] = `
|
||||||
"const _Vue = Vue
|
"const _Vue = Vue
|
||||||
|
|
||||||
|
@ -3,8 +3,10 @@ import {
|
|||||||
parse,
|
parse,
|
||||||
transform,
|
transform,
|
||||||
NodeTypes,
|
NodeTypes,
|
||||||
generate
|
generate,
|
||||||
|
ForNode
|
||||||
} from '../../src'
|
} from '../../src'
|
||||||
|
import { transformFor } from '../../src/transforms/vFor'
|
||||||
import { transformText } from '../../src/transforms/transformText'
|
import { transformText } from '../../src/transforms/transformText'
|
||||||
import { transformExpression } from '../../src/transforms/transformExpression'
|
import { transformExpression } from '../../src/transforms/transformExpression'
|
||||||
import { transformElement } from '../../src/transforms/transformElement'
|
import { transformElement } from '../../src/transforms/transformElement'
|
||||||
@ -16,6 +18,7 @@ function transformWithTextOpt(template: string, options: CompilerOptions = {}) {
|
|||||||
const ast = parse(template)
|
const ast = parse(template)
|
||||||
transform(ast, {
|
transform(ast, {
|
||||||
nodeTransforms: [
|
nodeTransforms: [
|
||||||
|
transformFor,
|
||||||
...(options.prefixIdentifiers ? [transformExpression] : []),
|
...(options.prefixIdentifiers ? [transformExpression] : []),
|
||||||
transformText,
|
transformText,
|
||||||
transformElement
|
transformElement
|
||||||
@ -149,6 +152,20 @@ describe('compiler: transform text', () => {
|
|||||||
expect(generate(root).code).toMatchSnapshot()
|
expect(generate(root).code).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
test('<template v-for>', () => {
|
||||||
|
const root = transformWithTextOpt(
|
||||||
|
`<template v-for="i in list">foo</template>`
|
||||||
|
)
|
||||||
|
expect(root.children[0].type).toBe(NodeTypes.FOR)
|
||||||
|
const forNode = root.children[0] as ForNode
|
||||||
|
// should convert template v-for text children because they are inside
|
||||||
|
// fragments
|
||||||
|
expect(forNode.children[0]).toMatchObject({
|
||||||
|
type: NodeTypes.TEXT_CALL
|
||||||
|
})
|
||||||
|
expect(generate(root).code).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
|
||||||
test('with prefixIdentifiers: true', () => {
|
test('with prefixIdentifiers: true', () => {
|
||||||
const root = transformWithTextOpt(`{{ foo }} bar {{ baz + qux }}`, {
|
const root = transformWithTextOpt(`{{ foo }} bar {{ baz + qux }}`, {
|
||||||
prefixIdentifiers: true
|
prefixIdentifiers: true
|
||||||
|
@ -20,7 +20,11 @@ const isText = (
|
|||||||
// Merge adjacent text nodes and expressions into a single expression
|
// Merge adjacent text nodes and expressions into a single expression
|
||||||
// e.g. <div>abc {{ d }} {{ e }}</div> should have a single expression node as child.
|
// e.g. <div>abc {{ d }} {{ e }}</div> should have a single expression node as child.
|
||||||
export const transformText: NodeTransform = (node, context) => {
|
export const transformText: NodeTransform = (node, context) => {
|
||||||
if (node.type === NodeTypes.ROOT || node.type === NodeTypes.ELEMENT) {
|
if (
|
||||||
|
node.type === NodeTypes.ROOT ||
|
||||||
|
node.type === NodeTypes.ELEMENT ||
|
||||||
|
node.type === NodeTypes.FOR
|
||||||
|
) {
|
||||||
// perform the transform on node exit so that all expressions have already
|
// perform the transform on node exit so that all expressions have already
|
||||||
// been processed.
|
// been processed.
|
||||||
return () => {
|
return () => {
|
||||||
|
Loading…
Reference in New Issue
Block a user