javascript - ¿Cómo agregar la opción passive a addEventListener en TypeScript?

quiero añadir opciones al evento scroll de un elemento en TypeScript así:

element.addEventListener("scroll", () => { }, { capture: true, passive: true });

Pero TypeScript arroja un error de sintaxis: Argument of type '{ capture: true, passive: true }' is not assignable to parameter of type 'boolean'.
Sé que la razón del error es que TypeScript no define un argumento options para addEventListener. Solo tiene el argumento useCapture. Podemos verlo en lib.dom.d.ts:

addEventListener<K extends keyof ElementEventMap>(type: K, listener: (this: Element, ev: ElementEventMap[K]) => any, useCapture?: boolean): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;

Encontré un problema abierto y una solución alternativa en GitHub, pero parece complicado y no estoy seguro de que sea correcto.
Por cierto, también quiero saber por qué TypeScript no definió el argumento options para addEventListener.

Cualquier ayuda sería apreciada. ¡Gracias!

Respuesta #1

Como una solución alternativa para situaciones como esta, siempre puedes convertir tu objeto al tipo any.

(<any>element).addEventListener("scroll", () => { }, { capture: true, passive: true });

El tipo any se usa para optar por no participar en el sistema de tipos de TypeScript. Esto significa que trabajarás con un tipo desconocido que puedes tratar de cualquier manera que quieras, sin que el compilador de TypeScript se queje.

¡Puedes leer más sobre el cualquier tipo aquí!

Respuesta #2

Dado que las interfaces en Typescript son de extremo abierto, puedes añadir funciones a la interfaz Document volviéndola a declarar en tu aplicación:

 interface Document {
    addEventListener(event: "scroll", listener: (event: Event) => void, options?: {
        passive?: boolean;
        once?: boolean;
        capture?: boolean;
      }      
  );
}

Entonces podrás usar la sobrecarga que definiste, o cualquier sobrecarga (o cualquier otro método) definido para Document en lib.d.ts:

document.addEventListener("scroll", ()=> {}, {
    capture: true,
    once: true
});

document.addEventListener("scroll", ()=> {}, true);

No puedo hablar de por qué esto no fue incluido, podría haber algunos casos extremos donde interfiera con la resolución de métodos para otras sobrecargas de addEventListener. (Nota: no probé esto extensamente, así que podrías encontrarte con este problema).