fix(compiler-vapor): create dynamic text node (#193)

packages/compiler-vapor/__tests__/transforms/__snapshots__/transformText.spec.ts.snap

@@ -0,0 +1,19 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`compiler: text transform > consecutive text 1`] = `
+"import { createTextNode as _createTextNode } from 'vue/vapor';
+
+export function render(_ctx) {
+  const n0 = _createTextNode(() => [_ctx.msg])
+  return n0
+}"
+`;
+
+exports[`compiler: text transform > no consecutive text 1`] = `
+"import { createTextNode as _createTextNode } from 'vue/vapor';
+
+export function render(_ctx) {
+  const n0 = _createTextNode(["hello world"])
+  return n0
+}"
+`;

packages/compiler-vapor/__tests__/transforms/transformText.spec.ts

@@ -1,4 +1,63 @@
 // TODO: add tests for this transform
-describe('compiler: text transform', () => {
-  test.todo('basic')
+import {
+  IRNodeTypes,
+  transformChildren,
+  transformElement,
+  transformText,
+  transformVBind,
+  transformVOn,
+} from '../../src'
+
+import { makeCompile } from './_utils'
+
+const compileWithTextTransform = makeCompile({
+  nodeTransforms: [transformElement, transformChildren, transformText],
+  directiveTransforms: {
+    bind: transformVBind,
+    on: transformVOn,
+  },
+})
+
+describe('compiler: text transform', () => {
+  it('no consecutive text', () => {
+    const { code, ir, vaporHelpers } = compileWithTextTransform(
+      '{{ "hello world" }}',
+    )
+    expect(code).toMatchSnapshot()
+    expect(vaporHelpers).contains.all.keys('createTextNode')
+    expect(ir.block.operation).toMatchObject([
+      {
+        type: IRNodeTypes.CREATE_TEXT_NODE,
+        id: 0,
+        values: [
+          {
+            type: IRNodeTypes.SET_TEXT,
+            content: '"hello world"',
+            isStatic: false,
+          },
+        ],
+        effect: false,
+      },
+    ])
+  })
+
+  it('consecutive text', () => {
+    const { code, ir, vaporHelpers } = compileWithTextTransform('{{ msg }}')
+    expect(code).toMatchSnapshot()
+    expect(vaporHelpers).contains.all.keys('createTextNode')
+    expect(ir.block.operation).toMatchObject([
+      {
+        type: IRNodeTypes.CREATE_TEXT_NODE,
+        id: 0,
+        values: [
+          {
+            type: IRNodeTypes.SET_TEXT,
+            content: 'msg',
+            isStatic: false,
+          },
+        ],
+        effect: true,
+      },
+    ])
+  })
 })

packages/compiler-vapor/src/transforms/transformText.ts

@@ -56,7 +56,7 @@ function processTextLike(context: TransformContext<InterpolationNode>) {
     type: IRNodeTypes.CREATE_TEXT_NODE,
     id,
     values,
-    effect: !values.some(isConstantExpression),
+    effect: !values.every(isConstantExpression) && !context.inVOnce,
   })
 }