From 02e4d812c233eaf3565ff5c475b42edc7c5036fc Mon Sep 17 00:00:00 2001
From: shirakaba <14055146+shirakaba@users.noreply.github.com>
Date: Wed, 1 May 2024 16:31:34 +0900
Subject: [PATCH] chore(core): clean up addEventListener() and
 removeEventListener() in ViewCommon

---
 packages/core/data/observable/index.ts    |  2 +-
 packages/core/ui/core/view/view-common.ts | 88 +++++++++++------------
 2 files changed, 42 insertions(+), 48 deletions(-)

diff --git a/packages/core/data/observable/index.ts b/packages/core/data/observable/index.ts
index c3adcbe6e..d599d9616 100644
--- a/packages/core/data/observable/index.ts
+++ b/packages/core/data/observable/index.ts
@@ -89,7 +89,7 @@ const _globalEventHandlers: {
 	};
 } = {};
 
-const eventNamesRegex = /\s*,\s*/;
+export const eventNamesRegex = /\s*,\s*/;
 
 /**
  * Observable is used when you want to be notified when a change occurs. Use on/off methods to add/remove listener.
diff --git a/packages/core/ui/core/view/view-common.ts b/packages/core/ui/core/view/view-common.ts
index f03025fe8..6ddb01c5e 100644
--- a/packages/core/ui/core/view/view-common.ts
+++ b/packages/core/ui/core/view/view-common.ts
@@ -8,7 +8,7 @@ import { isObject } from '../../../utils/types';
 import { sanitizeModuleName } from '../../../utils/common';
 import { Color } from '../../../color';
 import { Property, InheritedProperty } from '../properties';
-import { EventData } from '../../../data/observable';
+import { EventData, eventNamesRegex } from '../../../data/observable';
 import { Trace } from '../../../trace';
 import { CoreTypes } from '../../../core-types';
 import { ViewHelper } from './view-helper';
@@ -291,56 +291,50 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
 	}
 
 	public addEventListener(arg: string | GestureTypes, callback: (data: EventData) => void, thisArg?: any) {
-		if (typeof arg === 'string') {
-			arg = getEventOrGestureName(arg);
+		if (typeof arg === 'number') {
+			this._observe(arg, callback as unknown as (data: GestureEventData) => void, thisArg);
+			return;
+		}
 
-			const gesture = gestureFromString(arg);
-			if (gesture && !this._isEvent(arg)) {
-				this._observe(gesture, callback as unknown as (data: GestureEventData) => void, thisArg);
-			} else {
-				const events = arg.split(',');
-				if (events.length > 0) {
-					for (let i = 0; i < events.length; i++) {
-						const evt = events[i].trim();
-						const gst = gestureFromString(evt);
-						if (gst && !this._isEvent(arg)) {
-							this._observe(gst, callback as unknown as (data: GestureEventData) => void, thisArg);
-						} else {
-							super.addEventListener(evt, callback, thisArg);
-						}
-					}
-				} else {
-					super.addEventListener(arg, callback, thisArg);
-				}
-			}
-		} else if (typeof arg === 'number') {
-			this._observe(<GestureTypes>arg, callback as unknown as (data: GestureEventData) => void, thisArg);
+		// Normalize "ontap" -> "tap"
+		const normalizedName = getEventOrGestureName(arg);
+
+		// Coerce "tap" -> GestureTypes.tap
+		// Coerce "loaded" -> undefined
+		const gesture: GestureTypes | undefined = gestureFromString(normalizedName);
+
+		// If it's a gesture (and this Observable declares e.g. `static tapEvent`)
+		if (gesture && !this._isEvent(normalizedName)) {
+			this._observe(gesture, callback as unknown as (data: GestureEventData) => void, thisArg);
+			return;
+		}
+
+		for (const eventName of normalizedName.trim().split(eventNamesRegex)) {
+			super.addEventListener(eventName, callback, thisArg);
 		}
 	}
 
 	public removeEventListener(arg: string | GestureTypes, callback?: (data: EventData) => void, thisArg?: any) {
-		if (typeof arg === 'string') {
-			const gesture = gestureFromString(arg);
-			if (gesture && !this._isEvent(arg)) {
-				this._disconnectGestureObservers(gesture);
-			} else {
-				const events = arg.split(',');
-				if (events.length > 0) {
-					for (let i = 0; i < events.length; i++) {
-						const evt = events[i].trim();
-						const gst = gestureFromString(evt);
-						if (gst && !this._isEvent(arg)) {
-							this._disconnectGestureObservers(gst);
-						} else {
-							super.removeEventListener(evt, callback, thisArg);
-						}
-					}
-				} else {
-					super.removeEventListener(arg, callback, thisArg);
-				}
-			}
-		} else if (typeof arg === 'number') {
-			this._disconnectGestureObservers(<GestureTypes>arg);
+		if (typeof arg === 'number') {
+			this._disconnectGestureObservers(arg);
+			return;
+		}
+
+		// Normalize "ontap" -> "tap"
+		const normalizedName = getEventOrGestureName(arg);
+
+		// Coerce "tap" -> GestureTypes.tap
+		// Coerce "loaded" -> undefined
+		const gesture: GestureTypes | undefined = gestureFromString(normalizedName);
+
+		// If it's a gesture (and this Observable declares e.g. `static tapEvent`)
+		if (gesture && !this._isEvent(normalizedName)) {
+			this._disconnectGestureObservers(gesture);
+			return;
+		}
+
+		for (const eventName of normalizedName.trim().split(eventNamesRegex)) {
+			super.removeEventListener(eventName, callback, thisArg);
 		}
 	}
 
@@ -379,7 +373,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
 			const firstArgument = args[0];
 			const view = firstArgument instanceof ViewCommon ? firstArgument : <ViewCommon>Builder.createViewFromEntry({
 							moduleName: firstArgument,
-					  });
+						});
 
 			return { view, options };
 		}