64ddef44c6 · samitouri/QOS-React-2

packages/react-dom/src/__tests__/ReactDOMEventListener-test.js

+17 -6

@@ -712,12 +712,23 @@ describe('ReactDOMEventListener', () => {

712 bubbles: false,

713 }),

714 );

715 - expect(log).toEqual([

716 - ['capture', 'grand'],

717 - ['capture', 'parent'],

718 - ['capture', 'child'],

719 - ['bubble', 'child'],

720 - ]);

715 + if (gate(flags => flags.disableOnScrollBubbling)) {

716 + expect(log).toEqual([

717 + ['capture', 'grand'],

718 + ['capture', 'parent'],

719 + ['capture', 'child'],

720 + ['bubble', 'child'],

721 + ]);

722 + } else {

723 + expect(log).toEqual([

724 + ['capture', 'grand'],

725 + ['capture', 'parent'],

726 + ['capture', 'child'],

727 + ['bubble', 'child'],

728 + ['bubble', 'parent'],

729 + ['bubble', 'grand'],

730 + ]);

731 + }

732 } finally {

733 document.body.removeChild(container);

734 }

packages/react-dom/src/__tests__/ReactDOMEventPropagation-test.js

+6

@@ -1225,6 +1225,12 @@ describe('ReactDOMEventListener', () => {

1225 });

1226

1227 describe('non-bubbling events that do not bubble in React', () => {

1228 + // This test will fail outside of the no-bubbling flag

1229 + // because its bubbling emulation is currently broken.

1230 + // In particular, if the target itself doesn't have

1231 + // a handler, it will not emulate bubbling correctly.

1232 + // Instead of fixing this, we'll just turn this flag on.

1233 + // @gate disableOnScrollBubbling

1234 it('onScroll', () => {

1235 testNonBubblingEvent({

1236 type: 'div',

packages/react-dom/src/events/plugins/SimpleEventPlugin.js

+13 -8

@@ -47,7 +47,10 @@ import {IS_EVENT_HANDLE_NON_MANAGED_NODE} from '../EventSystemFlags';

47 import getEventCharCode from '../getEventCharCode';

48 import {IS_CAPTURE_PHASE} from '../EventSystemFlags';

49

50 -import {enableCreateEventHandleAPI} from 'shared/ReactFeatureFlags';

50 +import {

51 + enableCreateEventHandleAPI,

52 + disableOnScrollBubbling,

53 +} from 'shared/ReactFeatureFlags';

54

55 function extractEvents(

56 dispatchQueue: DispatchQueue,

@@ -182,13 +185,15 @@ function extractEvents(

185 // In the past, React has always bubbled them, but this can be surprising.

186 // We're going to try aligning closer to the browser behavior by not bubbling

187 // them in React either. We'll start by not bubbling onScroll, and then expand.

185 - const accumulateTargetOnly =

186 - !inCapturePhase &&

187 - // TODO: ideally, we'd eventually add all events from

188 - // nonDelegatedEvents list in DOMPluginEventSystem.

189 - // Then we can remove this special list.

190 - // This is a breaking change that can wait until React 18.

191 - domEventName === 'scroll';

188 + let accumulateTargetOnly = false;

189 + if (disableOnScrollBubbling) {

190 + accumulateTargetOnly =

191 + !inCapturePhase &&

192 + // TODO: ideally, we'd eventually add all events from

193 + // nonDelegatedEvents list in DOMPluginEventSystem.

194 + // Then we can remove this special list.

195 + domEventName === 'scroll';

196 + }

197

198 accumulateSinglePhaseListeners(

199 targetInst,

packages/shared/ReactFeatureFlags.js

+1

@@ -135,3 +135,4 @@ export const enableDiscreteEventFlushingChange = false;

135

136 // https://github.com/facebook/react/pull/19654

137 export const enablePassiveEventIntervention = true;

138 +export const disableOnScrollBubbling = true;

packages/shared/forks/ReactFeatureFlags.native-fb.js

+1

@@ -44,6 +44,7 @@ export const enableComponentStackLocations = false;

44 export const enableLegacyFBSupport = false;

45 export const enableFilterEmptyStringAttributesDOM = false;

46 export const skipUnmountedBoundaries = false;

47 +export const disableOnScrollBubbling = true;

48

49 export const enableNewReconciler = false;

50 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.native-oss.js

+1

@@ -43,6 +43,7 @@ export const enableComponentStackLocations = false;

43 export const enableLegacyFBSupport = false;

44 export const enableFilterEmptyStringAttributesDOM = false;

45 export const skipUnmountedBoundaries = false;

46 +export const disableOnScrollBubbling = true;

47

48 export const enableNewReconciler = false;

49 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.test-renderer.js

+1

@@ -43,6 +43,7 @@ export const enableComponentStackLocations = true;

43 export const enableLegacyFBSupport = false;

44 export const enableFilterEmptyStringAttributesDOM = false;

45 export const skipUnmountedBoundaries = false;

46 +export const disableOnScrollBubbling = true;

47

48 export const enableNewReconciler = false;

49 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.test-renderer.www.js

+1

@@ -43,6 +43,7 @@ export const enableComponentStackLocations = true;

43 export const enableLegacyFBSupport = false;

44 export const enableFilterEmptyStringAttributesDOM = false;

45 export const skipUnmountedBoundaries = false;

46 +export const disableOnScrollBubbling = true;

47

48 export const enableNewReconciler = false;

49 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.testing.js

+1

@@ -43,6 +43,7 @@ export const enableComponentStackLocations = true;

43 export const enableLegacyFBSupport = false;

44 export const enableFilterEmptyStringAttributesDOM = false;

45 export const skipUnmountedBoundaries = false;

46 +export const disableOnScrollBubbling = true;

47

48 export const enableNewReconciler = false;

49 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.testing.www.js

+1

@@ -43,6 +43,7 @@ export const enableComponentStackLocations = true;

43 export const enableLegacyFBSupport = !__EXPERIMENTAL__;

44 export const enableFilterEmptyStringAttributesDOM = false;

45 export const skipUnmountedBoundaries = __EXPERIMENTAL__;

46 +export const disableOnScrollBubbling = true;

47

48 export const enableNewReconciler = false;

49 export const deferRenderPhaseUpdateToNextBatch = true;

packages/shared/forks/ReactFeatureFlags.www-dynamic.js

+1

@@ -20,6 +20,7 @@ export const enableLegacyFBSupport = __VARIANT__;

20 export const decoupleUpdatePriorityFromScheduler = __VARIANT__;

21 export const skipUnmountedBoundaries = __VARIANT__;

22 export const enablePassiveEventIntervention = __VARIANT__;

23 +export const disableOnScrollBubbling = __VARIANT__;

24

25 // Enable this flag to help with concurrent mode debugging.

26 // It logs information to the console about React scheduling, rendering, and commit phases.

packages/shared/forks/ReactFeatureFlags.www.js

+1

@@ -28,6 +28,7 @@ export const {

28 enableDebugTracing,

29 skipUnmountedBoundaries,

30 enablePassiveEventIntervention,

31 + disableOnScrollBubbling,

32 } = dynamicFeatureFlags;

33

34 // On WWW, __EXPERIMENTAL__ is used for a new modern build.

Revert "Remove onScroll bubbling flag (#19535)" (#19655)