Skip to content

Commit 22d16cc

Browse files
authored
Remove event constants (facebook#19276)
* Remove opaque event type * Rename type and merge files * Use literals where we have Flow coverage * Flowify some plugins * Remove constants except necessary ones
1 parent 6ef997b commit 22d16cc

20 files changed

+791
-888
lines changed

packages/react-dom/src/client/ReactDOMComponent.js

Lines changed: 20 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -91,14 +91,6 @@ import {
9191
listenToNonDelegatedEvent,
9292
} from '../events/DOMPluginEventSystem';
9393
import {getEventListenerMap} from './ReactDOMComponentTree';
94-
import {
95-
TOP_LOAD,
96-
TOP_ERROR,
97-
TOP_TOGGLE,
98-
TOP_INVALID,
99-
TOP_CANCEL,
100-
TOP_CLOSE,
101-
} from '../events/DOMTopLevelEventTypes';
10294

10395
let didWarnInvalidHydration = false;
10496
let didWarnScriptTags = false;
@@ -542,16 +534,16 @@ export function setInitialProperties(
542534
let props: Object;
543535
switch (tag) {
544536
case 'dialog':
545-
listenToNonDelegatedEvent(TOP_CANCEL, domElement);
546-
listenToNonDelegatedEvent(TOP_CLOSE, domElement);
537+
listenToNonDelegatedEvent('cancel', domElement);
538+
listenToNonDelegatedEvent('close', domElement);
547539
props = rawProps;
548540
break;
549541
case 'iframe':
550542
case 'object':
551543
case 'embed':
552544
// We listen to this event in case to ensure emulated bubble
553545
// listeners still fire for the load event.
554-
listenToNonDelegatedEvent(TOP_LOAD, domElement);
546+
listenToNonDelegatedEvent('load', domElement);
555547
props = rawProps;
556548
break;
557549
case 'video':
@@ -566,30 +558,30 @@ export function setInitialProperties(
566558
case 'source':
567559
// We listen to this event in case to ensure emulated bubble
568560
// listeners still fire for the error event.
569-
listenToNonDelegatedEvent(TOP_ERROR, domElement);
561+
listenToNonDelegatedEvent('error', domElement);
570562
props = rawProps;
571563
break;
572564
case 'img':
573565
case 'image':
574566
case 'link':
575567
// We listen to these events in case to ensure emulated bubble
576568
// listeners still fire for error and load events.
577-
listenToNonDelegatedEvent(TOP_ERROR, domElement);
578-
listenToNonDelegatedEvent(TOP_LOAD, domElement);
569+
listenToNonDelegatedEvent('error', domElement);
570+
listenToNonDelegatedEvent('load', domElement);
579571
props = rawProps;
580572
break;
581573
case 'details':
582574
// We listen to this event in case to ensure emulated bubble
583575
// listeners still fire for the toggle event.
584-
listenToNonDelegatedEvent(TOP_TOGGLE, domElement);
576+
listenToNonDelegatedEvent('toggle', domElement);
585577
props = rawProps;
586578
break;
587579
case 'input':
588580
ReactDOMInputInitWrapperState(domElement, rawProps);
589581
props = ReactDOMInputGetHostProps(domElement, rawProps);
590582
// We listen to this event in case to ensure emulated bubble
591583
// listeners still fire for the invalid event.
592-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
584+
listenToNonDelegatedEvent('invalid', domElement);
593585
// For controlled components we always need to ensure we're listening
594586
// to onChange. Even if there is no listener.
595587
ensureListeningTo(rootContainerElement, 'onChange', domElement);
@@ -603,7 +595,7 @@ export function setInitialProperties(
603595
props = ReactDOMSelectGetHostProps(domElement, rawProps);
604596
// We listen to this event in case to ensure emulated bubble
605597
// listeners still fire for the invalid event.
606-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
598+
listenToNonDelegatedEvent('invalid', domElement);
607599
// For controlled components we always need to ensure we're listening
608600
// to onChange. Even if there is no listener.
609601
ensureListeningTo(rootContainerElement, 'onChange', domElement);
@@ -613,7 +605,7 @@ export function setInitialProperties(
613605
props = ReactDOMTextareaGetHostProps(domElement, rawProps);
614606
// We listen to this event in case to ensure emulated bubble
615607
// listeners still fire for the invalid event.
616-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
608+
listenToNonDelegatedEvent('invalid', domElement);
617609
// For controlled components we always need to ensure we're listening
618610
// to onChange. Even if there is no listener.
619611
ensureListeningTo(rootContainerElement, 'onChange', domElement);
@@ -947,15 +939,15 @@ export function diffHydratedProperties(
947939
// TODO: Make sure that we check isMounted before firing any of these events.
948940
switch (tag) {
949941
case 'dialog':
950-
listenToNonDelegatedEvent(TOP_CANCEL, domElement);
951-
listenToNonDelegatedEvent(TOP_CLOSE, domElement);
942+
listenToNonDelegatedEvent('cancel', domElement);
943+
listenToNonDelegatedEvent('close', domElement);
952944
break;
953945
case 'iframe':
954946
case 'object':
955947
case 'embed':
956948
// We listen to this event in case to ensure emulated bubble
957949
// listeners still fire for the load event.
958-
listenToNonDelegatedEvent(TOP_LOAD, domElement);
950+
listenToNonDelegatedEvent('load', domElement);
959951
break;
960952
case 'video':
961953
case 'audio':
@@ -968,26 +960,26 @@ export function diffHydratedProperties(
968960
case 'source':
969961
// We listen to this event in case to ensure emulated bubble
970962
// listeners still fire for the error event.
971-
listenToNonDelegatedEvent(TOP_ERROR, domElement);
963+
listenToNonDelegatedEvent('error', domElement);
972964
break;
973965
case 'img':
974966
case 'image':
975967
case 'link':
976968
// We listen to these events in case to ensure emulated bubble
977969
// listeners still fire for error and load events.
978-
listenToNonDelegatedEvent(TOP_ERROR, domElement);
979-
listenToNonDelegatedEvent(TOP_LOAD, domElement);
970+
listenToNonDelegatedEvent('error', domElement);
971+
listenToNonDelegatedEvent('load', domElement);
980972
break;
981973
case 'details':
982974
// We listen to this event in case to ensure emulated bubble
983975
// listeners still fire for the toggle event.
984-
listenToNonDelegatedEvent(TOP_TOGGLE, domElement);
976+
listenToNonDelegatedEvent('toggle', domElement);
985977
break;
986978
case 'input':
987979
ReactDOMInputInitWrapperState(domElement, rawProps);
988980
// We listen to this event in case to ensure emulated bubble
989981
// listeners still fire for the invalid event.
990-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
982+
listenToNonDelegatedEvent('invalid', domElement);
991983
// For controlled components we always need to ensure we're listening
992984
// to onChange. Even if there is no listener.
993985
ensureListeningTo(rootContainerElement, 'onChange', domElement);
@@ -999,7 +991,7 @@ export function diffHydratedProperties(
999991
ReactDOMSelectInitWrapperState(domElement, rawProps);
1000992
// We listen to this event in case to ensure emulated bubble
1001993
// listeners still fire for the invalid event.
1002-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
994+
listenToNonDelegatedEvent('invalid', domElement);
1003995
// For controlled components we always need to ensure we're listening
1004996
// to onChange. Even if there is no listener.
1005997
ensureListeningTo(rootContainerElement, 'onChange', domElement);
@@ -1008,7 +1000,7 @@ export function diffHydratedProperties(
10081000
ReactDOMTextareaInitWrapperState(domElement, rawProps);
10091001
// We listen to this event in case to ensure emulated bubble
10101002
// listeners still fire for the invalid event.
1011-
listenToNonDelegatedEvent(TOP_INVALID, domElement);
1003+
listenToNonDelegatedEvent('invalid', domElement);
10121004
// For controlled components we always need to ensure we're listening
10131005
// to onChange. Even if there is no listener.
10141006
ensureListeningTo(rootContainerElement, 'onChange', domElement);

packages/react-dom/src/client/ReactDOMComponentTree.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import type {
1717
SuspenseInstance,
1818
Props,
1919
} from './ReactDOMHostConfig';
20-
import type {DOMTopLevelEventType} from '../events/TopLevelEventTypes';
20+
import type {DOMEventName} from '../events/DOMEventNames';
2121

2222
import {
2323
HostComponent,
@@ -41,7 +41,7 @@ const internalEventHandlersKey = '__reactEvents$' + randomKey;
4141
const internalEventHandlerListenersKey = '__reactListeners$' + randomKey;
4242

4343
export type ElementListenerMap = Map<
44-
DOMTopLevelEventType | string,
44+
DOMEventName | string,
4545
ElementListenerMapEntry | null,
4646
>;
4747

packages/react-dom/src/client/ReactDOMEventHandle.js

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @flow
88
*/
99

10-
import type {DOMTopLevelEventType} from '../events/TopLevelEventTypes';
10+
import type {DOMEventName} from '../events/DOMEventNames';
1111
import type {EventPriority, ReactScopeInstance} from 'shared/ReactTypes';
1212
import type {
1313
ReactDOMEventHandle,
@@ -69,7 +69,7 @@ function isReactScope(target: EventTarget | ReactScopeInstance): boolean {
6969
}
7070

7171
function createEventHandleListener(
72-
type: DOMTopLevelEventType,
72+
type: DOMEventName,
7373
isCapturePhaseListener: boolean,
7474
callback: (SyntheticEvent<EventTarget>) => void,
7575
): ReactDOMEventHandleListener {
@@ -82,7 +82,7 @@ function createEventHandleListener(
8282

8383
function registerEventOnNearestTargetContainer(
8484
targetFiber: Fiber,
85-
topLevelType: DOMTopLevelEventType,
85+
domEventName: DOMEventName,
8686
isPassiveListener: boolean | void,
8787
listenerPriority: EventPriority | void,
8888
isCapturePhaseListener: boolean,
@@ -102,7 +102,7 @@ function registerEventOnNearestTargetContainer(
102102
targetContainer = ((targetContainer.parentNode: any): Element);
103103
}
104104
listenToNativeEvent(
105-
topLevelType,
105+
domEventName,
106106
isCapturePhaseListener,
107107
targetContainer,
108108
targetElement,
@@ -113,7 +113,7 @@ function registerEventOnNearestTargetContainer(
113113

114114
function registerReactDOMEvent(
115115
target: EventTarget | ReactScopeInstance,
116-
topLevelType: DOMTopLevelEventType,
116+
domEventName: DOMEventName,
117117
isPassiveListener: boolean | void,
118118
isCapturePhaseListener: boolean,
119119
listenerPriority: EventPriority | void,
@@ -132,7 +132,7 @@ function registerReactDOMEvent(
132132
}
133133
registerEventOnNearestTargetContainer(
134134
targetFiber,
135-
topLevelType,
135+
domEventName,
136136
isPassiveListener,
137137
listenerPriority,
138138
isCapturePhaseListener,
@@ -147,7 +147,7 @@ function registerReactDOMEvent(
147147
}
148148
registerEventOnNearestTargetContainer(
149149
targetFiber,
150-
topLevelType,
150+
domEventName,
151151
isPassiveListener,
152152
listenerPriority,
153153
isCapturePhaseListener,
@@ -158,7 +158,7 @@ function registerReactDOMEvent(
158158
// These are valid event targets, but they are also
159159
// non-managed React nodes.
160160
listenToNativeEvent(
161-
topLevelType,
161+
domEventName,
162162
isCapturePhaseListener,
163163
eventTarget,
164164
null,
@@ -180,7 +180,7 @@ export function createEventHandle(
180180
options?: EventHandleOptions,
181181
): ReactDOMEventHandle {
182182
if (enableCreateEventHandleAPI) {
183-
const topLevelType = ((type: any): DOMTopLevelEventType);
183+
const domEventName = ((type: any): DOMEventName);
184184
let isCapturePhaseListener = false;
185185
let isPassiveListener = undefined; // Undefined means to use the browser default
186186
let listenerPriority;
@@ -201,7 +201,7 @@ export function createEventHandle(
201201
}
202202
}
203203
if (listenerPriority === undefined) {
204-
listenerPriority = getEventPriorityForListenerSystem(topLevelType);
204+
listenerPriority = getEventPriorityForListenerSystem(domEventName);
205205
}
206206

207207
const registeredReactDOMEvents = new PossiblyWeakSet();
@@ -219,16 +219,16 @@ export function createEventHandle(
219219
registeredReactDOMEvents.add(target);
220220
registerReactDOMEvent(
221221
target,
222-
topLevelType,
222+
domEventName,
223223
isPassiveListener,
224224
isCapturePhaseListener,
225225
listenerPriority,
226226
);
227227
// Add the event to our known event types list.
228-
addEventTypeToDispatchConfig(topLevelType);
228+
addEventTypeToDispatchConfig(domEventName);
229229
}
230230
const listener = createEventHandleListener(
231-
topLevelType,
231+
domEventName,
232232
isCapturePhaseListener,
233233
callback,
234234
);

packages/react-dom/src/client/ReactDOMHostConfig.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @flow
88
*/
99

10-
import type {TopLevelType} from '../events/TopLevelEventTypes';
10+
import type {DOMEventName} from '../events/DOMEventNames';
1111
import type {Fiber, FiberRoot} from 'react-reconciler/src/ReactInternalTypes';
1212
import type {
1313
BoundingRect,
@@ -79,7 +79,6 @@ import {
7979
enableScopeAPI,
8080
} from 'shared/ReactFeatureFlags';
8181
import {HostComponent, HostText} from 'react-reconciler/src/ReactWorkTags';
82-
import {TOP_BEFORE_BLUR, TOP_AFTER_BLUR} from '../events/DOMTopLevelEventTypes';
8382
import {listenToReactEvent} from '../events/DOMPluginEventSystem';
8483

8584
export type Type = string;
@@ -504,15 +503,15 @@ export function insertInContainerBefore(
504503
}
505504
}
506505

507-
function createEvent(type: TopLevelType, bubbles: boolean): Event {
506+
function createEvent(type: DOMEventName, bubbles: boolean): Event {
508507
const event = document.createEvent('Event');
509508
event.initEvent(((type: any): string), bubbles, false);
510509
return event;
511510
}
512511

513512
function dispatchBeforeDetachedBlur(target: HTMLElement): void {
514513
if (enableDeprecatedFlareAPI || enableCreateEventHandleAPI) {
515-
const event = createEvent(TOP_BEFORE_BLUR, true);
514+
const event = createEvent('beforeblur', true);
516515
// Dispatch "beforeblur" directly on the target,
517516
// so it gets picked up by the event system and
518517
// can propagate through the React internal tree.
@@ -522,7 +521,7 @@ function dispatchBeforeDetachedBlur(target: HTMLElement): void {
522521

523522
function dispatchAfterDetachedBlur(target: HTMLElement): void {
524523
if (enableDeprecatedFlareAPI || enableCreateEventHandleAPI) {
525-
const event = createEvent(TOP_AFTER_BLUR, false);
524+
const event = createEvent('afterblur', false);
526525
// So we know what was detached, make the relatedTarget the
527526
// detached target on the "afterblur" event.
528527
(event: any).relatedTarget = target;

0 commit comments

Comments
 (0)