fix(compiler-core): emit TS-compatible function declaration when requested (#9363)

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Haoqun Jiang <haoqunjiang@gmail.com>

diff --git a/packages/compiler-core/__tests__/__snapshots__/scopeId.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/scopeId.spec.ts.snap
index 445d3fd13ed047251a0b43f04c195ddf0078bf20..7267ba6b041b9b4a07345506e7504105f02786c5 100644 (file)
--- a/packages/compiler-core/__tests__/__snapshots__/scopeId.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/scopeId.spec.ts.snap
@@ -16,6 +16,22 @@ export function render(_ctx, _cache) {
 }"
 `;
 
+exports[`scopeId compiler support > should push typescript-compatible scopeId for hoisted nodes 1`] = `
+"import { createElementVNode as _createElementVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue"
+
+const _withScopeId = (n: any) => (_pushScopeId("test"),n=n(),_popScopeId(),n)
+const _hoisted_1 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode("div", null, "hello", -1 /* HOISTED */))
+const _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode("div", null, "world", -1 /* HOISTED */))
+
+export function render(_ctx: any,_cache: any) {
+  return (_openBlock(), _createElementBlock("div", null, [
+    _hoisted_1,
+    _createTextVNode(_toDisplayString(_ctx.foo), 1 /* TEXT */),
+    _hoisted_2
+  ]))
+}"
+`;
+
 exports[`scopeId compiler support > should wrap default slot 1`] = `
 "import { createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue"
 

diff --git a/packages/compiler-core/__tests__/scopeId.spec.ts b/packages/compiler-core/__tests__/scopeId.spec.ts
index c7a21df7a7879dad57701c17fbbf0333e771d644..21e7327f2eb6cdaeb5265b1e6e64e866c2d7a70d 100644 (file)
--- a/packages/compiler-core/__tests__/scopeId.spec.ts
+++ b/packages/compiler-core/__tests__/scopeId.spec.ts
@@ -81,4 +81,29 @@ describe('scopeId compiler support', () => {
     ].forEach(c => expect(code).toMatch(c))
     expect(code).toMatchSnapshot()
   })
+
+  test('should push typescript-compatible scopeId for hoisted nodes', () => {
+    const { ast, code } = baseCompile(
+      `<div><div>hello</div>{{ foo }}<div>world</div></div>`,
+      {
+        mode: 'module',
+        scopeId: 'test',
+        hoistStatic: true,
+        isTS: true,
+      },
+    )
+    expect(ast.helpers).toContain(PUSH_SCOPE_ID)
+    expect(ast.helpers).toContain(POP_SCOPE_ID)
+    expect(ast.hoists.length).toBe(2)
+    ;[
+      `const _withScopeId = (n: any) => (_pushScopeId("test"),n=n(),_popScopeId(),n)`,
+      `const _hoisted_1 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode("div", null, "hello", ${genFlagText(
+        PatchFlags.HOISTED,
+      )}))`,
+      `const _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode("div", null, "world", ${genFlagText(
+        PatchFlags.HOISTED,
+      )}))`,
+    ].forEach(c => expect(code).toMatch(c))
+    expect(code).toMatchSnapshot()
+  })
 })

diff --git a/packages/compiler-core/src/codegen.ts b/packages/compiler-core/src/codegen.ts
index 987293d512497ed455480f2d418ac7cd9d1bfc7f..39170bac5a0e2dac8f1422984521dc3db72b1e75 100644 (file)
--- a/packages/compiler-core/src/codegen.ts
+++ b/packages/compiler-core/src/codegen.ts
@@ -572,8 +572,9 @@ function genHoists(hoists: (JSChildNode | null)[], context: CodegenContext) {
 
   // generate inlined withScopeId helper
   if (genScopeId) {
+    const param = context.isTS ? '(n: any)' : 'n'
     push(
-      `const _withScopeId = n => (${helper(
+      `const _withScopeId = ${param} => (${helper(
         PUSH_SCOPE_ID,
       )}("${scopeId}"),n=n(),${helper(POP_SCOPE_ID)}(),n)`,
     )