Fix naja global variable and allow async listeners (#39214)

* Add types for naja

* Follow PR rules

* Change interface name

* Extend EventTarget

* Include all event types in map

* Improve events typing

* Add naja options interface

* Make options readonly

* Add more accurate typings

* Update signatures

* Update global variable name and allow async listeners

* Move namespace export
This commit is contained in:
Vít Rozsíval 2019-10-17 23:26:07 +02:00 committed by Andrew Branch
parent 15427d3ec8
commit a7076f988e
2 changed files with 26 additions and 12 deletions

25
types/naja/index.d.ts vendored
View File

@ -4,8 +4,6 @@
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 3.5
export as namespace Naja;
interface FormsHandler {
netteForms: object;
initForms(element: Element): void;
@ -39,9 +37,9 @@ export interface SnippetUpdateEvent extends Event {
readonly snippet: HTMLElement;
}
export type SnippetUpdateListener = (
event: SnippetUpdateEvent,
) => void | { handleEvent(event: SnippetUpdateEvent): void };
export type SnippetUpdateListener =
| ((event: SnippetUpdateEvent) => Promise<void> | void)
| { handleEvent(event: SnippetUpdateEvent): Promise<void> | void };
interface SnippetListeners {
afterUpdate: SnippetUpdateListener;
@ -128,7 +126,9 @@ export interface CompleteEvent<T extends object = any> extends Event {
readonly options: Readonly<NajaOptions>;
}
export type NajaEventListener<T extends Event = Event> = (event: T) => void | { handleEvent(event: T): void };
export type NajaEventListener<T extends Event = Event> =
| ((event: T) => Promise<void> | void)
| { handleEvent(event: T): Promise<void> | void };
interface NajaEventsMap {
init: NajaEventListener<InitEvent>;
@ -148,9 +148,9 @@ interface NajaEventTarget extends EventTarget {
listener: NajaEventsMap[K],
options?: boolean | AddEventListenerOptions,
): void;
addEventListener(
type: string,
listener: EventListenerOrEventListenerObject | null,
addEventListener<T extends Event>(
type: T['type'],
listener: NajaEventListener<T>,
options?: boolean | AddEventListenerOptions,
): void;
removeEventListener<K extends keyof NajaEventsMap>(
@ -158,9 +158,9 @@ interface NajaEventTarget extends EventTarget {
listener: NajaEventsMap[K],
options?: boolean | AddEventListenerOptions,
): void;
removeEventListener(
type: string,
listener: EventListenerOrEventListenerObject | null,
removeEventListener<T extends Event>(
type: T['type'],
listener: NajaEventListener<T>,
options?: boolean | AddEventListenerOptions,
): void;
}
@ -183,3 +183,4 @@ export interface Naja extends NajaEventTarget {
declare const naja: Naja;
export default naja;
export as namespace naja;

View File

@ -57,9 +57,22 @@ naja.addEventListener('complete', completeListener);
naja.removeEventListener('start', genericListener);
naja.snippetHandler.removeEventListener('beforeUpdate', null);
type TestEvent = CustomEvent<{ customProperty: string }>;
interface OtherEvent extends Event {
otherProperty: number;
type: 'otherEvent';
}
const handler = (event: TestEvent): void => console.log(typeof event.detail.customProperty === 'string');
document.addEventListener('DOMContentLoaded', () => {
naja.initialize();
naja.initialize({ history: false, selector: '[data-ajax]', customOption: 1 });
naja.fireEvent('customEvent', { extra: 1 });
naja.fireEvent('anotherEvent');
naja.addEventListener<TestEvent>('testEvent', handler);
naja.addEventListener('someEvent', event => console.log(event.target));
naja.removeEventListener('testEvent', handler);
naja.removeEventListener('someEvent', event => {});
naja.addEventListener<OtherEvent>('otherEvent', event => console.log(event.otherProperty === 1));
});