diff --git a/packages/dts-test/h.test-d.ts b/packages/dts-test/h.test-d.ts index f2e984b49b8..2392c5850f1 100644 --- a/packages/dts-test/h.test-d.ts +++ b/packages/dts-test/h.test-d.ts @@ -9,7 +9,7 @@ import { Component, resolveComponent } from 'vue' -import { describe, expectAssignable } from './utils' +import { describe, expectAssignable, expectType } from './utils' describe('h inference w/ element', () => { // key @@ -32,6 +32,17 @@ describe('h inference w/ element', () => { // slots const slots = { default: () => {} } // RawSlots h('div', {}, slots) + // events + h('div', { + onClick: e => { + expectType(e) + } + }) + h('input', { + onFocus(e) { + expectType(e) + } + }) }) describe('h inference w/ Fragment', () => { diff --git a/packages/runtime-core/src/h.ts b/packages/runtime-core/src/h.ts index 4ca90262f2a..038d8d2fbc7 100644 --- a/packages/runtime-core/src/h.ts +++ b/packages/runtime-core/src/h.ts @@ -75,10 +75,27 @@ interface Constructor

{ new (...args: any[]): { $props: P } } +type HTMLElementEventHandler = { + [K in keyof HTMLElementEventMap as `on${Capitalize}`]?: ( + ev: HTMLElementEventMap[K] + ) => any +} + // The following is a series of overloads for providing props validation of // manually written render functions. // element +export function h( + type: K, + children?: RawChildren +): VNode +export function h( + type: K, + props?: (RawProps & HTMLElementEventHandler) | null, + children?: RawChildren | RawSlots +): VNode + +// custom element export function h(type: string, children?: RawChildren): VNode export function h( type: string,