feat(eventlisteners): add types for VNode in listener

fixes #796

Co-authored-by: Shahar Dawn Or <mightyiampresence@gmail.com>

src/package/modules/eventlisteners.ts

@@ -1,22 +1,19 @@
 import { VNode, VNodeData } from '../vnode'
 import { Module } from './module'
 
-type SpecificListener<N extends keyof HTMLElementEventMap> = (ev: HTMLElementEventMap[N]) => void
-
-type Listener = (ev: any) => void
+type Listener<T> = (this: VNode, ev: T, vnode: VNode) => void
 
 export type On = {
-  [N in keyof HTMLElementEventMap]?: SpecificListener<N> | Array<SpecificListener<N>>
+  [N in keyof HTMLElementEventMap]?: Listener<HTMLElementEventMap[N]> | Array<Listener<HTMLElementEventMap[N]>>
 } & {
-  [event: string]: Listener | Listener[]
+  [event: string]: Listener<any> | Array<Listener<any>>
 }
 
-type SomeListener<N extends keyof HTMLElementEventMap> = SpecificListener<N> | EventListener
+type SomeListener<N extends keyof HTMLElementEventMap> = Listener<HTMLElementEventMap[N]> | Listener<any>
 
-function invokeHandler<N extends keyof HTMLElementEventMap> (handler: SomeListener<N> | Array<SomeListener<N>>, vnode?: VNode, event?: Event): void {
+function invokeHandler<N extends keyof HTMLElementEventMap> (handler: SomeListener<N> | Array<SomeListener<N>>, vnode: VNode, event?: Event): void {
   if (typeof handler === 'function') {
     // call function handler
-    // @ts-expect-error
     handler.call(vnode, event, vnode)
   } else if (typeof handler === 'object') {
     // call multiple handlers

src/test/benchmark/core.ts

@@ -105,6 +105,7 @@ describe('core benchmark', () => {
         inputs,
         async function subjectToResultReducer (acc: HTMLElement | VNode, input, i) {
           const vnode = view(input)
+          // @ts-expect-error
           subject(acc, vnode)
           if (i % REQUEST_ANIMATION_FRAME_EVERY_N_PATCHES === 0) {
             await new Promise((resolve) => {

src/test/unit/eventlisteners.ts

@@ -81,14 +81,12 @@ describe('event listeners', function () {
       // Check that the second argument was a vnode
       assert.strictEqual(vnode.sel, 'div')
     }
-    // @ts-expect-error
     var vnode1 = h('div', { on: { click: [clicked, clicked, clicked] } }, [
       h('a', 'Click my parent'),
     ])
     elm = patch(vnode0, vnode1).elm
     elm.click()
     assert.strictEqual(3, called)
-    // @ts-expect-error
     var vnode2 = h('div', { on: { click: [clicked, clicked] } }, [
       h('a', 'Click my parent'),
     ])
@@ -102,7 +100,7 @@ describe('event listeners', function () {
       result.push(this)
       result.push(vnode)
     }
-    var vnode1 = h('div', { on: { click: clicked } as any }, [
+    var vnode1 = h('div', { on: { click: clicked } }, [
       h('a', 'Click my parent'),
     ])
     elm = patch(vnode0, vnode1).elm