fix(compat): correctly transform non-identifier expressions in legacy…

… filter syntax (#10896) close #10852
vuejs · May 27, 2024 · 07b3c4b · 07b3c4b
1 parent 37f9ef8
commit 07b3c4b
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 0 deletions.
diff --git a/packages/compiler-core/src/compat/transformFilter.ts b/packages/compiler-core/src/compat/transformFilter.ts
@@ -168,6 +168,8 @@ function parseFilter(node: SimpleExpressionNode, context: TransformContext) {
       expression = wrapFilter(expression, filters[i], context)
     }
     node.content = expression
+    // reset ast since the content is replaced
+    node.ast = undefined
   }
 }
 

diff --git a/packages/compiler-sfc/__tests__/compileTemplate.spec.ts b/packages/compiler-sfc/__tests__/compileTemplate.spec.ts
@@ -1,4 +1,5 @@
 import { type RawSourceMap, SourceMapConsumer } from 'source-map-js'
+import { parse as babelParse } from '@babel/parser'
 import {
   type SFCTemplateCompileOptions,
   compileTemplate,
@@ -452,6 +453,36 @@ test('prefixing edge case for reused AST ssr mode', () => {
   ).not.toThrowError()
 })
 
+// #10852
+test('non-identifier expression in legacy filter syntax', () => {
+  const src = `
+  <template>
+    <div>
+      Today is
+      {{ new Date() | formatDate }}
+    </div>
+  </template>
+  `
+
+  const { descriptor } = parse(src)
+  const compilationResult = compileTemplate({
+    id: 'xxx',
+    filename: 'test.vue',
+    ast: descriptor.template!.ast,
+    source: descriptor.template!.content,
+    ssr: false,
+    compilerOptions: {
+      compatConfig: {
+        MODE: 2,
+      },
+    },
+  })
+
+  expect(() => {
+    babelParse(compilationResult.code, { sourceType: 'module' })
+  }).not.toThrow()
+})
+
 interface Pos {
   line: number
   column: number