Add modern event system flag + rename legacy plugin module (#18073)

Author: trueadm

packages/react-dom/src/__tests__/ReactBrowserEventEmitter-test.internal.js

@@ -14,7 +14,7 @@ let EventPluginRegistry;
 let React;
 let ReactDOM;
 let ReactDOMComponentTree;
-let DOMEventPluginSystem;
+let listenToEvent;
 let ReactDOMEventListener;
 let ReactTestUtils;
 
@@ -54,8 +54,7 @@ function registerSimpleTestHandler() {
 }
 
 // We should probably remove this file at some point, it's just full of
-// internal API usage. ReactBrowserEventEmitter was refactored out in
-// #18056 too. The majority of this code lives in DOMEventPluginSystem.
+// internal API usage.
 describe('ReactBrowserEventEmitter', () => {
   beforeEach(() => {
     jest.resetModules();
@@ -66,7 +65,8 @@ describe('ReactBrowserEventEmitter', () => {
     React = require('react');
     ReactDOM = require('react-dom');
     ReactDOMComponentTree = require('../client/ReactDOMComponentTree');
-    DOMEventPluginSystem = require('../events/DOMEventPluginSystem');
+    listenToEvent = require('../events/DOMLegacyEventPluginSystem')
+      .legacyListenToEvent;
     ReactDOMEventListener = require('../events/ReactDOMEventListener');
     ReactTestUtils = require('react-dom/test-utils');
 
@@ -350,15 +350,15 @@ describe('ReactBrowserEventEmitter', () => {
 
   it('should listen to events only once', () => {
     spyOnDevAndProd(EventTarget.prototype, 'addEventListener');
-    DOMEventPluginSystem.listenToEvent(ON_CLICK_KEY, document);
-    DOMEventPluginSystem.listenToEvent(ON_CLICK_KEY, document);
+    listenToEvent(ON_CLICK_KEY, document);
+    listenToEvent(ON_CLICK_KEY, document);
     expect(EventTarget.prototype.addEventListener).toHaveBeenCalledTimes(1);
   });
 
   it('should work with event plugins without dependencies', () => {
     spyOnDevAndProd(EventTarget.prototype, 'addEventListener');
 
-    DOMEventPluginSystem.listenToEvent(ON_CLICK_KEY, document);
+    listenToEvent(ON_CLICK_KEY, document);
 
     expect(EventTarget.prototype.addEventListener.calls.argsFor(0)[0]).toBe(
       'click',
@@ -368,7 +368,7 @@ describe('ReactBrowserEventEmitter', () => {
   it('should work with event plugins with dependencies', () => {
     spyOnDevAndProd(EventTarget.prototype, 'addEventListener');
 
-    DOMEventPluginSystem.listenToEvent(ON_CHANGE_KEY, document);
+    listenToEvent(ON_CHANGE_KEY, document);
 
     const setEventListeners = [];
     const listenCalls = EventTarget.prototype.addEventListener.calls.allArgs();

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

@@ -87,7 +87,7 @@ import {
   enableDeprecatedFlareAPI,
   enableTrustedTypesIntegration,
 } from 'shared/ReactFeatureFlags';
-import {listenToEvent} from '../events/DOMEventPluginSystem';
+import {legacyListenToEvent} from '../events/DOMLegacyEventPluginSystem';
 
 let didWarnInvalidHydration = false;
 let didWarnShadyDOM = false;
@@ -272,7 +272,7 @@ function ensureListeningTo(
   const doc = isDocumentOrFragment
     ? rootContainerElement
     : rootContainerElement.ownerDocument;
-  listenToEvent(registrationName, doc);
+  legacyListenToEvent(registrationName, doc);
 }
 
 function getOwnerDocumentFromRootContainer(

packages/react-dom/src/events/DOMEventPluginSystem.js renamed to packages/react-dom/src/events/DOMLegacyEventPluginSystem.js

@@ -307,7 +307,7 @@ export function dispatchEventForPluginEventSystem(
  * @param {string} registrationName Name of listener (e.g. `onClick`).
  * @param {object} mountAt Container where to mount the listener
  */
-export function listenToEvent(
+export function legacyListenToEvent(
   registrationName: string,
   mountAt: Document | Element | Node,
 ): void {

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

@@ -60,7 +60,7 @@ import {
   DiscreteEvent,
 } from 'shared/ReactTypes';
 import {getEventPriorityForPluginSystem} from './DOMEventProperties';
-import {dispatchEventForPluginEventSystem} from './DOMEventPluginSystem';
+import {dispatchEventForPluginEventSystem} from './DOMLegacyEventPluginSystem';
 
 const {
   unstable_UserBlockingPriority: UserBlockingPriority,

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

@@ -117,7 +117,7 @@ import {
   TOP_BLUR,
 } from './DOMTopLevelEventTypes';
 import {IS_REPLAYED} from 'legacy-events/EventSystemFlags';
-import {listenToTopLevelEvent} from './DOMEventPluginSystem';
+import {listenToTopLevelEvent} from './DOMLegacyEventPluginSystem';
 
 type QueuedReplayableEvent = {|
   blockedOn: null | Container | SuspenseInstance,

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

@@ -26,7 +26,7 @@ import getActiveElement from '../client/getActiveElement';
 import {getNodeFromInstance} from '../client/ReactDOMComponentTree';
 import {hasSelectionCapabilities} from '../client/ReactInputSelection';
 import {DOCUMENT_NODE} from '../shared/HTMLNodeType';
-import {isListeningToAllDependencies} from './DOMEventPluginSystem';
+import {isListeningToAllDependencies} from './DOMLegacyEventPluginSystem';
 
 const skipSelectionChangeEvent =
   canUseDOM && 'documentMode' in document && document.documentMode <= 11;

packages/shared/ReactFeatureFlags.js

@@ -139,3 +139,6 @@ export const warnUnstableRenderSubtreeIntoContainer = false;
 
 // Disables ReactDOM.unstable_createPortal
 export const disableUnstableCreatePortal = false;
+
+// Modern event system where events get registered at roots
+export const enableModernEventSystem = false;

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

@@ -55,6 +55,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = false;
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

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

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = false;
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

packages/shared/forks/ReactFeatureFlags.persistent.js

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = false;
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

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

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = true; // this should probably *never* change
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

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

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = true; // this should probably *never* change
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

packages/shared/forks/ReactFeatureFlags.testing.js

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = false;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = true;
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

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

@@ -50,6 +50,7 @@ export const disableUnstableCreatePortal = __EXPERIMENTAL__;
 export const deferPassiveEffectCleanupDuringUnmount = false;
 export const runAllPassiveEffectDestroysBeforeCreates = false;
 export const isTestEnvironment = true;
+export const enableModernEventSystem = false;
 
 // Only used in www builds.
 export function addUserTimingListener() {

packages/shared/forks/ReactFeatureFlags.www.js

@@ -112,6 +112,8 @@ export const disableUnstableCreatePortal = __EXPERIMENTAL__;
 
 export const isTestEnvironment = false;
 
+export const enableModernEventSystem = false;
+
 // Flow magic to verify the exports of this file match the original version.
 // eslint-disable-next-line no-unused-vars
 type Check<_X, Y: _X, X: Y = _X> = null;