Skip to content

Commit fd3e8cb

Browse files
authored
[react-events] Remove stopPropagation (Press) + use document for delegation (#16730)
1 parent 38c03ce commit fd3e8cb

File tree

4 files changed

+5
-50
lines changed

4 files changed

+5
-50
lines changed

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

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -867,17 +867,16 @@ export function mountResponderInstance(
867867
): ReactDOMEventResponderInstance {
868868
// Listen to events
869869
const doc = instance.ownerDocument;
870-
const documentBody = doc.body || doc;
871870
const {
872871
rootEventTypes,
873872
targetEventTypes,
874873
} = ((responder: any): ReactDOMEventResponder);
875874
if (targetEventTypes !== null) {
876-
listenToEventResponderEventTypes(targetEventTypes, documentBody);
875+
listenToEventResponderEventTypes(targetEventTypes, doc);
877876
}
878877
if (rootEventTypes !== null) {
879878
addRootEventTypesForResponderInstance(responderInstance, rootEventTypes);
880-
listenToEventResponderEventTypes(rootEventTypes, documentBody);
879+
listenToEventResponderEventTypes(rootEventTypes, doc);
881880
}
882881
mountEventResponder(
883882
responder,

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

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -181,8 +181,7 @@ const eventResponderContext: ReactDOMResponderContext = {
181181
},
182182
addRootEventTypes(rootEventTypes: Array<string>): void {
183183
validateResponderContext();
184-
const activeDocument = getActiveDocument();
185-
listenToResponderEventTypesImpl(rootEventTypes, activeDocument);
184+
listenToResponderEventTypesImpl(rootEventTypes, currentDocument);
186185
for (let i = 0; i < rootEventTypes.length; i++) {
187186
const rootEventType = rootEventTypes[i];
188187
const eventResponderInstance = ((currentInstance: any): ReactDOMEventResponderInstance);

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

Lines changed: 2 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ type PressProps = {|
2929
left: number,
3030
},
3131
preventDefault: boolean,
32-
stopPropagation: boolean,
3332
onPress: (e: PressEvent) => void,
3433
onPressChange: boolean => void,
3534
onPressEnd: (e: PressEvent) => void,
@@ -112,13 +111,7 @@ const DEFAULT_PRESS_RETENTION_OFFSET = {
112111
};
113112

114113
const targetEventTypes = hasPointerEvents
115-
? [
116-
'keydown_active',
117-
// We need to preventDefault on pointerdown for mouse/pen events
118-
// that are in hit target area but not the element area.
119-
'pointerdown_active',
120-
'click_active',
121-
]
114+
? ['keydown_active', 'pointerdown', 'click_active']
122115
: ['keydown_active', 'touchstart', 'mousedown', 'click_active'];
123116

124117
const rootEventTypes = hasPointerEvents
@@ -132,9 +125,7 @@ const rootEventTypes = hasPointerEvents
132125
'touchcancel',
133126
// Used as a 'cancel' signal for mouse interactions
134127
'dragstart',
135-
// We listen to this here so stopPropagation can
136-
// block other mouseup events used internally
137-
'mouseup_active',
128+
'mouseup',
138129
'touchend',
139130
];
140131

@@ -465,17 +456,6 @@ function updateIsPressWithinResponderRegion(
465456
(x >= left && x <= right && y >= top && y <= bottom);
466457
}
467458

468-
function handleStopPropagation(
469-
props: PressProps,
470-
context: ReactDOMResponderContext,
471-
nativeEvent,
472-
): void {
473-
const stopPropagation = props.stopPropagation;
474-
if (stopPropagation === true) {
475-
nativeEvent.stopPropagation();
476-
}
477-
}
478-
479459
// After some investigation work, screen reader virtual
480460
// clicks (NVDA, Jaws, VoiceOver) do not have co-ords associated with the click
481461
// event and "detail" is always 0 (where normal clicks are > 0)
@@ -532,8 +512,6 @@ const pressResponderImpl = {
532512
const nativeEvent: any = event.nativeEvent;
533513
const isPressed = state.isPressed;
534514

535-
handleStopPropagation(props, context, nativeEvent);
536-
537515
switch (type) {
538516
// START
539517
case 'pointerdown':
@@ -659,8 +637,6 @@ const pressResponderImpl = {
659637
const activePointerId = state.activePointerId;
660638
const previousPointerType = state.pointerType;
661639

662-
handleStopPropagation(props, context, nativeEvent);
663-
664640
switch (type) {
665641
// MOVE
666642
case 'pointermove':

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

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -739,7 +739,6 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
739739
onPressMove: createEventHandler('inner: onPressMove'),
740740
onPressStart: createEventHandler('inner: onPressStart'),
741741
onPressEnd: createEventHandler('inner: onPressEnd'),
742-
stopPropagation: false,
743742
});
744743
return (
745744
<div
@@ -1119,22 +1118,4 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => {
11191118
target.pointerup();
11201119
target.pointerdown();
11211120
});
1122-
1123-
if (hasPointerEvents) {
1124-
it('should work correctly with stopPropagation set to true', () => {
1125-
const ref = React.createRef();
1126-
const pointerDownEvent = jest.fn();
1127-
1128-
const Component = () => {
1129-
const listener = usePress({stopPropagation: true});
1130-
return <div ref={ref} listeners={listener} />;
1131-
};
1132-
1133-
container.addEventListener('pointerdown', pointerDownEvent);
1134-
ReactDOM.render(<Component />, container);
1135-
createEventTarget(ref.current).pointerdown();
1136-
container.removeEventListener('pointerdown', pointerDownEvent);
1137-
expect(pointerDownEvent).toHaveBeenCalledTimes(0);
1138-
});
1139-
}
11401121
});

0 commit comments

Comments
 (0)