Skip to content

feat: DOM Events #10100

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 46 commits into
base: main
Choose a base branch
from
Open

feat: DOM Events #10100

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
46 commits
Select commit Hold shift + click to select a range
7a276df
feat: DOM events
shirakaba Nov 12, 2022
8325952
chore: tests
shirakaba Nov 22, 2022
453adef
fix: global types
shirakaba Nov 23, 2022
3dad494
fix: downstream types and arg-passing
shirakaba Nov 23, 2022
b572da1
fix: simplify EventData typings, drop NotifyData
shirakaba Nov 23, 2022
890be6c
fix: stop maintaining observable index.d.ts alongside index.ts
shirakaba Nov 23, 2022
933af70
fix: clean up Application types
shirakaba Nov 23, 2022
0fe149c
feat: implement Event and EventTarget
shirakaba Nov 29, 2022
88020d9
chore: 8.5.0-dom.0
shirakaba Dec 7, 2022
fe60cfa
fix: accidental reference to `event` rather than `this`
shirakaba Dec 17, 2022
2d0c3ff
chore: add apps for profiling
shirakaba Dec 17, 2022
40db84e
feat: profiling setup
shirakaba Dec 17, 2022
f58d743
fix: optimise syntax used within handleEvent()
shirakaba Dec 17, 2022
95f9c44
fix: lazy-clone listeners array
shirakaba Dec 17, 2022
217cd78
fix: simplify MutationSensitiveArray listener system
shirakaba Dec 17, 2022
efb1a93
fix: avoid unnecessary usage of Array.prototype.reverse()
shirakaba Dec 17, 2022
66f62fb
fix: recycle eventPath
shirakaba Dec 17, 2022
f08d122
fix: avoid creating functions on each handleEvent() call
shirakaba Dec 17, 2022
89f94b5
fix: assign directly to prototype where possible
shirakaba Dec 19, 2022
afa78dd
fix: use simple properties instead of setters
shirakaba Dec 19, 2022
d8b83e4
fix: combine splice-and-push into just splice
shirakaba Dec 20, 2022
96e53c6
fix: declare onCurrentListenersMutation on prototype
shirakaba Dec 20, 2022
13c29db
fix: declare reset on prototype
shirakaba Dec 20, 2022
08bc87b
fix: convert property bag to individual args
shirakaba Dec 20, 2022
eb8020a
fix: apply -> call
shirakaba Dec 20, 2022
ab56e11
fix: C for loop instead of for...of
shirakaba Dec 20, 2022
0513789
fix: lazily bind context to removeEventListener callbacks
shirakaba Dec 21, 2022
253d313
chore: use static constants for readability (no perf difference)
shirakaba Dec 21, 2022
1f3a62c
fix: convert property bag to args
shirakaba Dec 21, 2022
b4f6998
chore: comment
shirakaba Dec 21, 2022
7936154
fix: declare uninitialised fields (for strict TypeScript)
shirakaba Dec 21, 2022
c58328a
chore: reorder class members
shirakaba Dec 21, 2022
a87e828
fix: don't make an object unnecessarily
shirakaba Dec 21, 2022
8b5efc1
chore: audit usages of bind()
shirakaba Dec 21, 2022
569b1f2
fix: determine insertion function up-front
shirakaba Dec 21, 2022
decccab
fix: assign variables as late as possible
shirakaba Dec 21, 2022
2a8c926
fix: move cheaper check in front
shirakaba Dec 21, 2022
d3d6830
fix: ditch MutationSensitiveArray
shirakaba Dec 21, 2022
959f0a2
fix: swap spread for slice
shirakaba Dec 21, 2022
c93fba4
release: 8.5.0-dom.1
shirakaba Dec 21, 2022
23961af
fix: update this.currentTarget
shirakaba Dec 22, 2022
6cb8a83
fix: don't share eventPath
shirakaba Dec 22, 2022
d0e522f
fix: get listeners afresh each time
shirakaba Dec 22, 2022
9a0717b
fix: update unstable_currentEvent correctly
shirakaba Dec 22, 2022
caf4898
chore: change || to ??
shirakaba Dec 22, 2022
96f841d
release: 8.5.0-dom.2
shirakaba Dec 22, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
73 changes: 73 additions & 0 deletions apps/automated/src/data/observable-tests.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -185,6 +185,79 @@ export var test_Observable_addEventListener_MultipleEvents_ShouldTrim = function
TKUnit.assert(receivedCount === 2, 'Callbacks not raised properly.');
};

export var test_Observable_addEventListener_ListenerEquality_Same = function () {
var obj = new TestObservable();

var count = 0;
var callback = function (data: EventData) {
count++;
};

obj.addEventListener(Observable.propertyChangeEvent, callback);
obj.addEventListener(Observable.propertyChangeEvent, callback);

obj.set('testName', 1);
TKUnit.assert(count === 1, 'The propertyChanged notification should be raised once.');
};

export var test_Observable_addEventListener_ListenerEquality_SameForFalsyThisArg = function () {
var obj = new TestObservable();

var count = 0;
var callback = function (data: EventData) {
count++;
};

obj.addEventListener(Observable.propertyChangeEvent, callback);
obj.addEventListener(Observable.propertyChangeEvent, callback, null);
obj.addEventListener(Observable.propertyChangeEvent, callback, undefined);
obj.addEventListener(Observable.propertyChangeEvent, callback, false);
obj.addEventListener(Observable.propertyChangeEvent, callback, 0);
obj.addEventListener(Observable.propertyChangeEvent, callback, NaN);
obj.addEventListener(Observable.propertyChangeEvent, callback, '');

obj.set('testName', 1);
TKUnit.assert(count === 1, `Expected to register exactly 1 event listener due to falsy thisArgs being treated the same as omitted thisArgs, but found ${count} events fired.`);
};

export var test_Observable_addEventListener_ListenerEquality_DistinctByStrictEquality = function () {
var obj = new TestObservable();

var count = 0;
var callback = function (data: EventData) {
count++;
};

obj.addEventListener(Observable.propertyChangeEvent, callback);
obj.addEventListener(Observable.propertyChangeEvent, callback, {});
obj.addEventListener(Observable.propertyChangeEvent, callback, {});

obj.set('testName', 1);
TKUnit.assert(count === 3, `Expected to register exactly 3 event listeners due to thisArgs differing by strict equality, but found ${count} events fired.`);
};

export var test_Observable_addEventListener_ListenerEquality_DistinctByCapture = function () {
var obj = new TestObservable();

var count = 0;
var callback = function (data: EventData) {
count++;
};

obj.addEventListener(Observable.propertyChangeEvent, callback, null);
obj.addEventListener(Observable.propertyChangeEvent, callback, null, true);
obj.addEventListener(Observable.propertyChangeEvent, callback, null, false);
obj.addEventListener(Observable.propertyChangeEvent, callback, null, { capture: true });
obj.addEventListener(Observable.propertyChangeEvent, callback, null, { capture: false });
obj.addEventListener(Observable.propertyChangeEvent, callback, null, { capture: true, once: true });
obj.addEventListener(Observable.propertyChangeEvent, callback, null, { capture: true, passive: true });

obj.set('testName', 1);
TKUnit.assert(count === 2, `Expected to register exactly 2 event listeners due to their equality depending only on the capture value, but found ${count} events fired.`);
};

// TODO: corresponding removeEventListener tests, making sure we only remove more than one event listener when passing in just the event name as an arg.

export var test_Observable_addEventListener_MultipleCallbacks = function () {
var obj = new TestObservable();

Expand Down
43 changes: 22 additions & 21 deletions apps/automated/src/ui/gestures/gestures-tests.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { GestureEventData, Label, GestureTypes, PanGestureEventData, PinchGestur
export var test_DummyTestForSnippetOnly0 = function () {
// >> gestures-double-tap
var label = new Label();
var observer = label.on(GestureTypes.doubleTap, function (args: GestureEventData) {
label.on(GestureTypes.doubleTap, function (args: GestureEventData) {
console.log('Double Tap');
});
// << gestures-double-tap
Expand All @@ -13,7 +13,7 @@ export var test_DummyTestForSnippetOnly0 = function () {
export var test_DummyTestForSnippetOnly01 = function () {
// >> gestures-double-tap-alt
var label = new Label();
var observer = label.on('doubleTap', function (args: GestureEventData) {
label.on('doubleTap', function (args: GestureEventData) {
console.log('Double Tap');
});
// << gestures-double-tap-alt
Expand All @@ -22,7 +22,7 @@ export var test_DummyTestForSnippetOnly01 = function () {
export var test_DummyTestForSnippetOnly1 = function () {
// >> gestures-long-press
var label = new Label();
var observer = label.on(GestureTypes.longPress, function (args: GestureEventData) {
label.on(GestureTypes.longPress, function (args: GestureEventData) {
console.log('Long Press');
});
// << gestures-long-press
Expand All @@ -31,7 +31,7 @@ export var test_DummyTestForSnippetOnly1 = function () {
export var test_DummyTestForSnippetOnly11 = function () {
// >> gestures-long-press-alt
var label = new Label();
var observer = label.on('longPress', function (args: GestureEventData) {
label.on('longPress', function (args: GestureEventData) {
console.log('Long Press');
});
// << gestures-long-press-alt
Expand All @@ -40,7 +40,7 @@ export var test_DummyTestForSnippetOnly11 = function () {
export var test_DummyTestForSnippetOnly2 = function () {
// >> gestures-pan
var label = new Label();
var observer = label.on(GestureTypes.pan, function (args: PanGestureEventData) {
label.on(GestureTypes.pan, function (args: PanGestureEventData) {
console.log('Pan deltaX:' + args.deltaX + '; deltaY:' + args.deltaY + ';');
});
// << gestures-pan
Expand All @@ -49,7 +49,7 @@ export var test_DummyTestForSnippetOnly2 = function () {
export var test_DummyTestForSnippetOnly22 = function () {
// >> gestures-pan-alt
var label = new Label();
var observer = label.on('pan', function (args: PanGestureEventData) {
label.on('pan', function (args: PanGestureEventData) {
console.log('Pan deltaX:' + args.deltaX + '; deltaY:' + args.deltaY + ';');
});
// << gestures-pan-alt
Expand All @@ -58,7 +58,7 @@ export var test_DummyTestForSnippetOnly22 = function () {
export var test_DummyTestForSnippetOnly3 = function () {
// >> gestures-pan-pinch
var label = new Label();
var observer = label.on(GestureTypes.pinch, function (args: PinchGestureEventData) {
label.on(GestureTypes.pinch, function (args: PinchGestureEventData) {
console.log('Pinch scale: ' + args.scale);
});
// << gestures-pan-pinch
Expand All @@ -67,7 +67,7 @@ export var test_DummyTestForSnippetOnly3 = function () {
export var test_DummyTestForSnippetOnly33 = function () {
// >> gestures-pan-pinch-alt
var label = new Label();
var observer = label.on('pinch', function (args: PinchGestureEventData) {
label.on('pinch', function (args: PinchGestureEventData) {
console.log('Pinch scale: ' + args.scale);
});
// << gestures-pan-pinch-alt
Expand All @@ -76,7 +76,7 @@ export var test_DummyTestForSnippetOnly33 = function () {
export var test_DummyTestForSnippetOnly4 = function () {
// >> gestures-rotation
var label = new Label();
var observer = label.on(GestureTypes.rotation, function (args: RotationGestureEventData) {
label.on(GestureTypes.rotation, function (args: RotationGestureEventData) {
console.log('Rotation: ' + args.rotation);
});
// << gestures-rotation
Expand All @@ -85,7 +85,7 @@ export var test_DummyTestForSnippetOnly4 = function () {
export var test_DummyTestForSnippetOnly44 = function () {
// >> gestures-rotation-alt
var label = new Label();
var observer = label.on('rotation', function (args: RotationGestureEventData) {
label.on('rotation', function (args: RotationGestureEventData) {
console.log('Rotation: ' + args.rotation);
});
// << gestures-rotation-alt
Expand All @@ -94,7 +94,7 @@ export var test_DummyTestForSnippetOnly44 = function () {
export var test_DummyTestForSnippetOnly5 = function () {
// >> gestures-swipe
var label = new Label();
var observer = label.on(GestureTypes.swipe, function (args: SwipeGestureEventData) {
label.on(GestureTypes.swipe, function (args: SwipeGestureEventData) {
console.log('Swipe direction: ' + args.direction);
});
// << gestures-swipe
Expand All @@ -103,7 +103,7 @@ export var test_DummyTestForSnippetOnly5 = function () {
export var test_DummyTestForSnippetOnly55 = function () {
// >> gestures-swipe-alt
var label = new Label();
var observer = label.on('swipe', function (args: SwipeGestureEventData) {
label.on('swipe', function (args: SwipeGestureEventData) {
console.log('Swipe direction: ' + args.direction);
});
// << gestures-swipe-alt
Expand All @@ -112,7 +112,7 @@ export var test_DummyTestForSnippetOnly55 = function () {
export var test_DummyTestForSnippetOnly6 = function () {
// >> gestures-tap
var label = new Label();
var observer = label.on(GestureTypes.tap, function (args: GestureEventData) {
label.on(GestureTypes.tap, function (args: GestureEventData) {
console.log('Tap');
});
// << gestures-tap
Expand All @@ -121,26 +121,27 @@ export var test_DummyTestForSnippetOnly6 = function () {
export var test_DummyTestForSnippetOnly66 = function () {
// >> gestures-tap-alt
var label = new Label();
var observer = label.on('tap', function (args: GestureEventData) {
label.on('tap', function (args: GestureEventData) {
console.log('Tap');
});
// << gestures-tap-alt
};

export var test_DummyTestForSnippetOnly7 = function () {
// >> gestures-stop-observe
var label = new Label();
var observer = label.on(GestureTypes.tap, function (args: GestureEventData) {
function onTap(args: GestureEventData) {
console.log('Tap');
});
observer.disconnect();
}
const label = new Label();
label.on(GestureTypes.tap, onTap);
label.off(GestureTypes.tap, onTap);
// << gestures-stop-observe
};

export var test_DummyTestForSnippetOnly8 = function () {
// >> gestures-multiple
var label = new Label();
var observer = label.on(GestureTypes.tap | GestureTypes.doubleTap | GestureTypes.longPress, function (args: GestureEventData) {
label.on(GestureTypes.tap | GestureTypes.doubleTap | GestureTypes.longPress, function (args: GestureEventData) {
console.log('Event: ' + args.eventName);
});
// << gestures-multiple
Expand All @@ -149,7 +150,7 @@ export var test_DummyTestForSnippetOnly8 = function () {
export var test_DummyTestForSnippetOnly88 = function () {
// >> gestures-string
var label = new Label();
var observer = label.on('tap, doubleTap, longPress', function (args: GestureEventData) {
label.on('tap, doubleTap, longPress', function (args: GestureEventData) {
console.log('Event: ' + args.eventName);
});
// << gestures-string
Expand All @@ -158,7 +159,7 @@ export var test_DummyTestForSnippetOnly88 = function () {
export var test_DummyTestForSnippetOnly9 = function () {
// >> gestures-events-string
var label = new Label();
var observer = label.on('loaded, tap, longPress', function (args: GestureEventData) {
label.on('loaded, tap, longPress', function (args: GestureEventData) {
console.log('Event: ' + args.eventName);
});
// << gestures-events-string
Expand Down
Loading