Skip to content

Commit 1000f61

Browse files
authored
Add container to event listener signature (#18075)
1 parent a12dd52 commit 1000f61

File tree

5 files changed

+68
-15
lines changed

5 files changed

+68
-15
lines changed

packages/legacy-events/ReactGenericBatching.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,8 @@ import {invokeGuardedCallbackAndCatchFirstError} from 'shared/ReactErrorUtils';
2323
let batchedUpdatesImpl = function(fn, bookkeeping) {
2424
return fn(bookkeeping);
2525
};
26-
let discreteUpdatesImpl = function(fn, a, b, c) {
27-
return fn(a, b, c);
26+
let discreteUpdatesImpl = function(fn, a, b, c, d) {
27+
return fn(a, b, c, d);
2828
};
2929
let flushDiscreteUpdatesImpl = function() {};
3030
let batchedEventUpdatesImpl = batchedUpdatesImpl;
@@ -89,11 +89,11 @@ export function executeUserEventHandler(fn: any => void, value: any): void {
8989
}
9090
}
9191

92-
export function discreteUpdates(fn, a, b, c) {
92+
export function discreteUpdates(fn, a, b, c, d) {
9393
const prevIsInsideEventHandler = isInsideEventHandler;
9494
isInsideEventHandler = true;
9595
try {
96-
return discreteUpdatesImpl(fn, a, b, c);
96+
return discreteUpdatesImpl(fn, a, b, c, d);
9797
} finally {
9898
isInsideEventHandler = prevIsInsideEventHandler;
9999
if (!isInsideEventHandler) {

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

+45-8
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,7 @@ export function addResponderEventSystemEvent(
119119
null,
120120
((topLevelType: any): DOMTopLevelEventType),
121121
eventFlags,
122+
document,
122123
);
123124
if (passiveBrowserEventsSupported) {
124125
addEventCaptureListenerWithPassiveFlag(
@@ -149,7 +150,7 @@ export function removeActiveResponderEventSystemEvent(
149150
}
150151

151152
function trapEventForPluginEventSystem(
152-
element: Document | Element | Node,
153+
container: Document | Element | Node,
153154
topLevelType: DOMTopLevelEventType,
154155
capture: boolean,
155156
): void {
@@ -160,48 +161,74 @@ function trapEventForPluginEventSystem(
160161
null,
161162
topLevelType,
162163
PLUGIN_EVENT_SYSTEM,
164+
container,
163165
);
164166
break;
165167
case UserBlockingEvent:
166168
listener = dispatchUserBlockingUpdate.bind(
167169
null,
168170
topLevelType,
169171
PLUGIN_EVENT_SYSTEM,
172+
container,
170173
);
171174
break;
172175
case ContinuousEvent:
173176
default:
174-
listener = dispatchEvent.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM);
177+
listener = dispatchEvent.bind(
178+
null,
179+
topLevelType,
180+
PLUGIN_EVENT_SYSTEM,
181+
container,
182+
);
175183
break;
176184
}
177185

178186
const rawEventName = getRawEventName(topLevelType);
179187
if (capture) {
180-
addEventCaptureListener(element, rawEventName, listener);
188+
addEventCaptureListener(container, rawEventName, listener);
181189
} else {
182-
addEventBubbleListener(element, rawEventName, listener);
190+
addEventBubbleListener(container, rawEventName, listener);
183191
}
184192
}
185193

186-
function dispatchDiscreteEvent(topLevelType, eventSystemFlags, nativeEvent) {
194+
function dispatchDiscreteEvent(
195+
topLevelType,
196+
eventSystemFlags,
197+
container,
198+
nativeEvent,
199+
) {
187200
flushDiscreteUpdatesIfNeeded(nativeEvent.timeStamp);
188-
discreteUpdates(dispatchEvent, topLevelType, eventSystemFlags, nativeEvent);
201+
discreteUpdates(
202+
dispatchEvent,
203+
topLevelType,
204+
eventSystemFlags,
205+
container,
206+
nativeEvent,
207+
);
189208
}
190209

191210
function dispatchUserBlockingUpdate(
192211
topLevelType,
193212
eventSystemFlags,
213+
container,
194214
nativeEvent,
195215
) {
196216
runWithPriority(
197217
UserBlockingPriority,
198-
dispatchEvent.bind(null, topLevelType, eventSystemFlags, nativeEvent),
218+
dispatchEvent.bind(
219+
null,
220+
topLevelType,
221+
eventSystemFlags,
222+
container,
223+
nativeEvent,
224+
),
199225
);
200226
}
201227

202228
export function dispatchEvent(
203229
topLevelType: DOMTopLevelEventType,
204230
eventSystemFlags: EventSystemFlags,
231+
container: Document | Element | Node,
205232
nativeEvent: AnyNativeEvent,
206233
): void {
207234
if (!_enabled) {
@@ -216,6 +243,7 @@ export function dispatchEvent(
216243
topLevelType,
217244
eventSystemFlags,
218245
nativeEvent,
246+
container,
219247
);
220248
return;
221249
}
@@ -224,6 +252,7 @@ export function dispatchEvent(
224252
topLevelType,
225253
eventSystemFlags,
226254
nativeEvent,
255+
container,
227256
);
228257

229258
if (blockedOn === null) {
@@ -234,7 +263,13 @@ export function dispatchEvent(
234263

235264
if (isReplayableDiscreteEvent(topLevelType)) {
236265
// This this to be replayed later once the target is available.
237-
queueDiscreteEvent(blockedOn, topLevelType, eventSystemFlags, nativeEvent);
266+
queueDiscreteEvent(
267+
blockedOn,
268+
topLevelType,
269+
eventSystemFlags,
270+
nativeEvent,
271+
container,
272+
);
238273
return;
239274
}
240275

@@ -244,6 +279,7 @@ export function dispatchEvent(
244279
topLevelType,
245280
eventSystemFlags,
246281
nativeEvent,
282+
container,
247283
)
248284
) {
249285
return;
@@ -289,6 +325,7 @@ export function attemptToDispatchEvent(
289325
topLevelType: DOMTopLevelEventType,
290326
eventSystemFlags: EventSystemFlags,
291327
nativeEvent: AnyNativeEvent,
328+
container: Document | Element | Node,
292329
): null | Container | SuspenseInstance {
293330
// TODO: Warn if _enabled is false.
294331

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

+15
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@ type QueuedReplayableEvent = {|
124124
topLevelType: DOMTopLevelEventType,
125125
eventSystemFlags: EventSystemFlags,
126126
nativeEvent: AnyNativeEvent,
127+
container: Document | Element | Node,
127128
|};
128129

129130
let hasScheduledReplayAttempt = false;
@@ -252,12 +253,14 @@ function createQueuedReplayableEvent(
252253
topLevelType: DOMTopLevelEventType,
253254
eventSystemFlags: EventSystemFlags,
254255
nativeEvent: AnyNativeEvent,
256+
container: Document | Element | Node,
255257
): QueuedReplayableEvent {
256258
return {
257259
blockedOn,
258260
topLevelType,
259261
eventSystemFlags: eventSystemFlags | IS_REPLAYED,
260262
nativeEvent,
263+
container,
261264
};
262265
}
263266

@@ -266,12 +269,14 @@ export function queueDiscreteEvent(
266269
topLevelType: DOMTopLevelEventType,
267270
eventSystemFlags: EventSystemFlags,
268271
nativeEvent: AnyNativeEvent,
272+
container: Document | Element | Node,
269273
): void {
270274
const queuedEvent = createQueuedReplayableEvent(
271275
blockedOn,
272276
topLevelType,
273277
eventSystemFlags,
274278
nativeEvent,
279+
container,
275280
);
276281
queuedDiscreteEvents.push(queuedEvent);
277282
if (enableSelectiveHydration) {
@@ -339,6 +344,7 @@ function accumulateOrCreateContinuousQueuedReplayableEvent(
339344
topLevelType: DOMTopLevelEventType,
340345
eventSystemFlags: EventSystemFlags,
341346
nativeEvent: AnyNativeEvent,
347+
container: Document | Element | Node,
342348
): QueuedReplayableEvent {
343349
if (
344350
existingQueuedEvent === null ||
@@ -349,6 +355,7 @@ function accumulateOrCreateContinuousQueuedReplayableEvent(
349355
topLevelType,
350356
eventSystemFlags,
351357
nativeEvent,
358+
container,
352359
);
353360
if (blockedOn !== null) {
354361
let fiber = getInstanceFromNode(blockedOn);
@@ -372,6 +379,7 @@ export function queueIfContinuousEvent(
372379
topLevelType: DOMTopLevelEventType,
373380
eventSystemFlags: EventSystemFlags,
374381
nativeEvent: AnyNativeEvent,
382+
container: Document | Element | Node,
375383
): boolean {
376384
// These set relatedTarget to null because the replayed event will be treated as if we
377385
// moved from outside the window (no target) onto the target once it hydrates.
@@ -385,6 +393,7 @@ export function queueIfContinuousEvent(
385393
topLevelType,
386394
eventSystemFlags,
387395
focusEvent,
396+
container,
388397
);
389398
return true;
390399
}
@@ -396,6 +405,7 @@ export function queueIfContinuousEvent(
396405
topLevelType,
397406
eventSystemFlags,
398407
dragEvent,
408+
container,
399409
);
400410
return true;
401411
}
@@ -407,6 +417,7 @@ export function queueIfContinuousEvent(
407417
topLevelType,
408418
eventSystemFlags,
409419
mouseEvent,
420+
container,
410421
);
411422
return true;
412423
}
@@ -421,6 +432,7 @@ export function queueIfContinuousEvent(
421432
topLevelType,
422433
eventSystemFlags,
423434
pointerEvent,
435+
container,
424436
),
425437
);
426438
return true;
@@ -436,6 +448,7 @@ export function queueIfContinuousEvent(
436448
topLevelType,
437449
eventSystemFlags,
438450
pointerEvent,
451+
container,
439452
),
440453
);
441454
return true;
@@ -512,6 +525,7 @@ function attemptReplayContinuousQueuedEvent(
512525
queuedEvent.topLevelType,
513526
queuedEvent.eventSystemFlags,
514527
queuedEvent.nativeEvent,
528+
queuedEvent.container,
515529
);
516530
if (nextBlockedOn !== null) {
517531
// We're still blocked. Try again later.
@@ -554,6 +568,7 @@ function replayUnblockedEvents() {
554568
nextDiscreteEvent.topLevelType,
555569
nextDiscreteEvent.eventSystemFlags,
556570
nextDiscreteEvent.nativeEvent,
571+
nextDiscreteEvent.container,
557572
);
558573
if (nextBlockedOn !== null) {
559574
// We're still blocked. Try again later.

packages/react-dom/src/test-utils/ReactTestUtils.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ let hasWarnedAboutDeprecatedMockComponent = false;
6262
*/
6363
function simulateNativeEventOnNode(topLevelType, node, fakeNativeEvent) {
6464
fakeNativeEvent.target = node;
65-
dispatchEvent(topLevelType, PLUGIN_EVENT_SYSTEM, fakeNativeEvent);
65+
dispatchEvent(topLevelType, PLUGIN_EVENT_SYSTEM, document, fakeNativeEvent);
6666
}
6767

6868
/**

packages/react-reconciler/src/ReactFiberWorkLoop.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -1160,17 +1160,18 @@ export function batchedEventUpdates<A, R>(fn: A => R, a: A): R {
11601160
}
11611161
}
11621162

1163-
export function discreteUpdates<A, B, C, R>(
1163+
export function discreteUpdates<A, B, C, D, R>(
11641164
fn: (A, B, C) => R,
11651165
a: A,
11661166
b: B,
11671167
c: C,
1168+
d: D,
11681169
): R {
11691170
const prevExecutionContext = executionContext;
11701171
executionContext |= DiscreteEventContext;
11711172
try {
11721173
// Should this
1173-
return runWithPriority(UserBlockingPriority, fn.bind(null, a, b, c));
1174+
return runWithPriority(UserBlockingPriority, fn.bind(null, a, b, c, d));
11741175
} finally {
11751176
executionContext = prevExecutionContext;
11761177
if (executionContext === NoContext) {

0 commit comments

Comments
 (0)