Skip to content

Commit 3f85d53

Browse files
trueadmtrueadm
authored
Further pre-requisite changes to plugin event system (#18083)
1 parent ea6ed3d commit 3f85d53

7 files changed

+48
-39
lines changed

‎packages/legacy-events/PluginModuleType.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export type PluginModule<NativeEvent> = {
2929
nativeTarget: NativeEvent,
3030
nativeEventTarget: null | EventTarget,
3131
eventSystemFlags: EventSystemFlags,
32+
container?: Document | Element | Node,
3233
) => ?ReactSyntheticEvent,
3334
tapMoveThreshold?: number,
34-
...
3535
};

‎packages/legacy-events/ReactSyntheticEventType.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,4 @@ export type ReactSyntheticEvent = {|
3131
nativeEventTarget: EventTarget,
3232
) => ReactSyntheticEvent,
3333
isPersistent: () => boolean,
34-
|} & SyntheticEvent<>;
34+
|};

‎packages/react-dom/src/client/ReactDOMRoot.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,7 @@ function createRootImpl(
123123
container.nodeType === DOCUMENT_NODE
124124
? container
125125
: container.ownerDocument;
126-
eagerlyTrapReplayableEvents(doc);
126+
eagerlyTrapReplayableEvents(container, doc);
127127
}
128128
return root;
129129
}

‎packages/react-dom/src/events/DOMLegacyEventPluginSystem.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -264,7 +264,7 @@ function handleTopLevel(bookKeeping: BookKeepingInstance) {
264264
}
265265
}
266266

267-
export function dispatchEventForPluginEventSystem(
267+
export function dispatchEventForLegacyPluginEventSystem(
268268
topLevelType: DOMTopLevelEventType,
269269
eventSystemFlags: EventSystemFlags,
270270
nativeEvent: AnyNativeEvent,
@@ -311,16 +311,16 @@ export function legacyListenToEvent(
311311
registrationName: string,
312312
mountAt: Document | Element | Node,
313313
): void {
314-
const listeningSet = getListenerMapForElement(mountAt);
314+
const listenerMap = getListenerMapForElement(mountAt);
315315
const dependencies = registrationNameDependencies[registrationName];
316316

317317
for (let i = 0; i < dependencies.length; i++) {
318318
const dependency = dependencies[i];
319-
listenToTopLevelEvent(dependency, mountAt, listeningSet);
319+
legacyListenToTopLevelEvent(dependency, mountAt, listenerMap);
320320
}
321321
}
322322

323-
export function listenToTopLevelEvent(
323+
export function legacyListenToTopLevelEvent(
324324
topLevelType: DOMTopLevelEventType,
325325
mountAt: Document | Element | Node,
326326
listenerMap: Map<DOMTopLevelEventType | string, null | (any => void)>,

‎packages/react-dom/src/events/ReactDOMEventListener.js

+10-10
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ import {
6060
DiscreteEvent,
6161
} from 'shared/ReactTypes';
6262
import {getEventPriorityForPluginSystem} from './DOMEventProperties';
63-
import {dispatchEventForPluginEventSystem} from './DOMLegacyEventPluginSystem';
63+
import {dispatchEventForLegacyPluginEventSystem} from './DOMLegacyEventPluginSystem';
6464

6565
const {
6666
unstable_UserBlockingPriority: UserBlockingPriority,
@@ -242,17 +242,17 @@ export function dispatchEvent(
242242
null, // Flags that we're not actually blocked on anything as far as we know.
243243
topLevelType,
244244
eventSystemFlags,
245-
nativeEvent,
246245
container,
246+
nativeEvent,
247247
);
248248
return;
249249
}
250250

251251
const blockedOn = attemptToDispatchEvent(
252252
topLevelType,
253253
eventSystemFlags,
254-
nativeEvent,
255254
container,
255+
nativeEvent,
256256
);
257257

258258
if (blockedOn === null) {
@@ -267,8 +267,8 @@ export function dispatchEvent(
267267
blockedOn,
268268
topLevelType,
269269
eventSystemFlags,
270-
nativeEvent,
271270
container,
271+
nativeEvent,
272272
);
273273
return;
274274
}
@@ -278,8 +278,8 @@ export function dispatchEvent(
278278
blockedOn,
279279
topLevelType,
280280
eventSystemFlags,
281-
nativeEvent,
282281
container,
282+
nativeEvent,
283283
)
284284
) {
285285
return;
@@ -293,7 +293,7 @@ export function dispatchEvent(
293293
// in case the event system needs to trace it.
294294
if (enableDeprecatedFlareAPI) {
295295
if (eventSystemFlags & PLUGIN_EVENT_SYSTEM) {
296-
dispatchEventForPluginEventSystem(
296+
dispatchEventForLegacyPluginEventSystem(
297297
topLevelType,
298298
eventSystemFlags,
299299
nativeEvent,
@@ -311,7 +311,7 @@ export function dispatchEvent(
311311
);
312312
}
313313
} else {
314-
dispatchEventForPluginEventSystem(
314+
dispatchEventForLegacyPluginEventSystem(
315315
topLevelType,
316316
eventSystemFlags,
317317
nativeEvent,
@@ -324,8 +324,8 @@ export function dispatchEvent(
324324
export function attemptToDispatchEvent(
325325
topLevelType: DOMTopLevelEventType,
326326
eventSystemFlags: EventSystemFlags,
327-
nativeEvent: AnyNativeEvent,
328327
container: Document | Element | Node,
328+
nativeEvent: AnyNativeEvent,
329329
): null | Container | SuspenseInstance {
330330
// TODO: Warn if _enabled is false.
331331

@@ -372,7 +372,7 @@ export function attemptToDispatchEvent(
372372

373373
if (enableDeprecatedFlareAPI) {
374374
if (eventSystemFlags & PLUGIN_EVENT_SYSTEM) {
375-
dispatchEventForPluginEventSystem(
375+
dispatchEventForLegacyPluginEventSystem(
376376
topLevelType,
377377
eventSystemFlags,
378378
nativeEvent,
@@ -390,7 +390,7 @@ export function attemptToDispatchEvent(
390390
);
391391
}
392392
} else {
393-
dispatchEventForPluginEventSystem(
393+
dispatchEventForLegacyPluginEventSystem(
394394
topLevelType,
395395
eventSystemFlags,
396396
nativeEvent,

‎packages/react-dom/src/events/ReactDOMEventReplaying.js

+24-20
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import type {Container, SuspenseInstance} from '../client/ReactDOMHostConfig';
1212
import type {DOMTopLevelEventType} from 'legacy-events/TopLevelEventTypes';
1313
import type {EventSystemFlags} from 'legacy-events/EventSystemFlags';
1414
import type {FiberRoot} from 'react-reconciler/src/ReactFiberRoot';
15+
import type {DOMContainer} from '../client/ReactDOM';
1516

1617
import {
1718
enableDeprecatedFlareAPI,
@@ -117,7 +118,7 @@ import {
117118
TOP_BLUR,
118119
} from './DOMTopLevelEventTypes';
119120
import {IS_REPLAYED} from 'legacy-events/EventSystemFlags';
120-
import {listenToTopLevelEvent} from './DOMLegacyEventPluginSystem';
121+
import {legacyListenToTopLevelEvent} from './DOMLegacyEventPluginSystem';
121122

122123
type QueuedReplayableEvent = {|
123124
blockedOn: null | Container | SuspenseInstance,
@@ -211,12 +212,12 @@ export function isReplayableDiscreteEvent(
211212
return discreteReplayableEvents.indexOf(eventType) > -1;
212213
}
213214

214-
function trapReplayableEvent(
215+
function trapReplayableEventForDocument(
215216
topLevelType: DOMTopLevelEventType,
216217
document: Document,
217218
listenerMap: Map<DOMTopLevelEventType | string, null | (any => void)>,
218219
) {
219-
listenToTopLevelEvent(topLevelType, document, listenerMap);
220+
legacyListenToTopLevelEvent(topLevelType, document, listenerMap);
220221
if (enableDeprecatedFlareAPI) {
221222
// Trap events for the responder system.
222223
const topLevelTypeString = unsafeCastDOMTopLevelTypeToString(topLevelType);
@@ -236,24 +237,27 @@ function trapReplayableEvent(
236237
}
237238
}
238239

239-
export function eagerlyTrapReplayableEvents(document: Document) {
240-
const listenerMap = getListenerMapForElement(document);
240+
export function eagerlyTrapReplayableEvents(
241+
container: DOMContainer,
242+
document: Document,
243+
) {
244+
const listenerMapForDoc = getListenerMapForElement(document);
241245
// Discrete
242246
discreteReplayableEvents.forEach(topLevelType => {
243-
trapReplayableEvent(topLevelType, document, listenerMap);
247+
trapReplayableEventForDocument(topLevelType, document, listenerMapForDoc);
244248
});
245249
// Continuous
246250
continuousReplayableEvents.forEach(topLevelType => {
247-
trapReplayableEvent(topLevelType, document, listenerMap);
251+
trapReplayableEventForDocument(topLevelType, document, listenerMapForDoc);
248252
});
249253
}
250254

251255
function createQueuedReplayableEvent(
252256
blockedOn: null | Container | SuspenseInstance,
253257
topLevelType: DOMTopLevelEventType,
254258
eventSystemFlags: EventSystemFlags,
255-
nativeEvent: AnyNativeEvent,
256259
container: Document | Element | Node,
260+
nativeEvent: AnyNativeEvent,
257261
): QueuedReplayableEvent {
258262
return {
259263
blockedOn,
@@ -268,15 +272,15 @@ export function queueDiscreteEvent(
268272
blockedOn: null | Container | SuspenseInstance,
269273
topLevelType: DOMTopLevelEventType,
270274
eventSystemFlags: EventSystemFlags,
271-
nativeEvent: AnyNativeEvent,
272275
container: Document | Element | Node,
276+
nativeEvent: AnyNativeEvent,
273277
): void {
274278
const queuedEvent = createQueuedReplayableEvent(
275279
blockedOn,
276280
topLevelType,
277281
eventSystemFlags,
278-
nativeEvent,
279282
container,
283+
nativeEvent,
280284
);
281285
queuedDiscreteEvents.push(queuedEvent);
282286
if (enableSelectiveHydration) {
@@ -343,8 +347,8 @@ function accumulateOrCreateContinuousQueuedReplayableEvent(
343347
blockedOn: null | Container | SuspenseInstance,
344348
topLevelType: DOMTopLevelEventType,
345349
eventSystemFlags: EventSystemFlags,
346-
nativeEvent: AnyNativeEvent,
347350
container: Document | Element | Node,
351+
nativeEvent: AnyNativeEvent,
348352
): QueuedReplayableEvent {
349353
if (
350354
existingQueuedEvent === null ||
@@ -354,8 +358,8 @@ function accumulateOrCreateContinuousQueuedReplayableEvent(
354358
blockedOn,
355359
topLevelType,
356360
eventSystemFlags,
357-
nativeEvent,
358361
container,
362+
nativeEvent,
359363
);
360364
if (blockedOn !== null) {
361365
let fiber = getInstanceFromNode(blockedOn);
@@ -378,8 +382,8 @@ export function queueIfContinuousEvent(
378382
blockedOn: null | Container | SuspenseInstance,
379383
topLevelType: DOMTopLevelEventType,
380384
eventSystemFlags: EventSystemFlags,
381-
nativeEvent: AnyNativeEvent,
382385
container: Document | Element | Node,
386+
nativeEvent: AnyNativeEvent,
383387
): boolean {
384388
// These set relatedTarget to null because the replayed event will be treated as if we
385389
// moved from outside the window (no target) onto the target once it hydrates.
@@ -392,8 +396,8 @@ export function queueIfContinuousEvent(
392396
blockedOn,
393397
topLevelType,
394398
eventSystemFlags,
395-
focusEvent,
396399
container,
400+
focusEvent,
397401
);
398402
return true;
399403
}
@@ -404,8 +408,8 @@ export function queueIfContinuousEvent(
404408
blockedOn,
405409
topLevelType,
406410
eventSystemFlags,
407-
dragEvent,
408411
container,
412+
dragEvent,
409413
);
410414
return true;
411415
}
@@ -416,8 +420,8 @@ export function queueIfContinuousEvent(
416420
blockedOn,
417421
topLevelType,
418422
eventSystemFlags,
419-
mouseEvent,
420423
container,
424+
mouseEvent,
421425
);
422426
return true;
423427
}
@@ -431,8 +435,8 @@ export function queueIfContinuousEvent(
431435
blockedOn,
432436
topLevelType,
433437
eventSystemFlags,
434-
pointerEvent,
435438
container,
439+
pointerEvent,
436440
),
437441
);
438442
return true;
@@ -447,8 +451,8 @@ export function queueIfContinuousEvent(
447451
blockedOn,
448452
topLevelType,
449453
eventSystemFlags,
450-
pointerEvent,
451454
container,
455+
pointerEvent,
452456
),
453457
);
454458
return true;
@@ -524,8 +528,8 @@ function attemptReplayContinuousQueuedEvent(
524528
let nextBlockedOn = attemptToDispatchEvent(
525529
queuedEvent.topLevelType,
526530
queuedEvent.eventSystemFlags,
527-
queuedEvent.nativeEvent,
528531
queuedEvent.container,
532+
queuedEvent.nativeEvent,
529533
);
530534
if (nextBlockedOn !== null) {
531535
// We're still blocked. Try again later.
@@ -567,8 +571,8 @@ function replayUnblockedEvents() {
567571
let nextBlockedOn = attemptToDispatchEvent(
568572
nextDiscreteEvent.topLevelType,
569573
nextDiscreteEvent.eventSystemFlags,
570-
nextDiscreteEvent.nativeEvent,
571574
nextDiscreteEvent.container,
575+
nextDiscreteEvent.nativeEvent,
572576
);
573577
if (nextBlockedOn !== null) {
574578
// We're still blocked. Try again later.

‎packages/react-dom/src/events/SelectEventPlugin.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -166,11 +166,16 @@ const SelectEventPlugin = {
166166
nativeEvent,
167167
nativeEventTarget,
168168
eventSystemFlags,
169+
container,
169170
) {
170-
const doc = getEventTargetDocument(nativeEventTarget);
171+
const containerOrDoc =
172+
container || getEventTargetDocument(nativeEventTarget);
171173
// Track whether all listeners exists for this plugin. If none exist, we do
172174
// not extract events. See #3639.
173-
if (!doc || !isListeningToAllDependencies('onSelect', doc)) {
175+
if (
176+
!containerOrDoc ||
177+
!isListeningToAllDependencies('onSelect', containerOrDoc)
178+
) {
174179
return null;
175180
}
176181

0 commit comments

Comments
 (0)