diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/transformExpressions.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/transformExpressions.spec.ts.snap
index 5a94de5a68b..8907962d81b 100644
--- a/packages/compiler-core/__tests__/transforms/__snapshots__/transformExpressions.spec.ts.snap
+++ b/packages/compiler-core/__tests__/transforms/__snapshots__/transformExpressions.spec.ts.snap
@@ -14,6 +14,16 @@ return function render(_ctx, _cache, $props, $setup, $data, $options) {
}"
`;
+exports[`compiler: expression transform > expression with type 1`] = `
+"const { openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
+
+return function render(_ctx, _cache) {
+ return (_openBlock(), _createElementBlock("div", {
+ onClick: _ctx.handleClick
+ }, null, 8 /* PROPS */, ["onClick"]))
+}"
+`;
+
exports[`compiler: expression transform > should allow leak of var declarations in for loop 1`] = `
"const { openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
diff --git a/packages/compiler-core/__tests__/transforms/transformExpressions.spec.ts b/packages/compiler-core/__tests__/transforms/transformExpressions.spec.ts
index c92814089ef..66025dd0f01 100644
--- a/packages/compiler-core/__tests__/transforms/transformExpressions.spec.ts
+++ b/packages/compiler-core/__tests__/transforms/transformExpressions.spec.ts
@@ -716,4 +716,12 @@ describe('compiler: expression transform', () => {
})
})
})
+
+ test('expression with type', () => {
+ const { code } = compile(
+ `
handleClick as any)">
`,
+ )
+ expect(code).toMatch(`onClick: _ctx.handleClick`)
+ expect(code).toMatchSnapshot()
+ })
})
diff --git a/packages/compiler-core/src/transforms/transformExpression.ts b/packages/compiler-core/src/transforms/transformExpression.ts
index 9ae8897e674..be4b09bb67d 100644
--- a/packages/compiler-core/src/transforms/transformExpression.ts
+++ b/packages/compiler-core/src/transforms/transformExpression.ts
@@ -18,6 +18,7 @@ import {
createSimpleExpression,
} from '../ast'
import {
+ TS_NODE_TYPES,
isInDestructureAssignment,
isInNewExpression,
isStaticProperty,
@@ -347,15 +348,18 @@ export function processExpression(
// an ExpressionNode has the `.children` property, it will be used instead of
// `.content`.
const children: CompoundExpressionNode['children'] = []
+ const isTSNode = TS_NODE_TYPES.includes(ast.type)
ids.sort((a, b) => a.start - b.start)
ids.forEach((id, i) => {
// range is offset by -1 due to the wrapping parens when parsed
const start = id.start - 1
const end = id.end - 1
const last = ids[i - 1]
- const leadingText = rawExp.slice(last ? last.end - 1 : 0, start)
- if (leadingText.length || id.prefix) {
- children.push(leadingText + (id.prefix || ``))
+ if (!(isTSNode && i === 0)) {
+ const leadingText = rawExp.slice(last ? last.end - 1 : 0, start)
+ if (leadingText.length || id.prefix) {
+ children.push(leadingText + (id.prefix || ``))
+ }
}
const source = rawExp.slice(start, end)
children.push(
@@ -372,7 +376,7 @@ export function processExpression(
: ConstantTypes.NOT_CONSTANT,
),
)
- if (i === ids.length - 1 && end < rawExp.length) {
+ if (i === ids.length - 1 && end < rawExp.length && !isTSNode) {
children.push(rawExp.slice(end))
}
})