fix: cannot infer event type for <Transition>

close #2700
vuejs · Apr 24, 2023 · 09fbbb7 · 09fbbb7
1 parent 4a3460c
commit 09fbbb7
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 6 deletions.
diff --git a/packages/vue-language-core/src/generators/template.ts b/packages/vue-language-core/src/generators/template.ts
@@ -603,7 +603,7 @@ export function generate(
 			generateClassScoped(node);
 		}
 		if (componentCtxVar) {
-			generateEvents(node, componentInstanceVar, componentCtxVar);
+			generateEvents(node, componentVar, componentInstanceVar, componentCtxVar);
 		}
 		generateSlot(node, startTagOffset);
 
@@ -714,7 +714,7 @@ export function generate(
 		codes.push(`}\n`);
 	}
 
-	function generateEvents(node: CompilerDOM.ElementNode, componentInstanceVar: string, componentCtxVar: string) {
+	function generateEvents(node: CompilerDOM.ElementNode, componentVar: string, componentInstanceVar: string, componentCtxVar: string) {
 
 		for (const prop of node.props) {
 			if (
@@ -725,7 +725,7 @@ export function generate(
 				const eventVar = `__VLS_${elementIndex++}`;
 				codes.push(
 					`let ${eventVar} = { '${prop.arg.loc.source}': `,
-					`(await import('./__VLS_types')).pickEvent(${componentCtxVar}.emit!, '${prop.arg.loc.source}' as const, ${componentInstanceVar}.__props!`,
+					`(await import('./__VLS_types')).pickEvent(${componentCtxVar}.emit!, '${prop.arg.loc.source}' as const, (await import('./__VLS_types')).componentProps(${componentVar}, ${componentInstanceVar})`,
 					...createPropertyAccessCode([
 						camelize('on-' + prop.arg.loc.source), // onClickOutside
 						'template',

diff --git a/packages/vue-language-core/src/utils/localTypes.ts b/packages/vue-language-core/src/utils/localTypes.ts
@@ -102,15 +102,20 @@ export declare function asFunctionalComponent<T, K = T extends new (...args: any
 declare function functionalComponentArgsRest<T extends (...args: any) => any>(t: T): Parameters<T>['length'] extends 2 ? [any] : [];
 export declare function pickEvent<Emit, K, E>(emit: Emit, emitKey: K, event: E): FillingEventArg<
 	PickNotAny<
-		AsFunctionOrAny<NonNullable<E>>,
-		AsFunctionOrAny<NonNullable<EmitEvent<Emit, K>>>
+		AsFunctionOrAny<E>,
+		AsFunctionOrAny<EmitEvent<Emit, K>>
 	>
 >;
 export declare function pickFunctionalComponentCtx<T, K>(comp: T, compInstance: K): PickNotAny<
 	K extends { __ctx?: infer Ctx } ? Ctx : any,
 	T extends (props: any, ctx: infer Ctx) => any ? Ctx : any
 >;
-type AsFunctionOrAny<F> = F extends ((...args: any) => any) ? F : any;
+type AsFunctionOrAny<F> = unknown extends F ? any : ((...args: any) => any) extends F ? F : any;
+
+export declare function componentProps<T, K>(comp: T, fnReturn: K):
+	PickNotAny<K, {}> extends { __props: infer P } ? NonNullable<P>
+	: T extends (props: infer P, ...args: any) => any ? NonNullable<P> :
+	{};
 `.trim();
 }
 

diff --git a/packages/vue-test-workspace/vue-tsc/#2700/main.vue b/packages/vue-test-workspace/vue-tsc/#2700/main.vue
@@ -0,0 +1,8 @@
+<template>
+	<Transition @after-leave="el => exactType(el, {} as Element)"></Transition>
+	<Transition :on-after-leave="el => exactType(el, {} as Element)"></Transition>
+</template>
+
+<script setup lang="ts">
+import { exactType } from '../shared';
+</script>