Socket
Socket
Sign inDemoInstall

event-target-shim

Package Overview
Dependencies
7
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 5.0.1 to 6.0.0

es5.d.ts

776

index.d.ts

@@ -1,399 +0,411 @@

export as namespace EventTargetShim
// Generated by dts-bundle-generator v5.5.0
/**
* `Event` interface.
* @see https://dom.spec.whatwg.org/#event
* Set the error handler.
* @param value The error handler to set.
*/
export interface Event {
/**
* The type of this event.
*/
readonly type: string
/**
* The target of this event.
*/
readonly target: EventTarget<{}, {}, "standard"> | null
/**
* The current target of this event.
*/
readonly currentTarget: EventTarget<{}, {}, "standard"> | null
/**
* The target of this event.
* @deprecated
*/
readonly srcElement: any | null
/**
* The composed path of this event.
*/
composedPath(): EventTarget<{}, {}, "standard">[]
/**
* Constant of NONE.
*/
readonly NONE: number
/**
* Constant of CAPTURING_PHASE.
*/
readonly CAPTURING_PHASE: number
/**
* Constant of BUBBLING_PHASE.
*/
readonly BUBBLING_PHASE: number
/**
* Constant of AT_TARGET.
*/
readonly AT_TARGET: number
/**
* Indicates which phase of the event flow is currently being evaluated.
*/
readonly eventPhase: number
/**
* Stop event bubbling.
*/
stopPropagation(): void
/**
* Stop event bubbling.
*/
stopImmediatePropagation(): void
/**
* Initialize event.
* @deprecated
*/
initEvent(type: string, bubbles?: boolean, cancelable?: boolean): void
/**
* The flag indicating bubbling.
*/
readonly bubbles: boolean
/**
* Stop event bubbling.
* @deprecated
*/
cancelBubble: boolean
/**
* Set or get cancellation flag.
* @deprecated
*/
returnValue: boolean
/**
* The flag indicating whether the event can be canceled.
*/
readonly cancelable: boolean
/**
* Cancel this event.
*/
preventDefault(): void
/**
* The flag to indicating whether the event was canceled.
*/
readonly defaultPrevented: boolean
/**
* The flag to indicating if event is composed.
*/
readonly composed: boolean
/**
* Indicates whether the event was dispatched by the user agent.
*/
readonly isTrusted: boolean
/**
* The unix time of this event.
*/
readonly timeStamp: number
export declare function setErrorHandler(value: setErrorHandler.ErrorHandler | undefined): void;
export declare namespace setErrorHandler {
/**
* The error handler.
* @param error The thrown error object.
*/
type ErrorHandler = (error: Error) => void;
}
/**
* The constructor of `EventTarget` interface.
* An implementation of the `EventTarget` interface.
* @see https://dom.spec.whatwg.org/#eventtarget
*/
export type EventTargetConstructor<
TEvents extends EventTarget.EventDefinition = {},
TEventAttributes extends EventTarget.EventDefinition = {},
TMode extends EventTarget.Mode = "loose"
> = {
prototype: EventTarget<TEvents, TEventAttributes, TMode>
new(): EventTarget<TEvents, TEventAttributes, TMode>
export declare class EventTarget<TEventMap extends Record<string, Event> = Record<string, Event>, TMode extends "standard" | "strict" = "standard"> {
/**
* Initialize this instance.
*/
constructor();
/**
* Add an event listener.
* @param type The event type.
* @param callback The event listener.
* @param options Options.
*/
addEventListener<T extends string & keyof TEventMap>(type: T, callback?: EventTarget.EventListener<this, TEventMap[T]> | null, options?: EventTarget.AddOptions): void;
/**
* Add an event listener.
* @param type The event type.
* @param callback The event listener.
* @param options Options.
*/
addEventListener(type: string, callback?: EventTarget.FallbackEventListener<this, TMode>, options?: EventTarget.AddOptions): void;
/**
* Add an event listener.
* @param type The event type.
* @param callback The event listener.
* @param capture The capture flag.
* @deprecated Use `{capture: boolean}` object instead of a boolean value.
*/
addEventListener<T extends string & keyof TEventMap>(type: T, callback: EventTarget.EventListener<this, TEventMap[T]> | null | undefined, capture: boolean): void;
/**
* Add an event listener.
* @param type The event type.
* @param callback The event listener.
* @param capture The capture flag.
* @deprecated Use `{capture: boolean}` object instead of a boolean value.
*/
addEventListener(type: string, callback: EventTarget.FallbackEventListener<this, TMode>, capture: boolean): void;
/**
* Remove an added event listener.
* @param type The event type.
* @param callback The event listener.
* @param options Options.
*/
removeEventListener<T extends string & keyof TEventMap>(type: T, callback?: EventTarget.EventListener<this, TEventMap[T]> | null, options?: EventTarget.Options): void;
/**
* Remove an added event listener.
* @param type The event type.
* @param callback The event listener.
* @param options Options.
*/
removeEventListener(type: string, callback?: EventTarget.FallbackEventListener<this, TMode>, options?: EventTarget.Options): void;
/**
* Remove an added event listener.
* @param type The event type.
* @param callback The event listener.
* @param capture The capture flag.
* @deprecated Use `{capture: boolean}` object instead of a boolean value.
*/
removeEventListener<T extends string & keyof TEventMap>(type: T, callback: EventTarget.EventListener<this, TEventMap[T]> | null | undefined, capture: boolean): void;
/**
* Remove an added event listener.
* @param type The event type.
* @param callback The event listener.
* @param capture The capture flag.
* @deprecated Use `{capture: boolean}` object instead of a boolean value.
*/
removeEventListener(type: string, callback: EventTarget.FallbackEventListener<this, TMode>, capture: boolean): void;
/**
* Dispatch an event.
* @param event The `Event` object to dispatch.
*/
dispatchEvent<T extends string & keyof TEventMap>(event: EventTarget.EventData<TEventMap, TMode, T>): boolean;
/**
* Dispatch an event.
* @param event The `Event` object to dispatch.
*/
dispatchEvent(event: EventTarget.FallbackEvent<TMode>): boolean;
}
export declare namespace EventTarget {
/**
* The event listener.
*/
type EventListener<TEventTarget extends EventTarget<any, any>, TEvent extends Event> = CallbackFunction<TEventTarget, TEvent> | CallbackObject<TEvent>;
/**
* The event listener function.
*/
interface CallbackFunction<TEventTarget extends EventTarget<any, any>, TEvent extends Event> {
(this: TEventTarget, event: TEvent): void;
}
/**
* The event listener object.
* @see https://dom.spec.whatwg.org/#callbackdef-eventlistener
*/
interface CallbackObject<TEvent extends Event> {
handleEvent(event: TEvent): void;
}
/**
* The common options for both `addEventListener` and `removeEventListener` methods.
* @see https://dom.spec.whatwg.org/#dictdef-eventlisteneroptions
*/
interface Options {
capture?: boolean;
}
/**
* The options for the `addEventListener` methods.
* @see https://dom.spec.whatwg.org/#dictdef-addeventlisteneroptions
*/
interface AddOptions extends Options {
passive?: boolean;
once?: boolean;
signal?: AbortSignal | null | undefined;
}
/**
* The abort signal.
* @see https://dom.spec.whatwg.org/#abortsignal
*/
interface AbortSignal extends EventTarget<{
abort: Event;
}> {
readonly aborted: boolean;
onabort: CallbackFunction<this, Event> | null;
}
/**
* The event data to dispatch in strict mode.
*/
type EventData<TEventMap extends Record<string, Event>, TMode extends "standard" | "strict", TEventType extends string> = TMode extends "strict" ? IsValidEventMap<TEventMap> extends true ? ExplicitType<TEventType> & Omit<TEventMap[TEventType], keyof Event> & Partial<Omit<Event, "type">> : never : never;
/**
* Define explicit `type` property if `T` is a string literal.
* Otherwise, never.
*/
type ExplicitType<T extends string> = string extends T ? never : {
readonly type: T;
};
/**
* The event listener type in standard mode.
* Otherwise, never.
*/
type FallbackEventListener<TEventTarget extends EventTarget<any, any>, TMode extends "standard" | "strict"> = TMode extends "standard" ? EventListener<TEventTarget, Event> | null | undefined : never;
/**
* The event type in standard mode.
* Otherwise, never.
*/
type FallbackEvent<TMode extends "standard" | "strict"> = TMode extends "standard" ? Event : never;
/**
* Check if given event map is valid.
* It's valid if the keys of the event map are narrower than `string`.
*/
type IsValidEventMap<T> = string extends keyof T ? false : true;
}
/**
* `EventTarget` interface.
* @see https://dom.spec.whatwg.org/#interface-eventtarget
* An implementation of `Event` interface, that wraps a given event object.
* `EventTarget` shim can control the internal state of this `Event` objects.
* @see https://dom.spec.whatwg.org/#event
*/
export type EventTarget<
TEvents extends EventTarget.EventDefinition = {},
TEventAttributes extends EventTarget.EventDefinition = {},
TMode extends EventTarget.Mode = "loose"
> = EventTarget.EventAttributes<TEventAttributes> & {
/**
* Add a given listener to this event target.
* @param eventName The event name to add.
* @param listener The listener to add.
* @param options The options for this listener.
*/
addEventListener<TEventType extends EventTarget.EventType<TEvents, TMode>>(
type: TEventType,
listener:
| EventTarget.Listener<EventTarget.PickEvent<TEvents, TEventType>>
| null,
options?: boolean | EventTarget.AddOptions
): void
/**
* Remove a given listener from this event target.
* @param eventName The event name to remove.
* @param listener The listener to remove.
* @param options The options for this listener.
*/
removeEventListener<TEventType extends EventTarget.EventType<TEvents, TMode>>(
type: TEventType,
listener:
| EventTarget.Listener<EventTarget.PickEvent<TEvents, TEventType>>
| null,
options?: boolean | EventTarget.RemoveOptions
): void
/**
* Dispatch a given event.
* @param event The event to dispatch.
* @returns `false` if canceled.
*/
dispatchEvent<TEventType extends EventTarget.EventType<TEvents, TMode>>(
event: EventTarget.EventData<TEvents, TEventType, TMode>
): boolean
export declare class Event<TEventType extends string = string> {
/**
* @see https://dom.spec.whatwg.org/#dom-event-none
*/
static get NONE(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-capturing_phase
*/
static get CAPTURING_PHASE(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-at_target
*/
static get AT_TARGET(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-bubbling_phase
*/
static get BUBBLING_PHASE(): number;
/**
* Initialize this event instance.
* @param type The type of this event.
* @param eventInitDict Options to initialize.
* @see https://dom.spec.whatwg.org/#dom-event-event
*/
constructor(type: TEventType, eventInitDict?: Event.EventInit);
/**
* The type of this event.
* @see https://dom.spec.whatwg.org/#dom-event-type
*/
get type(): TEventType;
/**
* The event target of the current dispatching.
* @see https://dom.spec.whatwg.org/#dom-event-target
*/
get target(): EventTarget | null;
/**
* The event target of the current dispatching.
* @deprecated Use the `target` property instead.
* @see https://dom.spec.whatwg.org/#dom-event-srcelement
*/
get srcElement(): EventTarget | null;
/**
* The event target of the current dispatching.
* @see https://dom.spec.whatwg.org/#dom-event-currenttarget
*/
get currentTarget(): EventTarget | null;
/**
* The event target of the current dispatching.
* This doesn't support node tree.
* @see https://dom.spec.whatwg.org/#dom-event-composedpath
*/
composedPath(): EventTarget[];
/**
* @see https://dom.spec.whatwg.org/#dom-event-none
*/
get NONE(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-capturing_phase
*/
get CAPTURING_PHASE(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-at_target
*/
get AT_TARGET(): number;
/**
* @see https://dom.spec.whatwg.org/#dom-event-bubbling_phase
*/
get BUBBLING_PHASE(): number;
/**
* The current event phase.
* @see https://dom.spec.whatwg.org/#dom-event-eventphase
*/
get eventPhase(): number;
/**
* Stop event bubbling.
* Because this shim doesn't support node tree, this merely changes the `cancelBubble` property value.
* @see https://dom.spec.whatwg.org/#dom-event-stoppropagation
*/
stopPropagation(): void;
/**
* `true` if event bubbling was stopped.
* @deprecated
* @see https://dom.spec.whatwg.org/#dom-event-cancelbubble
*/
get cancelBubble(): boolean;
/**
* Stop event bubbling if `true` is set.
* @deprecated Use the `stopPropagation()` method instead.
* @see https://dom.spec.whatwg.org/#dom-event-cancelbubble
*/
set cancelBubble(value: boolean);
/**
* Stop event bubbling and subsequent event listener callings.
* @see https://dom.spec.whatwg.org/#dom-event-stopimmediatepropagation
*/
stopImmediatePropagation(): void;
/**
* `true` if this event will bubble.
* @see https://dom.spec.whatwg.org/#dom-event-bubbles
*/
get bubbles(): boolean;
/**
* `true` if this event can be canceled by the `preventDefault()` method.
* @see https://dom.spec.whatwg.org/#dom-event-cancelable
*/
get cancelable(): boolean;
/**
* `true` if the default behavior will act.
* @deprecated Use the `defaultPrevented` proeprty instead.
* @see https://dom.spec.whatwg.org/#dom-event-returnvalue
*/
get returnValue(): boolean;
/**
* Cancel the default behavior if `false` is set.
* @deprecated Use the `preventDefault()` method instead.
* @see https://dom.spec.whatwg.org/#dom-event-returnvalue
*/
set returnValue(value: boolean);
/**
* Cancel the default behavior.
* @see https://dom.spec.whatwg.org/#dom-event-preventdefault
*/
preventDefault(): void;
/**
* `true` if the default behavior was canceled.
* @see https://dom.spec.whatwg.org/#dom-event-defaultprevented
*/
get defaultPrevented(): boolean;
/**
* @see https://dom.spec.whatwg.org/#dom-event-composed
*/
get composed(): boolean;
/**
* @see https://dom.spec.whatwg.org/#dom-event-istrusted
*/
get isTrusted(): boolean;
/**
* @see https://dom.spec.whatwg.org/#dom-event-timestamp
*/
get timeStamp(): number;
/**
* @deprecated Don't use this method. The constructor did initialization.
*/
initEvent(type: string, bubbles?: boolean, cancelable?: boolean): void;
}
export const EventTarget: EventTargetConstructor & {
/**
* Create an `EventTarget` instance with detailed event definition.
*
* The detailed event definition requires to use `defineEventAttribute()`
* function later.
*
* Unfortunately, the second type parameter `TEventAttributes` was needed
* because we cannot compute string literal types.
*
* @example
* const signal = new EventTarget<{ abort: Event }, { onabort: Event }>()
* defineEventAttribute(signal, "abort")
*/
new <
TEvents extends EventTarget.EventDefinition,
TEventAttributes extends EventTarget.EventDefinition,
TMode extends EventTarget.Mode = "loose"
>(): EventTarget<TEvents, TEventAttributes, TMode>
/**
* Define an `EventTarget` constructor with attribute events and detailed event definition.
*
* Unfortunately, the second type parameter `TEventAttributes` was needed
* because we cannot compute string literal types.
*
* @example
* class AbortSignal extends EventTarget<{ abort: Event }, { onabort: Event }>("abort") {
* abort(): void {}
* }
*
* @param events Optional event attributes (e.g. passing in `"click"` adds `onclick` to prototype).
*/
<
TEvents extends EventTarget.EventDefinition = {},
TEventAttributes extends EventTarget.EventDefinition = {},
TMode extends EventTarget.Mode = "loose"
>(events: string[]): EventTargetConstructor<
TEvents,
TEventAttributes,
TMode
>
/**
* Define an `EventTarget` constructor with attribute events and detailed event definition.
*
* Unfortunately, the second type parameter `TEventAttributes` was needed
* because we cannot compute string literal types.
*
* @example
* class AbortSignal extends EventTarget<{ abort: Event }, { onabort: Event }>("abort") {
* abort(): void {}
* }
*
* @param events Optional event attributes (e.g. passing in `"click"` adds `onclick` to prototype).
*/
<
TEvents extends EventTarget.EventDefinition = {},
TEventAttributes extends EventTarget.EventDefinition = {},
TMode extends EventTarget.Mode = "loose"
>(event0: string, ...events: string[]): EventTargetConstructor<
TEvents,
TEventAttributes,
TMode
>
export declare namespace Event {
/**
* The options of the `Event` constructor.
* @see https://dom.spec.whatwg.org/#dictdef-eventinit
*/
interface EventInit {
bubbles?: boolean;
cancelable?: boolean;
composed?: boolean;
}
}
export namespace EventTarget {
/**
* Options of `removeEventListener()` method.
*/
export interface RemoveOptions {
/**
* The flag to indicate that the listener is for the capturing phase.
*/
capture?: boolean
}
/**
* Options of `addEventListener()` method.
*/
export interface AddOptions extends RemoveOptions {
/**
* The flag to indicate that the listener doesn't support
* `event.preventDefault()` operation.
*/
passive?: boolean
/**
* The flag to indicate that the listener will be removed on the first
* event.
*/
once?: boolean
}
/**
* The type of regular listeners.
*/
export interface FunctionListener<TEvent> {
(event: TEvent): void
}
/**
* The type of object listeners.
*/
export interface ObjectListener<TEvent> {
handleEvent(event: TEvent): void
}
/**
* The type of listeners.
*/
export type Listener<TEvent> =
| FunctionListener<TEvent>
| ObjectListener<TEvent>
/**
* Event definition.
*/
export type EventDefinition = {
readonly [key: string]: Event
}
/**
* Mapped type for event attributes.
*/
export type EventAttributes<TEventAttributes extends EventDefinition> = {
[P in keyof TEventAttributes]:
| FunctionListener<TEventAttributes[P]>
| null
}
/**
* The type of event data for `dispatchEvent()` method.
*/
export type EventData<
TEvents extends EventDefinition,
TEventType extends keyof TEvents | string,
TMode extends Mode
> =
TEventType extends keyof TEvents
? (
// Require properties which are not generated automatically.
& Pick<
TEvents[TEventType],
Exclude<keyof TEvents[TEventType], OmittableEventKeys>
>
// Properties which are generated automatically are optional.
& Partial<Pick<Event, OmittableEventKeys>>
)
: (
TMode extends "standard"
? Event
: Event | NonStandardEvent
)
/**
* The string literal types of the properties which are generated
* automatically in `dispatchEvent()` method.
*/
export type OmittableEventKeys = Exclude<keyof Event, "type">
/**
* The type of event data.
*/
export type NonStandardEvent = {
[key: string]: any
type: string
}
/**
* The type of listeners.
*/
export type PickEvent<
TEvents extends EventDefinition,
TEventType extends keyof TEvents | string,
> =
TEventType extends keyof TEvents
? TEvents[TEventType]
: Event
/**
* Event type candidates.
*/
export type EventType<
TEvents extends EventDefinition,
TMode extends Mode
> =
TMode extends "strict"
? keyof TEvents
: keyof TEvents | string
/**
* - `"strict"` ..... Methods don't accept unknown events.
* `dispatchEvent()` accepts partial objects.
* - `"loose"` ...... Methods accept unknown events.
* `dispatchEvent()` accepts partial objects.
* - `"standard"` ... Methods accept unknown events.
* `dispatchEvent()` doesn't accept partial objects.
*/
export type Mode = "strict" | "standard" | "loose"
/**
* Get the current value of a given event attribute.
* @param target The `EventTarget` object to get.
* @param type The event type.
*/
export declare function getEventAttributeValue<TEventTarget extends EventTarget<any, any>, TEvent extends Event>(target: TEventTarget, type: string): EventTarget.CallbackFunction<TEventTarget, TEvent> | null;
/**
* Set an event listener to a given event attribute.
* @param target The `EventTarget` object to set.
* @param type The event type.
* @param callback The event listener.
*/
export declare function setEventAttributeValue(target: EventTarget<any, any>, type: string, callback: EventTarget.CallbackFunction<any, any> | null): void;
/**
* Define an `EventTarget` class that has event attibutes.
* @param types The types to define event attributes.
* @deprecated Use `getEventAttributeValue`/`setEventAttributeValue` pair on your derived class instead because of static analysis friendly.
*/
export declare function defineCustomEventTarget<TEventMap extends Record<string, Event>, TMode extends "standard" | "strict" = "standard">(...types: (string & keyof TEventMap)[]): defineCustomEventTarget.CustomEventTargetConstructor<TEventMap, TMode>;
export declare namespace defineCustomEventTarget {
/**
* The interface of CustomEventTarget constructor.
*/
type CustomEventTargetConstructor<TEventMap extends Record<string, Event>, TMode extends "standard" | "strict"> = {
/**
* Create a new instance.
*/
new (): CustomEventTarget<TEventMap, TMode>;
/**
* prototype object.
*/
prototype: CustomEventTarget<TEventMap, TMode>;
};
/**
* The interface of CustomEventTarget.
*/
type CustomEventTarget<TEventMap extends Record<string, Event>, TMode extends "standard" | "strict"> = EventTarget<TEventMap, TMode> & defineEventAttribute.EventAttributes<any, TEventMap>;
}
/**
* Specialized `type` property.
* Define an event attribute.
* @param target The `EventTarget` object to define an event attribute.
* @param type The event type to define.
* @param _eventClass Unused, but to infer `Event` class type.
* @deprecated Use `getEventAttributeValue`/`setEventAttributeValue` pair on your derived class instead because of static analysis friendly.
*/
export type Type<T extends string> = { type: T }
export declare function defineEventAttribute<TEventTarget extends EventTarget, TEventType extends string, TEventConstrucor extends typeof Event>(target: TEventTarget, type: TEventType, _eventClass?: TEventConstrucor): asserts target is TEventTarget & defineEventAttribute.EventAttributes<TEventTarget, Record<TEventType, InstanceType<TEventConstrucor>>>;
export declare namespace defineEventAttribute {
/**
* Definition of event attributes.
*/
type EventAttributes<TEventTarget extends EventTarget<any, any>, TEventMap extends Record<string, Event>> = {
[P in string & keyof TEventMap as `on${P}`]: EventTarget.CallbackFunction<TEventTarget, TEventMap[P]> | null;
};
}
/**
* Define an event attribute (e.g. `eventTarget.onclick`).
* @param prototype The event target prototype to define an event attribute.
* @param eventName The event name to define.
* Set the warning handler.
* @param value The warning handler to set.
*/
export function defineEventAttribute(
prototype: EventTarget,
eventName: string
): void
export declare function setWarningHandler(value: setWarningHandler.WarningHandler | undefined): void;
export declare namespace setWarningHandler {
/**
* The warning information.
*/
interface Warning {
/**
* The code of this warning.
*/
code: string;
/**
* The message in English.
*/
message: string;
/**
* The arguments for replacing placeholders in the text.
*/
args: any[];
}
/**
* The warning handler.
* @param warning The warning.
*/
type WarningHandler = (warning: Warning) => void;
}
export default EventTarget;
export default EventTarget
export {};
{
"name": "event-target-shim",
"version": "5.0.1",
"version": "6.0.0",
"description": "An implementation of WHATWG EventTarget interface.",
"main": "dist/event-target-shim",
"types": "index.d.ts",
"main": "index.js",
"exports": {
".": {
"import": "./index.mjs",
"require": "./index.js"
},
"./es5": {
"import": "./es5.mjs",
"require": "./es5.js"
},
"./umd": "./umd.js",
"./package.json": "./package.json"
},
"files": [
"dist",
"index.d.ts"
"index.*",
"es5.*",
"umd.*"
],
"engines": {
"node": ">=6"
"node": ">=10.13.0"
},
"scripts": {
"build": "run-s \"build:{clean,rollup,dts,meta}\"",
"build:clean": "rimraf \"dist/*\"",
"build:rollup": "rollup --config scripts/rollup.config.js",
"build:dts": "dts-bundle-generator --project tsconfig/dts.json --out-file dist/index.d.ts src/index.ts && dts-bundle-generator --project tsconfig/dts.json --out-file dist/es5.d.ts src/index.ts",
"build:meta": "cpx \"{LICENSE,package.json,README.md}\" dist/",
"preversion": "npm test",
"version": "npm run build && git add dist/*",
"postversion": "git push && git push --tags",
"clean": "rimraf .nyc_output coverage",
"coverage": "nyc report --reporter lcov && opener coverage/lcov-report/index.html",
"lint": "eslint src test scripts --ext .js,.mjs",
"build": "rollup -c scripts/rollup.config.js",
"pretest": "npm run lint",
"test": "run-s test:*",
"test:mocha": "nyc --require ./scripts/babel-register mocha test/*.mjs",
"test:karma": "karma start scripts/karma.conf.js --single-run",
"watch": "run-p watch:*",
"watch:mocha": "mocha test/*.mjs --require ./scripts/babel-register --watch --watch-extensions js,mjs --growl",
"watch:karma": "karma start scripts/karma.conf.js --watch",
"codecov": "codecov"
"version": "npm run build",
"postversion": "release",
"test": "run-s \"test:{clean,tsc,lint,format,mocha}\"",
"test:clean": "rimraf \"coverage/*\"",
"test:tsc": "tsc -p tsconfig/build.json --noEmit",
"test:lint": "eslint .",
"test:format": "prettier --check .",
"test:mocha": "ts-node scripts/test",
"watch:mocha": "mocha --require ts-node/register/transpile-only --extensions ts --watch-files src,test --watch \"test/*.ts\""
},
"dependencies": {
"@types/rimraf": "^3.0.0",
"domexception": "^2.0.1"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/plugin-transform-modules-commonjs": "^7.2.0",
"@babel/preset-env": "^7.2.3",
"@babel/register": "^7.0.0",
"@mysticatea/eslint-plugin": "^8.0.1",
"@babel/core": "^7.12.10",
"@babel/plugin-transform-runtime": "^7.12.10",
"@babel/preset-env": "^7.12.11",
"@mysticatea/eslint-plugin": "^13.0.0",
"@mysticatea/spy": "^0.1.2",
"assert": "^1.4.1",
"codecov": "^3.1.0",
"eslint": "^5.12.1",
"karma": "^3.1.4",
"karma-chrome-launcher": "^2.2.0",
"karma-coverage": "^1.1.2",
"karma-firefox-launcher": "^1.0.0",
"karma-growl-reporter": "^1.0.0",
"karma-ie-launcher": "^1.0.0",
"karma-mocha": "^1.3.0",
"karma-rollup-preprocessor": "^7.0.0-rc.2",
"mocha": "^5.2.0",
"@mysticatea/tools": "^0.1.1",
"@rollup/plugin-babel": "^5.2.2",
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-json": "^4.1.0",
"@rollup/plugin-node-resolve": "^11.0.1",
"@rollup/plugin-typescript": "^8.1.0",
"@types/domexception": "^2.0.1",
"@types/istanbul-lib-coverage": "^2.0.3",
"@types/istanbul-lib-report": "^3.0.0",
"@types/istanbul-lib-source-maps": "^4.0.1",
"@types/istanbul-reports": "^3.0.0",
"@types/mocha": "^8.2.0",
"assert": "^2.0.0",
"babel-loader": "^8.2.2",
"babel-plugin-istanbul": "^6.0.0",
"buffer": "^6.0.3",
"chalk": "^4.1.0",
"codecov": "^3.8.1",
"cpx": "^1.5.0",
"dts-bundle-generator": "^5.5.0",
"eslint": "^7.15.0",
"istanbul-lib-coverage": "^3.0.0",
"istanbul-lib-report": "^3.0.0",
"istanbul-lib-source-maps": "^4.0.0",
"istanbul-reports": "^3.0.2",
"mocha": "^7.2.0",
"npm-run-all": "^4.1.5",
"nyc": "^13.1.0",
"opener": "^1.5.1",
"rimraf": "^2.6.3",
"rollup": "^1.1.1",
"rollup-plugin-babel": "^4.3.2",
"rollup-plugin-babel-minify": "^7.0.0",
"rollup-plugin-commonjs": "^9.2.0",
"rollup-plugin-json": "^3.1.0",
"rollup-plugin-node-resolve": "^4.0.0",
"path-browserify": "^1.0.1",
"playwright": "^1.7.0",
"prettier": "~2.2.1",
"process": "^0.11.10",
"rimraf": "^3.0.2",
"rollup": "^2.35.1",
"rollup-plugin-terser": "^7.0.2",
"rollup-watch": "^4.3.1",
"type-tester": "^1.0.0",
"typescript": "^3.2.4"
"stream-browserify": "^3.0.0",
"ts-loader": "^8.0.12",
"ts-node": "^9.1.1",
"tslib": "^2.0.3",
"typescript": "~4.1.3",
"url": "^0.11.0",
"util": "^0.12.3",
"webpack": "^5.11.0"
},

@@ -81,3 +114,6 @@ "repository": {

},
"homepage": "https://github.com/mysticatea/event-target-shim"
"homepage": "https://github.com/mysticatea/event-target-shim",
"funding": "https://github.com/sponsors/mysticatea",
"sideEffects": false,
"unpkg": "umd.js"
}

@@ -5,31 +5,16 @@ # event-target-shim

[![Downloads/month](https://img.shields.io/npm/dm/event-target-shim.svg)](http://www.npmtrends.com/event-target-shim)
[![Build Status](https://travis-ci.org/mysticatea/event-target-shim.svg?branch=master)](https://travis-ci.org/mysticatea/event-target-shim)
[![Build Status](https://github.com/mysticatea/event-target-shim/workflows/CI/badge.svg)](https://github.com/mysticatea/event-target-shim/actions)
[![Coverage Status](https://codecov.io/gh/mysticatea/event-target-shim/branch/master/graph/badge.svg)](https://codecov.io/gh/mysticatea/event-target-shim)
[![Dependency Status](https://david-dm.org/mysticatea/event-target-shim.svg)](https://david-dm.org/mysticatea/event-target-shim)
An implementation of [WHATWG EventTarget interface](https://dom.spec.whatwg.org/#interface-eventtarget), plus few extensions.
An implementation of [WHATWG `EventTarget` interface](https://dom.spec.whatwg.org/#interface-eventtarget) and [WHATWG `Event` interface](https://dom.spec.whatwg.org/#interface-event). This implementation supports constructor, `passive`, `once`, and `signal`.
- This provides `EventTarget` constructor that can inherit for your custom object.
- This provides an utility that defines properties of attribute listeners (e.g. `obj.onclick`).
This implementation is designed ...
```js
import {EventTarget, defineEventAttribute} from "event-target-shim"
- Working fine on both browsers and Node.js.
- TypeScript friendly.
class Foo extends EventTarget {
// ...
}
// Define `foo.onhello` property.
defineEventAttribute(Foo.prototype, "hello")
// Use
const foo = new Foo()
foo.addEventListener("hello", e => console.log("hello", e))
foo.onhello = e => console.log("onhello:", e)
foo.dispatchEvent(new CustomEvent("hello"))
```
## 💿 Installation
Use [npm](https://www.npmjs.com/) to install then use a bundler.
Use [npm](https://www.npmjs.com/) or a compatible tool.

@@ -40,241 +25,44 @@ ```

Or download from [`dist` directory](./dist).
## 📖 Getting started
- [dist/event-target-shim.mjs](dist/event-target-shim.mjs) ... ES modules version.
- [dist/event-target-shim.js](dist/event-target-shim.js) ... Common JS version.
- [dist/event-target-shim.umd.js](dist/event-target-shim.umd.js) ... UMD (Universal Module Definition) version. This is transpiled by [Babel](https://babeljs.io/) for IE 11.
## 📖 Usage
```js
import {EventTarget, defineEventAttribute} from "event-target-shim"
// or
const {EventTarget, defineEventAttribute} = require("event-target-shim")
import { EventTarget, Event } from "event-target-shim";
// or UMD version defines a global variable:
const {EventTarget, defineEventAttribute} = window.EventTargetShim
```
// constructor (was added to the standard on 8 Jul 2017)
const myNode = new EventTarget();
### EventTarget
// passive flag (was added to the standard on 6 Jan 2016)
myNode.addEventListener(
"hello",
(e) => {
e.preventDefault(); // ignored and print warning on console.
},
{ passive: true }
);
> https://dom.spec.whatwg.org/#interface-eventtarget
// once flag (was added to the standard on 15 Apr 2016)
myNode.addEventListener("hello", listener, { once: true });
myNode.dispatchEvent(new Event("hello")); // remove the listener after call.
#### eventTarget.addEventListener(type, callback, options)
Register an event listener.
- `type` is a string. This is the event name to register.
- `callback` is a function. This is the event listener to register.
- `options` is a boolean or an object `{ capture?: boolean, passive?: boolean, once?: boolean }`. If this is a boolean, it's same meaning as `{ capture: options }`.
- `capture` is the flag to register the event listener for capture phase.
- `passive` is the flag to ignore `event.preventDefault()` method in the event listener.
- `once` is the flag to remove the event listener automatically after the first call.
#### eventTarget.removeEventListener(type, callback, options)
Unregister an event listener.
- `type` is a string. This is the event name to unregister.
- `callback` is a function. This is the event listener to unregister.
- `options` is a boolean or an object `{ capture?: boolean }`. If this is a boolean, it's same meaning as `{ capture: options }`.
- `capture` is the flag to register the event listener for capture phase.
#### eventTarget.dispatchEvent(event)
Dispatch an event.
- `event` is a [Event](https://dom.spec.whatwg.org/#event) object or an object `{ type: string, [key: string]: any }`. The latter is non-standard but useful. In both cases, listeners receive the event as implementing [Event](https://dom.spec.whatwg.org/#event) interface.
### defineEventAttribute(proto, type)
Define an event attribute (e.g. `onclick`) to `proto`. This is non-standard.
- `proto` is an object (assuming it's a prototype object). This function defines a getter/setter pair for the event attribute.
- `type` is a string. This is the event name to define.
For example:
```js
class AbortSignal extends EventTarget {
constructor() {
this.aborted = false
}
}
// Define `onabort` property.
defineEventAttribute(AbortSignal.prototype, "abort")
// signal (was added to the standard on 4 Dec 2020)
const ac = new AbortController();
myNode.addEventListener("hello", listener, { signal: ac.signal });
ac.abort(); // remove the listener.
```
### EventTarget(types)
- For browsers, use a bundler such as [Webpack](https://webpack.js.org/) to bundle.
- If you want to support IE11, use `import {} from "event-target-shim/es5"` instead. It's a transpiled code by babel. It depends on `@baebl/runtime` package.
- The `AbortController` class was added to the standard on 14 Jul 2017. If you want the shim of that, use [abort-controller](https://www.npmjs.com/package/abort-controller) package.
Define a custom `EventTarget` class with event attributes. This is non-standard.
## 📚 API Reference
- `types` is a string or an array of strings. This is the event name to define.
See [docs/reference.md](docs/reference.md).
For example:
## 💥 Migrating to v6
```js
// This has `onabort` property.
class AbortSignal extends EventTarget("abort") {
constructor() {
this.aborted = false
}
}
```
See [docs/migrating-to-v6.md](docs/migrating-to-v6.md).
## 📚 Examples
### ES2015 and later
> https://jsfiddle.net/636vea92/
```js
const {EventTarget, defineEventAttribute} = EventTargetShim
// Define a derived class.
class Foo extends EventTarget {
// ...
}
// Define `foo.onhello` property.
defineEventAttribute(Foo.prototype, "hello")
// Register event listeners.
const foo = new Foo()
foo.addEventListener("hello", (e) => {
console.log("hello", e)
})
foo.onhello = (e) => {
console.log("onhello", e)
}
// Dispatching events
foo.dispatchEvent(new CustomEvent("hello", { detail: "detail" }))
```
### Typescript
```ts
import { EventTarget, defineEventAttribute } from "event-target-shim";
// Define events
type FooEvents = {
hello: CustomEvent
}
type FooEventAttributes = {
onhello: CustomEvent
}
// Define a derived class.
class Foo extends EventTarget<FooEvents, FooEventAttributes> {
// ...
}
// Define `foo.onhello` property's implementation.
defineEventAttribute(Foo.prototype, "hello")
// Register event listeners.
const foo = new Foo()
foo.addEventListener("hello", (e) => {
console.log("hello", e.detail)
})
foo.onhello = (e) => {
console.log("onhello", e.detail)
}
// Dispatching events
foo.dispatchEvent(new CustomEvent("hello", { detail: "detail" }))
```
Unfortunately, both `FooEvents` and `FooEventAttributes` are needed because TypeScript doesn't allow the mutation of string literal types. If TypeScript allowed us to compute `"onhello"` from `"hello"` in types, `FooEventAttributes` will be optional.
This `EventTarget` type is compatible with `EventTarget` interface of `lib.dom.d.ts`.
#### To disallow unknown events
By default, methods such as `addEventListener` accept unknown events. You can disallow unknown events by the third type parameter `"strict"`.
```ts
type FooEvents = {
hello: CustomEvent
}
class Foo extends EventTarget<FooEvents, {}, "strict"> {
// ...
}
// OK because `hello` is defined in FooEvents.
foo.addEventListener("hello", (e) => {
})
// Error because `unknown` is not defined in FooEvents.
foo.addEventListener("unknown", (e) => {
})
```
However, if you use `"strict"` parameter, it loses compatibility with `EventTarget` interface of `lib.dom.d.ts`.
#### To infer the type of `dispatchEvent()` method
TypeScript cannot infer the event type of `dispatchEvent()` method properly from the argument in most cases. You can improve this behavior with the following steps:
1. Use the third type parameter `"strict"`. This prevents inferring to `dispatchEvent<string>()`.
2. Make the `type` property of event definitions stricter.
```ts
type FooEvents = {
hello: CustomEvent & { type: "hello" }
hey: Event & { type: "hey" }
}
class Foo extends EventTarget<FooEvents, {}, "strict"> {
// ...
}
// Error because `detail` property is lacking.
foo.dispatchEvent({ type: "hello" })
```
### ES5
> https://jsfiddle.net/522zc9de/
```js
// Define a derived class.
function Foo() {
EventTarget.call(this)
}
Foo.prototype = Object.create(EventTarget.prototype, {
constructor: { value: Foo, configurable: true, writable: true }
// ...
})
// Define `foo.onhello` property.
defineEventAttribute(Foo.prototype, "hello")
// Register event listeners.
var foo = new Foo()
foo.addEventListener("hello", function(e) {
console.log("hello", e)
})
foo.onhello = function(e) {
console.log("onhello", e)
}
// Dispatching events
function isSupportEventConstrucor() { // IE does not support.
try {
new CusomEvent("hello")
return true
} catch (_err) {
return false
}
}
if (isSupportEventConstrucor()) {
foo.dispatchEvent(new CustomEvent("hello", { detail: "detail" }))
} else {
var e = document.createEvent("CustomEvent")
e.initCustomEvent("hello", false, false, "detail")
foo.dispatchEvent(e)
}
```
## 📰 Changelog
- See [GitHub releases](https://github.com/mysticatea/event-target-shim/releases).
See [GitHub releases](https://github.com/mysticatea/event-target-shim/releases).

@@ -291,6 +79,2 @@ ## 🍻 Contributing

- `npm test` runs tests and measures code coverage.
- `npm run clean` removes temporary files of tests.
- `npm run coverage` opens code coverage of the previous test with your default browser.
- `npm run lint` runs ESLint.
- `npm run build` generates `dist` codes.
- `npm run watch` runs tests on each file change.
- `npm run watch:mocha` runs tests on each file change.
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc