From: Evan You <yyx990803@gmail.com>
Date: Fri, 13 Dec 2019 02:09:32 +0000 (-0500)
Subject: fix(compiler-core): should apply text transform to <template v-for> children
X-Git-Tag: v3.0.0-alpha.0~54
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=c36941c4987c38c5a92a1ae0d554dbf746177e71;p=thirdparty%2Fvuejs%2Fcore.git

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 a40a6f44dc..edfe8dc3e0 100644
--- 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 3c427c7fa1..d11f4b615f 100644
--- 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 3cc7518a8b..4a4d3fdc8c 100644
--- 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 () => {