fix(compiler-core): should apply text transform to <template v-for> children

diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
index a40a6f44dc2aaabaa40263cc325c31f337471d6c..edfe8dc3e09dfd3f3d65eaf3df1361586bd4ec18 100644 (file)
--- a/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
+++ b/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
@@ -1,5 +1,21 @@
 // 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`] = `
 "const _Vue = Vue
 

diff --git a/packages/compiler-core/__tests__/transforms/transformText.spec.ts b/packages/compiler-core/__tests__/transforms/transformText.spec.ts
index 3c427c7fa1e1b8e8941a41e14f5619f0a69d3d43..d11f4b615f2dc112a2b1ea86ea92d272a0118898 100644 (file)
--- a/packages/compiler-core/__tests__/transforms/transformText.spec.ts
+++ b/packages/compiler-core/__tests__/transforms/transformText.spec.ts
@@ -3,8 +3,10 @@ import {
   parse,
   transform,
   NodeTypes,
-  generate
+  generate,
+  ForNode
 } from '../../src'
+import { transformFor } from '../../src/transforms/vFor'
 import { transformText } from '../../src/transforms/transformText'
 import { transformExpression } from '../../src/transforms/transformExpression'
 import { transformElement } from '../../src/transforms/transformElement'
@@ -16,6 +18,7 @@ function transformWithTextOpt(template: string, options: CompilerOptions = {}) {
   const ast = parse(template)
   transform(ast, {
     nodeTransforms: [
+      transformFor,
       ...(options.prefixIdentifiers ? [transformExpression] : []),
       transformText,
       transformElement
@@ -149,6 +152,20 @@ describe('compiler: transform text', () => {
     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', () => {
     const root = transformWithTextOpt(`{{ foo }} bar {{ baz + qux }}`, {
       prefixIdentifiers: true

diff --git a/packages/compiler-core/src/transforms/transformText.ts b/packages/compiler-core/src/transforms/transformText.ts
index 3cc7518a8b0c3f160c4a47f3193b69473827f342..4a4d3fdc8c0414f717069f7c67cf55a4cd3f0e0c 100644 (file)
--- a/packages/compiler-core/src/transforms/transformText.ts
+++ b/packages/compiler-core/src/transforms/transformText.ts
@@ -20,7 +20,11 @@ const isText = (
 // 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.
 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
     // been processed.
     return () => {