Async Event Handlers are broken in TS files

[dev-nicolaos]

Environment

• Windows 10 Home version 1909
• Deno version 0.35.0

Steps to Reproduce

1. Create a file test.ts

window.addEventListener("load", async () => {
  console.log("hello");
});

2. Run the file: deno test.ts

Expected Behavior

The program prints hello, then exits with no errors.

Actual Behavior

The following error is printed to the console and the program exits without printing hello:

error TS2345: Argument of type '() => Promise<void>' is not assignable to parameter of type '(event: Event) => void | null'.
  Type 'Promise<void>' is not assignable to type 'void'.

► file:///Path/To/CWD/test.ts:1:33

1 window.addEventListener("load", async () => {

Notes

• I believe having an async function as an event handler is valid JS/TS, it ran in previous versions of Deno (as recently as v30). Thinking it was probably broken by Enable "strict" mode for runtime code. #3899. If I rename the file to test.js it runs without a problem.
• I'm guessing this error being thrown has to do with Deno's type declaration for event handlers. While I'm not familiar enough with the code base to know exactly where the problematic declaration is, these seem like likely candidates

  • deno/cli/js/globals.ts

    Line 107 in a3bfbcc

    callback: (event: domTypes.Event) => void | null,

  • deno/cli/js/lib.deno.shared_globals.d.ts

    Line 45 in 6cd46fa

    callback: (event: __domTypes.Event) => void | null,

  • deno/cli/js/event_target.ts

    Line 38 in dd8a109

    callback: (event: domTypes.Event) => void | null,

  • deno/cli/js/dom_types.ts

    Line 86 in 2b0cf74

    callback: (event: Event) => void | null,

[kevinkassimo]

I think marking the return types of callbacks to be any might be reasonable here.

I also noticed that addEventListener should also be able to take objects implementing EventListener interface, not just plain functions.

[kitsonk]

We really should follow the TypeScript typings for stuff like this as they get a lot of more real world use. TypeScript has:

addEventListener<K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
removeEventListener<K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;

[kevinkassimo]

@kitsonk I think that is only for AbortSignal.

The actual lines we should follow are:
https://github.com/microsoft/TypeScript/blob/0326534a2a6c361f5334a66197a3cdd84cb45b6f/lib/lib.webworker.d.ts#L5667
https://github.com/microsoft/TypeScript/blob/0326534a2a6c361f5334a66197a3cdd84cb45b6f/lib/lib.webworker.d.ts#L1504