2020-01-02 15:13:47 -05:00
|
|
|
// Copyright 2018-2020 the Deno authors. All rights reserved. MIT license.
|
2019-01-05 10:02:44 -05:00
|
|
|
|
2020-07-08 05:26:39 -04:00
|
|
|
import type * as domTypes from "./dom_types.d.ts";
|
2020-04-11 11:42:02 -04:00
|
|
|
import { defineEnumerableProps, requiredArguments } from "./util.ts";
|
|
|
|
import { assert } from "../util.ts";
|
|
|
|
|
|
|
|
/** Stores a non-accessible view of the event path which is used internally in
|
|
|
|
* the logic for determining the path of an event. */
|
|
|
|
export interface EventPath {
|
|
|
|
item: EventTarget;
|
|
|
|
itemInShadowTree: boolean;
|
|
|
|
relatedTarget: EventTarget | null;
|
|
|
|
rootOfClosedTree: boolean;
|
|
|
|
slotInClosedTree: boolean;
|
|
|
|
target: EventTarget | null;
|
|
|
|
touchTargetList: EventTarget[];
|
|
|
|
}
|
|
|
|
|
|
|
|
interface EventAttributes {
|
|
|
|
type: string;
|
|
|
|
bubbles: boolean;
|
|
|
|
cancelable: boolean;
|
|
|
|
composed: boolean;
|
|
|
|
currentTarget: EventTarget | null;
|
|
|
|
eventPhase: number;
|
|
|
|
target: EventTarget | null;
|
|
|
|
timeStamp: number;
|
|
|
|
}
|
|
|
|
|
|
|
|
interface EventData {
|
|
|
|
dispatched: boolean;
|
|
|
|
inPassiveListener: boolean;
|
|
|
|
isTrusted: boolean;
|
|
|
|
path: EventPath[];
|
|
|
|
stopImmediatePropagation: boolean;
|
|
|
|
}
|
|
|
|
|
|
|
|
const eventData = new WeakMap<Event, EventData>();
|
|
|
|
|
|
|
|
// accessors for non runtime visible data
|
|
|
|
|
|
|
|
export function getDispatched(event: Event): boolean {
|
|
|
|
return Boolean(eventData.get(event)?.dispatched);
|
|
|
|
}
|
|
|
|
|
|
|
|
export function getPath(event: Event): EventPath[] {
|
|
|
|
return eventData.get(event)?.path ?? [];
|
|
|
|
}
|
|
|
|
|
|
|
|
export function getStopImmediatePropagation(event: Event): boolean {
|
|
|
|
return Boolean(eventData.get(event)?.stopImmediatePropagation);
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setCurrentTarget(
|
|
|
|
event: Event,
|
|
|
|
value: EventTarget | null
|
|
|
|
): void {
|
|
|
|
(event as EventImpl).currentTarget = value;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setDispatched(event: Event, value: boolean): void {
|
|
|
|
const data = eventData.get(event as Event);
|
|
|
|
if (data) {
|
|
|
|
data.dispatched = value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setEventPhase(event: Event, value: number): void {
|
|
|
|
(event as EventImpl).eventPhase = value;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setInPassiveListener(event: Event, value: boolean): void {
|
|
|
|
const data = eventData.get(event as Event);
|
|
|
|
if (data) {
|
|
|
|
data.inPassiveListener = value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setPath(event: Event, value: EventPath[]): void {
|
|
|
|
const data = eventData.get(event as Event);
|
|
|
|
if (data) {
|
|
|
|
data.path = value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setRelatedTarget<T extends Event>(
|
|
|
|
event: T,
|
|
|
|
value: EventTarget | null
|
|
|
|
): void {
|
|
|
|
if ("relatedTarget" in event) {
|
|
|
|
(event as T & {
|
|
|
|
relatedTarget: EventTarget | null;
|
|
|
|
}).relatedTarget = value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setTarget(event: Event, value: EventTarget | null): void {
|
|
|
|
(event as EventImpl).target = value;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function setStopImmediatePropagation(
|
|
|
|
event: Event,
|
|
|
|
value: boolean
|
|
|
|
): void {
|
|
|
|
const data = eventData.get(event as Event);
|
|
|
|
if (data) {
|
|
|
|
data.stopImmediatePropagation = value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Type guards that widen the event type
|
|
|
|
|
|
|
|
export function hasRelatedTarget(
|
|
|
|
event: Event
|
|
|
|
): event is domTypes.FocusEvent | domTypes.MouseEvent {
|
|
|
|
return "relatedTarget" in event;
|
|
|
|
}
|
2019-01-05 10:02:44 -05:00
|
|
|
|
2019-06-20 08:21:43 -04:00
|
|
|
function isTrusted(this: Event): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return eventData.get(this)!.isTrusted;
|
2019-06-20 08:21:43 -04:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
export class EventImpl implements Event {
|
2019-06-20 08:21:43 -04:00
|
|
|
// The default value is `false`.
|
|
|
|
// Use `defineProperty` to define on each instance, NOT on the prototype.
|
|
|
|
isTrusted!: boolean;
|
2020-04-11 11:42:02 -04:00
|
|
|
|
|
|
|
#canceledFlag = false;
|
|
|
|
#stopPropagationFlag = false;
|
|
|
|
#attributes: EventAttributes;
|
|
|
|
|
|
|
|
constructor(type: string, eventInitDict: EventInit = {}) {
|
2019-03-26 07:42:26 -04:00
|
|
|
requiredArguments("Event", arguments.length, 1);
|
|
|
|
type = String(type);
|
2020-04-11 11:42:02 -04:00
|
|
|
this.#attributes = {
|
2019-01-05 10:02:44 -05:00
|
|
|
type,
|
2020-04-11 11:42:02 -04:00
|
|
|
bubbles: eventInitDict.bubbles ?? false,
|
|
|
|
cancelable: eventInitDict.cancelable ?? false,
|
|
|
|
composed: eventInitDict.composed ?? false,
|
2019-01-05 10:02:44 -05:00
|
|
|
currentTarget: null,
|
2020-04-11 11:42:02 -04:00
|
|
|
eventPhase: Event.NONE,
|
2019-01-05 10:02:44 -05:00
|
|
|
target: null,
|
2020-03-28 13:03:49 -04:00
|
|
|
timeStamp: Date.now(),
|
2020-04-11 11:42:02 -04:00
|
|
|
};
|
|
|
|
eventData.set(this, {
|
|
|
|
dispatched: false,
|
|
|
|
inPassiveListener: false,
|
|
|
|
isTrusted: false,
|
|
|
|
path: [],
|
|
|
|
stopImmediatePropagation: false,
|
2019-01-05 10:02:44 -05:00
|
|
|
});
|
2019-06-20 08:21:43 -04:00
|
|
|
Reflect.defineProperty(this, "isTrusted", {
|
|
|
|
enumerable: true,
|
2020-03-28 13:03:49 -04:00
|
|
|
get: isTrusted,
|
2019-06-20 08:21:43 -04:00
|
|
|
});
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
get bubbles(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#attributes.bubbles;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
get cancelBubble(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#stopPropagationFlag;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2019-05-27 09:20:34 -04:00
|
|
|
set cancelBubble(value: boolean) {
|
2020-04-11 11:42:02 -04:00
|
|
|
this.#stopPropagationFlag = value;
|
2019-05-27 09:20:34 -04:00
|
|
|
}
|
|
|
|
|
2019-01-05 10:02:44 -05:00
|
|
|
get cancelable(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#attributes.cancelable;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
get composed(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#attributes.composed;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
get currentTarget(): EventTarget | null {
|
|
|
|
return this.#attributes.currentTarget;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
set currentTarget(value: EventTarget | null) {
|
|
|
|
this.#attributes = {
|
2019-05-27 09:20:34 -04:00
|
|
|
type: this.type,
|
|
|
|
bubbles: this.bubbles,
|
|
|
|
cancelable: this.cancelable,
|
|
|
|
composed: this.composed,
|
|
|
|
currentTarget: value,
|
|
|
|
eventPhase: this.eventPhase,
|
|
|
|
target: this.target,
|
2020-03-28 13:03:49 -04:00
|
|
|
timeStamp: this.timeStamp,
|
2020-04-11 11:42:02 -04:00
|
|
|
};
|
2019-05-27 09:20:34 -04:00
|
|
|
}
|
|
|
|
|
2019-01-05 10:02:44 -05:00
|
|
|
get defaultPrevented(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#canceledFlag;
|
2019-01-23 07:20:53 -05:00
|
|
|
}
|
|
|
|
|
2019-01-05 10:02:44 -05:00
|
|
|
get eventPhase(): number {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#attributes.eventPhase;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2019-05-27 09:20:34 -04:00
|
|
|
set eventPhase(value: number) {
|
2020-04-11 11:42:02 -04:00
|
|
|
this.#attributes = {
|
2019-05-27 09:20:34 -04:00
|
|
|
type: this.type,
|
|
|
|
bubbles: this.bubbles,
|
|
|
|
cancelable: this.cancelable,
|
|
|
|
composed: this.composed,
|
|
|
|
currentTarget: this.currentTarget,
|
|
|
|
eventPhase: value,
|
|
|
|
target: this.target,
|
2020-03-28 13:03:49 -04:00
|
|
|
timeStamp: this.timeStamp,
|
2020-04-11 11:42:02 -04:00
|
|
|
};
|
2019-05-27 09:20:34 -04:00
|
|
|
}
|
|
|
|
|
2019-01-23 07:20:53 -05:00
|
|
|
get initialized(): boolean {
|
2020-04-11 11:42:02 -04:00
|
|
|
return true;
|
2019-05-27 09:20:34 -04:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
get target(): EventTarget | null {
|
|
|
|
return this.#attributes.target;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
set target(value: EventTarget | null) {
|
|
|
|
this.#attributes = {
|
2019-05-27 09:20:34 -04:00
|
|
|
type: this.type,
|
|
|
|
bubbles: this.bubbles,
|
|
|
|
cancelable: this.cancelable,
|
|
|
|
composed: this.composed,
|
|
|
|
currentTarget: this.currentTarget,
|
|
|
|
eventPhase: this.eventPhase,
|
|
|
|
target: value,
|
2020-03-28 13:03:49 -04:00
|
|
|
timeStamp: this.timeStamp,
|
2020-04-11 11:42:02 -04:00
|
|
|
};
|
2019-05-27 09:20:34 -04:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
get timeStamp(): number {
|
|
|
|
return this.#attributes.timeStamp;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
get type(): string {
|
2020-04-11 11:42:02 -04:00
|
|
|
return this.#attributes.type;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
composedPath(): EventTarget[] {
|
|
|
|
const path = eventData.get(this)!.path;
|
|
|
|
if (path.length === 0) {
|
2019-01-05 10:02:44 -05:00
|
|
|
return [];
|
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
assert(this.currentTarget);
|
|
|
|
const composedPath: EventPath[] = [
|
2019-01-05 10:02:44 -05:00
|
|
|
{
|
|
|
|
item: this.currentTarget,
|
|
|
|
itemInShadowTree: false,
|
|
|
|
relatedTarget: null,
|
|
|
|
rootOfClosedTree: false,
|
|
|
|
slotInClosedTree: false,
|
|
|
|
target: null,
|
2020-03-28 13:03:49 -04:00
|
|
|
touchTargetList: [],
|
|
|
|
},
|
2019-01-05 10:02:44 -05:00
|
|
|
];
|
|
|
|
|
|
|
|
let currentTargetIndex = 0;
|
|
|
|
let currentTargetHiddenSubtreeLevel = 0;
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
for (let index = path.length - 1; index >= 0; index--) {
|
|
|
|
const { item, rootOfClosedTree, slotInClosedTree } = path[index];
|
2019-01-05 10:02:44 -05:00
|
|
|
|
|
|
|
if (rootOfClosedTree) {
|
|
|
|
currentTargetHiddenSubtreeLevel++;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (item === this.currentTarget) {
|
|
|
|
currentTargetIndex = index;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (slotInClosedTree) {
|
|
|
|
currentTargetHiddenSubtreeLevel--;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
let currentHiddenLevel = currentTargetHiddenSubtreeLevel;
|
|
|
|
let maxHiddenLevel = currentTargetHiddenSubtreeLevel;
|
|
|
|
|
|
|
|
for (let i = currentTargetIndex - 1; i >= 0; i--) {
|
2020-04-11 11:42:02 -04:00
|
|
|
const { item, rootOfClosedTree, slotInClosedTree } = path[i];
|
2019-01-05 10:02:44 -05:00
|
|
|
|
|
|
|
if (rootOfClosedTree) {
|
|
|
|
currentHiddenLevel++;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (currentHiddenLevel <= maxHiddenLevel) {
|
|
|
|
composedPath.unshift({
|
|
|
|
item,
|
|
|
|
itemInShadowTree: false,
|
|
|
|
relatedTarget: null,
|
|
|
|
rootOfClosedTree: false,
|
|
|
|
slotInClosedTree: false,
|
|
|
|
target: null,
|
2020-03-28 13:03:49 -04:00
|
|
|
touchTargetList: [],
|
2019-01-05 10:02:44 -05:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
if (slotInClosedTree) {
|
|
|
|
currentHiddenLevel--;
|
|
|
|
|
|
|
|
if (currentHiddenLevel < maxHiddenLevel) {
|
|
|
|
maxHiddenLevel = currentHiddenLevel;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
currentHiddenLevel = currentTargetHiddenSubtreeLevel;
|
|
|
|
maxHiddenLevel = currentTargetHiddenSubtreeLevel;
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
for (let index = currentTargetIndex + 1; index < path.length; index++) {
|
|
|
|
const { item, rootOfClosedTree, slotInClosedTree } = path[index];
|
2019-01-05 10:02:44 -05:00
|
|
|
|
|
|
|
if (slotInClosedTree) {
|
|
|
|
currentHiddenLevel++;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (currentHiddenLevel <= maxHiddenLevel) {
|
|
|
|
composedPath.push({
|
|
|
|
item,
|
|
|
|
itemInShadowTree: false,
|
|
|
|
relatedTarget: null,
|
|
|
|
rootOfClosedTree: false,
|
|
|
|
slotInClosedTree: false,
|
|
|
|
target: null,
|
2020-03-28 13:03:49 -04:00
|
|
|
touchTargetList: [],
|
2019-01-05 10:02:44 -05:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
if (rootOfClosedTree) {
|
|
|
|
currentHiddenLevel--;
|
|
|
|
|
|
|
|
if (currentHiddenLevel < maxHiddenLevel) {
|
|
|
|
maxHiddenLevel = currentHiddenLevel;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-04-11 11:42:02 -04:00
|
|
|
return composedPath.map((p) => p.item);
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
preventDefault(): void {
|
2020-04-11 11:42:02 -04:00
|
|
|
if (this.cancelable && !eventData.get(this)!.inPassiveListener) {
|
|
|
|
this.#canceledFlag = true;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
stopPropagation(): void {
|
2020-04-11 11:42:02 -04:00
|
|
|
this.#stopPropagationFlag = true;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
stopImmediatePropagation(): void {
|
2020-04-11 11:42:02 -04:00
|
|
|
this.#stopPropagationFlag = true;
|
|
|
|
eventData.get(this)!.stopImmediatePropagation = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
get NONE(): number {
|
|
|
|
return Event.NONE;
|
|
|
|
}
|
|
|
|
|
|
|
|
get CAPTURING_PHASE(): number {
|
|
|
|
return Event.CAPTURING_PHASE;
|
|
|
|
}
|
|
|
|
|
|
|
|
get AT_TARGET(): number {
|
|
|
|
return Event.AT_TARGET;
|
|
|
|
}
|
|
|
|
|
|
|
|
get BUBBLING_PHASE(): number {
|
|
|
|
return Event.BUBBLING_PHASE;
|
|
|
|
}
|
|
|
|
|
|
|
|
static get NONE(): number {
|
|
|
|
return 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
static get CAPTURING_PHASE(): number {
|
|
|
|
return 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
static get AT_TARGET(): number {
|
|
|
|
return 2;
|
|
|
|
}
|
|
|
|
|
|
|
|
static get BUBBLING_PHASE(): number {
|
|
|
|
return 3;
|
2019-01-05 10:02:44 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-04-11 11:42:02 -04:00
|
|
|
defineEnumerableProps(EventImpl, [
|
|
|
|
"bubbles",
|
|
|
|
"cancelable",
|
|
|
|
"composed",
|
|
|
|
"currentTarget",
|
|
|
|
"defaultPrevented",
|
|
|
|
"eventPhase",
|
|
|
|
"target",
|
|
|
|
"timeStamp",
|
|
|
|
"type",
|
|
|
|
]);
|