Skip to content

Commit 2afeebd

Browse files
authored
[react-interactions] Remove responder root event types + revert commit phase change (#17577)
1 parent 9ac42dd commit 2afeebd

File tree

6 files changed

+19
-117
lines changed

6 files changed

+19
-117
lines changed

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

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,6 @@ import type {
5252
ReactDOMFundamentalComponentInstance,
5353
} from 'shared/ReactDOMTypes';
5454
import {
55-
addRootEventTypesForResponderInstance,
5655
mountEventResponder,
5756
unmountEventResponder,
5857
dispatchEventForResponderEventSystem,
@@ -954,17 +953,10 @@ export function mountResponderInstance(
954953
): ReactDOMEventResponderInstance {
955954
// Listen to events
956955
const doc = instance.ownerDocument;
957-
const {
958-
rootEventTypes,
959-
targetEventTypes,
960-
} = ((responder: any): ReactDOMEventResponder);
956+
const {targetEventTypes} = ((responder: any): ReactDOMEventResponder);
961957
if (targetEventTypes !== null) {
962958
listenToEventResponderEventTypes(targetEventTypes, doc);
963959
}
964-
if (rootEventTypes !== null) {
965-
addRootEventTypesForResponderInstance(responderInstance, rootEventTypes);
966-
listenToEventResponderEventTypes(rootEventTypes, doc);
967-
}
968960
mountEventResponder(
969961
responder,
970962
responderInstance,

packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js

Lines changed: 0 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ const DiscreteEvent = 0;
2323
function createEventResponder({
2424
onEvent,
2525
onRootEvent,
26-
rootEventTypes,
2726
targetEventTypes,
2827
onMount,
2928
onUnmount,
@@ -32,7 +31,6 @@ function createEventResponder({
3231
}) {
3332
return React.unstable_createResponder('TestEventResponder', {
3433
targetEventTypes,
35-
rootEventTypes,
3634
onEvent,
3735
onRootEvent,
3836
onMount,
@@ -616,43 +614,6 @@ describe('DOMEventResponderSystem', () => {
616614
expect(counter).toEqual(5);
617615
});
618616

619-
it('the event responder root listeners should fire on a root click event', () => {
620-
let eventResponderFiredCount = 0;
621-
let eventLog = [];
622-
623-
const TestResponder = createEventResponder({
624-
rootEventTypes: ['click'],
625-
onRootEvent: event => {
626-
eventResponderFiredCount++;
627-
eventLog.push({
628-
name: event.type,
629-
passive: event.passive,
630-
phase: 'root',
631-
});
632-
},
633-
});
634-
635-
const Test = () => {
636-
const listener = React.unstable_useResponder(TestResponder, {});
637-
return <button DEPRECATED_flareListeners={listener}>Click me!</button>;
638-
};
639-
640-
ReactDOM.render(<Test />, container);
641-
expect(container.innerHTML).toBe('<button>Click me!</button>');
642-
643-
// Clicking the button should trigger the event responder onEvent() twice
644-
dispatchClickEvent(document.body);
645-
expect(eventResponderFiredCount).toBe(1);
646-
expect(eventLog.length).toBe(1);
647-
expect(eventLog).toEqual([
648-
{
649-
name: 'click',
650-
passive: false,
651-
phase: 'root',
652-
},
653-
]);
654-
});
655-
656617
it('the event responder target listeners should correctly fire for only their events', () => {
657618
let clickEventComponent1Fired = 0;
658619
let clickEventComponent2Fired = 0;
@@ -714,65 +675,6 @@ describe('DOMEventResponderSystem', () => {
714675
]);
715676
});
716677

717-
it('the event responder root listeners should correctly fire for only their events', () => {
718-
let clickEventComponent1Fired = 0;
719-
let clickEventComponent2Fired = 0;
720-
let eventLog = [];
721-
722-
const TestResponderA = createEventResponder({
723-
rootEventTypes: ['click_active'],
724-
onRootEvent: event => {
725-
clickEventComponent1Fired++;
726-
eventLog.push({
727-
name: event.type,
728-
passive: event.passive,
729-
});
730-
},
731-
});
732-
733-
const TestResponderB = createEventResponder({
734-
rootEventTypes: ['click'],
735-
onRootEvent: event => {
736-
clickEventComponent2Fired++;
737-
eventLog.push({
738-
name: event.type,
739-
passive: event.passive,
740-
});
741-
},
742-
});
743-
744-
const Test = () => {
745-
const listener = React.unstable_useResponder(TestResponderA, {});
746-
const listener2 = React.unstable_useResponder(TestResponderB, {});
747-
748-
return (
749-
<div DEPRECATED_flareListeners={listener}>
750-
<button DEPRECATED_flareListeners={listener2}>Click me!</button>
751-
</div>
752-
);
753-
};
754-
755-
ReactDOM.render(<Test />, container);
756-
757-
dispatchClickEvent(document.body);
758-
759-
expect(clickEventComponent1Fired).toBe(1);
760-
expect(clickEventComponent2Fired).toBe(1);
761-
expect(eventLog.length).toBe(2);
762-
expect(eventLog).toEqual([
763-
{
764-
name: 'click',
765-
passive: false,
766-
},
767-
{
768-
name: 'click',
769-
passive: false,
770-
},
771-
]);
772-
773-
ReactDOM.render(<Test />, container);
774-
});
775-
776678
it('the event responder system should warn on accessing invalid properties', () => {
777679
const TestResponder = createEventResponder({
778680
targetEventTypes: ['click'],

packages/react-native-renderer/src/ReactFabricHostConfig.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ import warningWithoutStack from 'shared/warningWithoutStack';
2929

3030
import {dispatchEvent} from './ReactFabricEventEmitter';
3131
import {
32-
addRootEventTypesForResponderInstance,
3332
mountEventResponder,
3433
unmountEventResponder,
3534
} from './ReactFabricEventResponderSystem';
@@ -453,10 +452,6 @@ export function mountResponderInstance(
453452
instance: Instance,
454453
) {
455454
if (enableFlareAPI) {
456-
const {rootEventTypes} = responder;
457-
if (rootEventTypes !== null) {
458-
addRootEventTypesForResponderInstance(responderInstance, rootEventTypes);
459-
}
460455
mountEventResponder(responder, responderInstance, props, state);
461456
}
462457
}

packages/react-reconciler/src/ReactFiberCommitWork.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1357,7 +1357,7 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
13571357
if (enableFlareAPI) {
13581358
const prevListeners = oldProps.DEPRECATED_flareListeners;
13591359
const nextListeners = newProps.DEPRECATED_flareListeners;
1360-
if (prevListeners !== nextListeners || current === null) {
1360+
if (prevListeners !== nextListeners) {
13611361
updateLegacyEventListeners(nextListeners, finishedWork, null);
13621362
}
13631363
}

packages/react-reconciler/src/ReactFiberCompleteWork.js

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -128,6 +128,7 @@ import {
128128
import {createFundamentalStateInstance} from './ReactFiberFundamental';
129129
import {Never} from './ReactFiberExpirationTime';
130130
import {resetChildFibers} from './ReactChildFiber';
131+
import {updateLegacyEventListeners} from './ReactFiberEvents';
131132
import {createScopeMethods} from './ReactFiberScope';
132133

133134
function markUpdate(workInProgress: Fiber) {
@@ -729,7 +730,11 @@ function completeWork(
729730
if (enableFlareAPI) {
730731
const listeners = newProps.DEPRECATED_flareListeners;
731732
if (listeners != null) {
732-
markUpdate(workInProgress);
733+
updateLegacyEventListeners(
734+
listeners,
735+
workInProgress,
736+
rootContainerInstance,
737+
);
733738
}
734739
}
735740
} else {
@@ -749,7 +754,11 @@ function completeWork(
749754
if (enableFlareAPI) {
750755
const listeners = newProps.DEPRECATED_flareListeners;
751756
if (listeners != null) {
752-
markUpdate(workInProgress);
757+
updateLegacyEventListeners(
758+
listeners,
759+
workInProgress,
760+
rootContainerInstance,
761+
);
753762
}
754763
}
755764

@@ -1255,7 +1264,12 @@ function completeWork(
12551264
if (enableFlareAPI) {
12561265
const listeners = newProps.DEPRECATED_flareListeners;
12571266
if (listeners != null) {
1258-
markUpdate(workInProgress);
1267+
const rootContainerInstance = getRootHostContainer();
1268+
updateLegacyEventListeners(
1269+
listeners,
1270+
workInProgress,
1271+
rootContainerInstance,
1272+
);
12591273
}
12601274
}
12611275
if (workInProgress.ref !== null) {

packages/shared/ReactTypes.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,6 @@ export type ReactEventResponder<E, C> = {
9797
displayName: string,
9898
targetEventTypes: null | Array<string>,
9999
targetPortalPropagation: boolean,
100-
rootEventTypes: null | Array<string>,
101100
getInitialState: null | ((props: Object) => Object),
102101
onEvent:
103102
| null

0 commit comments

Comments
 (0)