Shim Event & EventTarget for compatibility with old Node versions

Author: mrbbot

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "miniflare",
-  "version": "1.3.3",
+  "version": "1.4.0",
   "description": "Fun, full-featured, fully-local simulator for Cloudflare Workers",
   "keywords": [
     "cloudflare",
@@ -35,12 +35,13 @@
   },
   "dependencies": {
     "@iarna/toml": "^2.2.5",
-    "@mrbbot/node-fetch": "^4.4.0",
+    "@mrbbot/node-fetch": "^4.5.0",
     "@peculiar/webcrypto": "^1.1.4",
     "chokidar": "^3.5.1",
     "cjstoesm": "^1.1.4",
     "dotenv": "^8.2.0",
     "env-paths": "^2.2.1",
+    "event-target-shim": "^6.0.2",
     "formdata-node": "^2.5.0",
     "html-rewriter-wasm": "^0.3.2",
     "http-cache-semantics": "^4.1.0",
@@ -93,22 +94,19 @@
     "@typescript-eslint/eslint-plugin": "^4.28.0",
     "@typescript-eslint/parser": "^4.28.0",
     "ava": "^3.15.0",
-    "cjstoesm": "^1.1.4",
     "esbuild": "^0.12.9",
     "eslint": "^7.18.0",
     "eslint-config-prettier": "^7.1.0",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-prettier": "^3.3.1",
-    "ioredis": "^4.27.6",
     "prettier": "^2.2.1",
     "rimraf": "^3.0.2",
     "ts-node": "^9.1.1",
-    "typescript": "^4.3.4",
     "vitepress": "^0.15.5",
     "which": "^2.0.2"
   },
   "engines": {
-    "node": ">=16.5.0"
+    "node": ">=10.12.0"
   },
   "repository": {
     "type": "git",
@@ -119,6 +117,6 @@
   },
   "homepage": "https://miniflare.dev/",
   "volta": {
-    "node": "16.6.0"
+    "node": "14.17.1"
   }
 }

package.json

@@ -7,30 +7,3 @@ export class MiniflareError extends Error {
     this.name = new.target.name;
   }
 }
-
-export type TypedEventListener<Event> =
-  | ((e: Event) => void)
-  | { handleEvent(e: Event): void };
-
-export interface TypedEventTargetInterface<
-  EventMap extends Record<string, Event>
-> extends EventTarget {
-  addEventListener<EventType extends keyof EventMap>(
-    type: EventType,
-    listener: TypedEventListener<EventMap[EventType]> | null,
-    options?: AddEventListenerOptions | boolean
-  ): void;
-
-  removeEventListener<EventType extends keyof EventMap>(
-    type: EventType,
-    listener: TypedEventListener<EventMap[EventType]> | null,
-    options?: EventListenerOptions | boolean
-  ): void;
-}
-
-export function typedEventTarget<EventMap extends Record<string, Event>>(): {
-  prototype: TypedEventTargetInterface<EventMap>;
-  new (): TypedEventTargetInterface<EventMap>;
-} {
-  return EventTarget as any;
-}

src/helpers.ts

@@ -1,6 +1,6 @@
 import { URL } from "url";
 import fetch from "@mrbbot/node-fetch";
-import { TypedEventListener, typedEventTarget } from "../helpers";
+import { Event, EventTarget } from "event-target-shim";
 import { Log } from "../log";
 import { Context, Module } from "./module";
 import { FetchError, Request, Response } from "./standards";
@@ -11,7 +11,7 @@ export const responseSymbol = Symbol("response");
 export const passThroughSymbol = Symbol("passThrough");
 export const waitUntilSymbol = Symbol("waitUntil");
 
-export class FetchEvent extends Event {
+export class FetchEvent extends Event<"fetch"> {
   [responseSymbol]?: Promise<Response>;
   [passThroughSymbol] = false;
   readonly [waitUntilSymbol]: Promise<any>[] = [];
@@ -34,7 +34,7 @@ export class FetchEvent extends Event {
   }
 }
 
-export class ScheduledEvent extends Event {
+export class ScheduledEvent extends Event<"scheduled"> {
   readonly [waitUntilSymbol]: Promise<any>[] = [];
 
   constructor(
@@ -79,11 +79,11 @@ type EventMap = {
   fetch: FetchEvent;
   scheduled: ScheduledEvent;
 };
-export class ServiceWorkerGlobalScope extends typedEventTarget<EventMap>() {
+export class ServiceWorkerGlobalScope extends EventTarget<EventMap> {
   readonly #log: Log;
   readonly #environment: Context;
   readonly #wrappedListeners = new WeakMap<
-    EventListenerOrEventListenerObject,
+    EventTarget.EventListener<this, any>,
     EventListener
   >();
   #wrappedError?: Error;
@@ -116,44 +116,23 @@ export class ServiceWorkerGlobalScope extends typedEventTarget<EventMap>() {
     this.dispatchEvent = this.dispatchEvent.bind(this);
   }
 
-  #wrap(listener: TypedEventListener<Event> | null): EventListener | null {
+  #wrap<T extends keyof EventMap>(
+    listener?: EventTarget.EventListener<this, EventMap[T]> | null
+  ): EventTarget.CallbackFunction<this, EventMap[T]> | null | undefined {
     // When an event listener throws, we want dispatching to stop and the
     // error to be thrown so we can catch it and display a nice error page.
-    // Unfortunately, Node's event target emits uncaught exceptions when a
-    // listener throws, which are tricky to catch without breaking tests (AVA
-    // also registers an uncaught exception handler).
-    //
-    // Node 16.6.0's internal implementation contains this line to throw
-    // uncaught exceptions: `process.nextTick(() => { throw err; });`.
-    // A potential solution would be to monkey-patch `process.nextTick` and call
-    // the callback immediately:
-    //
-    // ```js
-    // const originalNextTick = process.nextTick;
-    // process.nextTick = (callback) => callback();
-    // try {
-    //   this.dispatchEvent(event);
-    // } finally {
-    //   process.nextTick = originalNextTick;
-    // }
-    // ```
-    //
-    // However, this relies on internal behaviour that may change at any point
-    // and may prevent the EventTarget from doing required clean up. Hence,
-    // we wrap event listeners instead, storing the wrapped versions in a
-    // WeakMap so they can be removed when the original listener is passed to
-    // removeEventListener.
-
+    if (listener === undefined) return undefined;
     if (listener === null) return null;
     const wrappedListeners = this.#wrappedListeners;
     let wrappedListener = wrappedListeners.get(listener);
     if (wrappedListener) return wrappedListener;
     wrappedListener = (event) => {
       try {
         if ("handleEvent" in listener) {
-          listener.handleEvent(event);
+          listener.handleEvent(event as EventMap[T]);
         } else {
-          listener(event);
+          // @ts-expect-error "this" type is definitely correct
+          listener(event as EventMap[T]);
         }
       } catch (error) {
         event.stopImmediatePropagation();
@@ -164,20 +143,20 @@ export class ServiceWorkerGlobalScope extends typedEventTarget<EventMap>() {
     return wrappedListener;
   }
 
-  addEventListener<EventType extends keyof EventMap>(
-    type: EventType,
-    listener: TypedEventListener<EventMap[EventType]> | null,
-    options?: AddEventListenerOptions | boolean
+  addEventListener<T extends keyof EventMap>(
+    type: T,
+    listener?: EventTarget.EventListener<this, EventMap[T]> | null,
+    options?: EventTarget.AddOptions | boolean
   ): void {
-    super.addEventListener(type, this.#wrap(listener as any), options);
+    super.addEventListener(type, this.#wrap(listener), options as any);
   }
 
-  removeEventListener<EventType extends keyof EventMap>(
-    type: EventType,
-    listener: TypedEventListener<EventMap[EventType]> | null,
-    options?: EventListenerOptions | boolean
+  removeEventListener<T extends string & keyof EventMap>(
+    type: T,
+    listener?: EventTarget.EventListener<this, EventMap[T]> | null,
+    options?: EventTarget.Options | boolean
   ): void {
-    super.removeEventListener(type, this.#wrap(listener as any), options);
+    super.removeEventListener(type, this.#wrap(listener), options as any);
   }
 
   dispatchEvent(event: Event): boolean {

src/modules/events.ts

@@ -1,21 +1,22 @@
 import assert from "assert";
+import { Event, EventTarget } from "event-target-shim";
 import StandardWebSocket from "ws";
-import { MiniflareError, typedEventTarget } from "../helpers";
+import { MiniflareError } from "../helpers";
 import { Context, Module } from "./module";
 
-export class MessageEvent extends Event {
+export class MessageEvent extends Event<"message"> {
   constructor(public readonly data: string) {
     super("message");
   }
 }
 
-export class CloseEvent extends Event {
+export class CloseEvent extends Event<"close"> {
   constructor(public readonly code?: number, public readonly reason?: string) {
     super("close");
   }
 }
 
-export class ErrorEvent extends Event {
+export class ErrorEvent extends Event<"error"> {
   constructor(public readonly error?: Error) {
     super("error");
   }
@@ -31,7 +32,7 @@ type EventMap = {
   close: CloseEvent;
   error: ErrorEvent;
 };
-export class WebSocket extends typedEventTarget<EventMap>() {
+export class WebSocket extends EventTarget<EventMap> {
   public static CONNECTING = 0;
   public static OPEN = 1;
   public static CLOSING = 2;
@@ -102,7 +103,6 @@ export class WebSocket extends typedEventTarget<EventMap>() {
     this.#readyState = WebSocket.CLOSING;
     pair.#readyState = WebSocket.CLOSING;
 
-    // TODO: PR Node.js lib/internal/event_target.js
     this.dispatchEvent(new CloseEvent(code, reason));
     pair.dispatchEvent(new CloseEvent(code, reason));
 

src/modules/ws.ts

@@ -9,7 +9,7 @@ import {
   ScriptTarget,
   transpileModule,
 } from "typescript";
-import { MiniflareError } from "./error";
+import { MiniflareError } from "./helpers";
 import { ProcessedModuleRule, stringScriptPath } from "./options";
 
 export function createScriptContext(sandbox: vm.Context): vm.Context {

src/scripts.ts

@@ -183,6 +183,24 @@ test("buildSandbox: adds module scheduled event listener", async (t) => {
   t.is(res[1], "30 * * * *");
   t.is(res[2], "value");
 });
+test("buildSandbox: removes event listeners", async (t) => {
+  const script = `(${(() => {
+    const sandbox = self as any;
+    const waitUntilOne = (e: FetchEvent) => {
+      e.waitUntil(Promise.resolve(1));
+    };
+    sandbox.addEventListener("fetch", waitUntilOne);
+    sandbox.addEventListener("fetch", (e: FetchEvent) => {
+      sandbox.removeEventListener("fetch", waitUntilOne);
+      e.respondWith(new sandbox.Response(e.request.url));
+    });
+  }).toString()})()`;
+  const mf = new Miniflare({ script });
+  let res = await mf.dispatchFetch(new Request("http://localhost:8787/"));
+  t.deepEqual(await res.waitUntil(), [1]);
+  res = await mf.dispatchFetch(new Request("http://localhost:8787/"));
+  t.deepEqual(await res.waitUntil(), []);
+});
 
 test("dispatchFetch: dispatches event", async (t) => {
   const { globalScope } = t.context;

src/suppress.ts

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "esnext",
-    "lib": ["esnext"],
+    "lib": ["esnext", "webworker"],
     "strict": true,
     "moduleResolution": "node",
     "esModuleInterop": true,