, container);\n- const otherNode = document.createElement('h1');\n- document.body.appendChild(container);\n- document.body.appendChild(otherNode);\n-\n- try {\n- otherNode.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: node,\n- }),\n- );\n- expect(mock).toBeCalled();\n- } finally {\n- document.body.removeChild(container);\n- document.body.removeChild(otherNode);\n- }\n- });\n- }\n-\n describe('Propagation', () => {\n it('should propagate events one level down', () => {\n const mouseOut = jest.fn();\n@@ -194,25 +165,19 @@ describe('ReactDOMEventListener', () => {\n \/\/ The first call schedules a render of '1' into the 'Child'.\n \/\/ However, we're batching so it isn't flushed yet.\n expect(mock.mock.calls[0][0]).toBe('Child');\n- if (ReactFeatureFlags.enableModernEventSystem) {\n- \/\/ As we have two roots, it means we have two event listeners.\n- \/\/ This also means we enter the event batching phase twice,\n- \/\/ flushing the child to be 1.\n-\n- \/\/ We don't have any good way of knowing if another event will\n- \/\/ occur because another event handler might invoke\n- \/\/ stopPropagation() along the way. After discussions internally\n- \/\/ with Sebastian, it seems that for now over-flushing should\n- \/\/ be fine, especially as the new event system is a breaking\n- \/\/ change anyway. We can maybe revisit this later as part of\n- \/\/ the work to refine this in the scheduler (maybe by leveraging\n- \/\/ isInputPending?).\n- expect(mock.mock.calls[1][0]).toBe('1');\n- } else {\n- \/\/ The first call schedules a render of '2' into the 'Child'.\n- \/\/ We're still batching so it isn't flushed yet either.\n- expect(mock.mock.calls[1][0]).toBe('Child');\n- }\n+ \/\/ As we have two roots, it means we have two event listeners.\n+ \/\/ This also means we enter the event batching phase twice,\n+ \/\/ flushing the child to be 1.\n+\n+ \/\/ We don't have any good way of knowing if another event will\n+ \/\/ occur because another event handler might invoke\n+ \/\/ stopPropagation() along the way. After discussions internally\n+ \/\/ with Sebastian, it seems that for now over-flushing should\n+ \/\/ be fine, especially as the new event system is a breaking\n+ \/\/ change anyway. We can maybe revisit this later as part of\n+ \/\/ the work to refine this in the scheduler (maybe by leveraging\n+ \/\/ isInputPending?).\n+ expect(mock.mock.calls[1][0]).toBe('1');\n \/\/ By the time we leave the handler, the second update is flushed.\n expect(childNode.textContent).toBe('2');\n } finally {\n@@ -383,25 +348,15 @@ describe('ReactDOMEventListener', () => {\n bubbles: false,\n }),\n );\n- if (ReactFeatureFlags.enableModernEventSystem) {\n- \/\/ As of the modern event system refactor, we now support\n- \/\/ this on . The reason for this, is because we now\n- \/\/ attach all media events to the \"root\" or \"portal\" in the\n- \/\/ capture phase, rather than the bubble phase. This allows\n- \/\/ us to assign less event listeners to individual elements,\n- \/\/ which also nicely allows us to support more without needing\n- \/\/ to add more individual code paths to support various\n- \/\/ events that do not bubble.\n- expect(handleImgLoadStart).toHaveBeenCalledTimes(1);\n- } else {\n- \/\/ Historically, we happened to not support onLoadStart\n- \/\/ on , and this test documents that lack of support.\n- \/\/ If we decide to support it in the future, we should change\n- \/\/ this line to expect 1 call. Note that fixing this would\n- \/\/ be simple but would require attaching a handler to each\n- \/\/ . So far nobody asked us for it.\n- expect(handleImgLoadStart).toHaveBeenCalledTimes(0);\n- }\n+ \/\/ As of the modern event system refactor, we now support\n+ \/\/ this on . The reason for this, is because we now\n+ \/\/ attach all media events to the \"root\" or \"portal\" in the\n+ \/\/ capture phase, rather than the bubble phase. This allows\n+ \/\/ us to assign less event listeners to individual elements,\n+ \/\/ which also nicely allows us to support more without needing\n+ \/\/ to add more individual code paths to support various\n+ \/\/ events that do not bubble.\n+ expect(handleImgLoadStart).toHaveBeenCalledTimes(1);\n \n videoRef.current.dispatchEvent(\n new ProgressEvent('loadstart', {\ndiff --git a\/packages\/react-dom\/src\/__tests__\/ReactTestUtils-test.js b\/packages\/react-dom\/src\/__tests__\/ReactTestUtils-test.js\nindex a69c046565..20940d7523 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactTestUtils-test.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactTestUtils-test.js\n@@ -15,8 +15,6 @@ import * as ReactDOM from 'react-dom';\n import * as ReactDOMServer from 'react-dom\/server';\n import * as ReactTestUtils from 'react-dom\/test-utils';\n \n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n-\n function getTestDocument(markup) {\n const doc = document.implementation.createHTMLDocument('');\n doc.open();\n@@ -33,98 +31,6 @@ describe('ReactTestUtils', () => {\n expect(Object.keys(ReactTestUtils.Simulate).sort()).toMatchSnapshot();\n });\n \n- if (!ReactFeatureFlags.enableModernEventSystem) {\n- \/\/ SimulateNative API has been removed in the modern event system\n- it('SimulateNative should have locally attached media events', () => {\n- expect(Object.keys(ReactTestUtils.SimulateNative).sort()).toEqual([\n- 'abort',\n- 'animationEnd',\n- 'animationIteration',\n- 'animationStart',\n- 'blur',\n- 'canPlay',\n- 'canPlayThrough',\n- 'cancel',\n- 'change',\n- 'click',\n- 'close',\n- 'compositionEnd',\n- 'compositionStart',\n- 'compositionUpdate',\n- 'contextMenu',\n- 'copy',\n- 'cut',\n- 'doubleClick',\n- 'drag',\n- 'dragEnd',\n- 'dragEnter',\n- 'dragExit',\n- 'dragLeave',\n- 'dragOver',\n- 'dragStart',\n- 'drop',\n- 'durationChange',\n- 'emptied',\n- 'encrypted',\n- 'ended',\n- 'error',\n- 'focus',\n- 'input',\n- 'keyDown',\n- 'keyPress',\n- 'keyUp',\n- 'load',\n- 'loadStart',\n- 'loadedData',\n- 'loadedMetadata',\n- 'mouseDown',\n- 'mouseMove',\n- 'mouseOut',\n- 'mouseOver',\n- 'mouseUp',\n- 'paste',\n- 'pause',\n- 'play',\n- 'playing',\n- 'progress',\n- 'rateChange',\n- 'scroll',\n- 'seeked',\n- 'seeking',\n- 'selectionChange',\n- 'stalled',\n- 'suspend',\n- 'textInput',\n- 'timeUpdate',\n- 'toggle',\n- 'touchCancel',\n- 'touchEnd',\n- 'touchMove',\n- 'touchStart',\n- 'transitionEnd',\n- 'volumeChange',\n- 'waiting',\n- 'wheel',\n- ]);\n- });\n-\n- it('SimulateNative should warn about deprecation', () => {\n- const container = document.createElement('div');\n- const node = ReactDOM.render(

, container);\n- expect(() =>\n- ReactTestUtils.SimulateNative.click(node),\n- ).toWarnDev(\n- 'ReactTestUtils.SimulateNative is an undocumented API that does not match ' +\n- 'how the browser dispatches events, and will be removed in a future major ' +\n- 'version of React. If you rely on it for testing, consider attaching the root ' +\n- 'DOM container to the document during the test, and then dispatching native browser ' +\n- 'events by calling `node.dispatchEvent()` on the DOM nodes. Make sure to set ' +\n- 'the `bubbles` flag to `true` when creating the native browser event.',\n- {withoutStack: true},\n- );\n- });\n- }\n-\n it('gives Jest mocks a passthrough implementation with mockComponent()', () => {\n class MockedComponent extends React.Component {\n render() {\ndiff --git a\/packages\/react-dom\/src\/__tests__\/ReactTreeTraversal-test.js b\/packages\/react-dom\/src\/__tests__\/ReactTreeTraversal-test.js\nindex 2b5ab93aba..6927a212cf 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactTreeTraversal-test.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactTreeTraversal-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n \n const ChildComponent = ({id, eventHandler}) => (\n {\n expect(mockFn.mock.calls).toEqual(expectedCalls);\n });\n \n- \/\/ This will not work with the modern event system that\n- \/\/ attaches event listeners to roots as the event below\n- \/\/ is being triggered on a node that React does not listen\n+ \/\/ The modern event system attaches event listeners to roots so the\n+ \/\/ event below is being triggered on a node that React does not listen\n \/\/ to any more. Instead we should fire mouseover.\n- if (ReactFeatureFlags.enableModernEventSystem) {\n- it('should enter from the window', () => {\n- const enterNode = document.getElementById('P_P1_C1__DIV');\n-\n- const expectedCalls = [\n- ['P', 'mouseenter'],\n- ['P_P1', 'mouseenter'],\n- ['P_P1_C1__DIV', 'mouseenter'],\n- ];\n-\n- enterNode.dispatchEvent(\n- new MouseEvent('mouseover', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: outerNode1,\n- }),\n- );\n-\n- expect(mockFn.mock.calls).toEqual(expectedCalls);\n- });\n- } else {\n- it('should enter from the window', () => {\n- const enterNode = document.getElementById('P_P1_C1__DIV');\n-\n- const expectedCalls = [\n- ['P', 'mouseenter'],\n- ['P_P1', 'mouseenter'],\n- ['P_P1_C1__DIV', 'mouseenter'],\n- ];\n-\n- outerNode1.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: enterNode,\n- }),\n- );\n-\n- expect(mockFn.mock.calls).toEqual(expectedCalls);\n- });\n- }\n-\n- \/\/ This will not work with the modern event system that\n- \/\/ attaches event listeners to roots as the event below\n- \/\/ is being triggered on a node that React does not listen\n- \/\/ to any more. Instead we should fire mouseover.\n- if (ReactFeatureFlags.enableModernEventSystem) {\n- it('should enter from the window to the shallowest', () => {\n- const enterNode = document.getElementById('P');\n-\n- const expectedCalls = [['P', 'mouseenter']];\n-\n- enterNode.dispatchEvent(\n- new MouseEvent('mouseover', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: outerNode1,\n- }),\n- );\n-\n- expect(mockFn.mock.calls).toEqual(expectedCalls);\n- });\n- } else {\n- it('should enter from the window to the shallowest', () => {\n- const enterNode = document.getElementById('P');\n-\n- const expectedCalls = [['P', 'mouseenter']];\n-\n- outerNode1.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: enterNode,\n- }),\n- );\n-\n- expect(mockFn.mock.calls).toEqual(expectedCalls);\n- });\n- }\n+ it('should enter from the window', () => {\n+ const enterNode = document.getElementById('P_P1_C1__DIV');\n+\n+ const expectedCalls = [\n+ ['P', 'mouseenter'],\n+ ['P_P1', 'mouseenter'],\n+ ['P_P1_C1__DIV', 'mouseenter'],\n+ ];\n+\n+ enterNode.dispatchEvent(\n+ new MouseEvent('mouseover', {\n+ bubbles: true,\n+ cancelable: true,\n+ relatedTarget: outerNode1,\n+ }),\n+ );\n+\n+ expect(mockFn.mock.calls).toEqual(expectedCalls);\n+ });\n+\n+ it('should enter from the window to the shallowest', () => {\n+ const enterNode = document.getElementById('P');\n+\n+ const expectedCalls = [['P', 'mouseenter']];\n+\n+ enterNode.dispatchEvent(\n+ new MouseEvent('mouseover', {\n+ bubbles: true,\n+ cancelable: true,\n+ relatedTarget: outerNode1,\n+ }),\n+ );\n+\n+ expect(mockFn.mock.calls).toEqual(expectedCalls);\n+ });\n \n it('should leave to the window', () => {\n const leaveNode = document.getElementById('P_P1_C1__DIV');\ndiff --git a\/packages\/react-dom\/src\/client\/ReactDOMClientInjection.js b\/packages\/react-dom\/src\/client\/ReactDOMClientInjection.js\nindex c61d4b072c..0f2532c1b6 100644\n--- a\/packages\/react-dom\/src\/client\/ReactDOMClientInjection.js\n+++ b\/packages\/react-dom\/src\/client\/ReactDOMClientInjection.js\n@@ -5,19 +5,7 @@\n * LICENSE file in the root directory of this source tree.\n *\/\n \n-import {setComponentTree} from '..\/legacy-events\/EventPluginUtils';\n-\n-import {\n- getFiberCurrentPropsFromNode,\n- getInstanceFromNode,\n- getNodeFromInstance,\n-} from '.\/ReactDOMComponentTree';\n-\n-import LegacyBeforeInputEventPlugin from '..\/events\/plugins\/LegacyBeforeInputEventPlugin';\n-import LegacyChangeEventPlugin from '..\/events\/plugins\/LegacyChangeEventPlugin';\n-import LegacyEnterLeaveEventPlugin from '..\/events\/plugins\/LegacyEnterLeaveEventPlugin';\n-import LegacySelectEventPlugin from '..\/events\/plugins\/LegacySelectEventPlugin';\n-import LegacySimpleEventPlugin from '..\/events\/plugins\/LegacySimpleEventPlugin';\n+\/\/ TODO: remove this injection altogether.\n \n import ModernBeforeInputEventPlugin from '..\/events\/plugins\/ModernBeforeInputEventPlugin';\n import ModernChangeEventPlugin from '..\/events\/plugins\/ModernChangeEventPlugin';\n@@ -25,58 +13,12 @@ import ModernEnterLeaveEventPlugin from '..\/events\/plugins\/ModernEnterLeaveEvent\n import ModernSelectEventPlugin from '..\/events\/plugins\/ModernSelectEventPlugin';\n import ModernSimpleEventPlugin from '..\/events\/plugins\/ModernSimpleEventPlugin';\n \n-import {\n- injectEventPluginOrder,\n- injectEventPluginsByName,\n- injectEventPlugins,\n-} from '..\/legacy-events\/EventPluginRegistry';\n-import {enableModernEventSystem} from 'shared\/ReactFeatureFlags';\n-\n-if (enableModernEventSystem) {\n- injectEventPlugins([\n- ModernSimpleEventPlugin,\n- ModernEnterLeaveEventPlugin,\n- ModernChangeEventPlugin,\n- ModernSelectEventPlugin,\n- ModernBeforeInputEventPlugin,\n- ]);\n-} else {\n- \/**\n- * Specifies a deterministic ordering of `EventPlugin`s. A convenient way to\n- * reason about plugins, without having to package every one of them. This\n- * is better than having plugins be ordered in the same order that they\n- * are injected because that ordering would be influenced by the packaging order.\n- * `ResponderEventPlugin` must occur before `SimpleEventPlugin` so that\n- * preventing default on events is convenient in `SimpleEventPlugin` handlers.\n- *\/\n- const DOMEventPluginOrder = [\n- 'ResponderEventPlugin',\n- 'SimpleEventPlugin',\n- 'EnterLeaveEventPlugin',\n- 'ChangeEventPlugin',\n- 'SelectEventPlugin',\n- 'BeforeInputEventPlugin',\n- ];\n-\n- \/**\n- * Inject modules for resolving DOM hierarchy and plugin ordering.\n- *\/\n- injectEventPluginOrder(DOMEventPluginOrder);\n- setComponentTree(\n- getFiberCurrentPropsFromNode,\n- getInstanceFromNode,\n- getNodeFromInstance,\n- );\n+import {injectEventPlugins} from '..\/legacy-events\/EventPluginRegistry';\n \n- \/**\n- * Some important event plugins included by default (without having to require\n- * them).\n- *\/\n- injectEventPluginsByName({\n- SimpleEventPlugin: LegacySimpleEventPlugin,\n- EnterLeaveEventPlugin: LegacyEnterLeaveEventPlugin,\n- ChangeEventPlugin: LegacyChangeEventPlugin,\n- SelectEventPlugin: LegacySelectEventPlugin,\n- BeforeInputEventPlugin: LegacyBeforeInputEventPlugin,\n- });\n-}\n+injectEventPlugins([\n+ ModernSimpleEventPlugin,\n+ ModernEnterLeaveEventPlugin,\n+ ModernChangeEventPlugin,\n+ ModernSelectEventPlugin,\n+ ModernBeforeInputEventPlugin,\n+]);\ndiff --git a\/packages\/react-dom\/src\/client\/ReactDOMComponent.js b\/packages\/react-dom\/src\/client\/ReactDOMComponent.js\nindex fc16a49d7c..af1f118491 100644\n--- a\/packages\/react-dom\/src\/client\/ReactDOMComponent.js\n+++ b\/packages\/react-dom\/src\/client\/ReactDOMComponent.js\n@@ -51,15 +51,6 @@ import {\n import {track} from '.\/inputValueTracking';\n import setInnerHTML from '.\/setInnerHTML';\n import setTextContent from '.\/setTextContent';\n-import {\n- TOP_ERROR,\n- TOP_INVALID,\n- TOP_LOAD,\n- TOP_RESET,\n- TOP_SUBMIT,\n- TOP_TOGGLE,\n-} from '..\/events\/DOMTopLevelEventTypes';\n-import {mediaEventTypes} from '..\/events\/DOMTopLevelEventTypes';\n import {\n createDangerousStringForStyles,\n setValueForStyles,\n@@ -74,7 +65,6 @@ import {\n import assertValidProps from '..\/shared\/assertValidProps';\n import {\n DOCUMENT_NODE,\n- DOCUMENT_FRAGMENT_NODE,\n ELEMENT_NODE,\n COMMENT_NODE,\n } from '..\/shared\/HTMLNodeType';\n@@ -88,12 +78,7 @@ import {REACT_OPAQUE_ID_TYPE} from 'shared\/ReactSymbols';\n import {\n enableDeprecatedFlareAPI,\n enableTrustedTypesIntegration,\n- enableModernEventSystem,\n } from 'shared\/ReactFeatureFlags';\n-import {\n- legacyListenToEvent,\n- legacyTrapBubbledEvent,\n-} from '..\/events\/DOMLegacyEventPluginSystem';\n import {listenToEvent} from '..\/events\/DOMModernPluginEventSystem';\n import {getEventListenerMap} from '.\/ReactDOMComponentTree';\n \n@@ -273,33 +258,22 @@ export function ensureListeningTo(\n rootContainerInstance: Element | Node,\n registrationName: string,\n ): void {\n- if (enableModernEventSystem) {\n- \/\/ If we have a comment node, then use the parent node,\n- \/\/ which should be an element.\n- const rootContainerElement =\n- rootContainerInstance.nodeType === COMMENT_NODE\n- ? rootContainerInstance.parentNode\n- : rootContainerInstance;\n- \/\/ Containers should only ever be element nodes. We do not\n- \/\/ want to register events to document fragments or documents\n- \/\/ with the modern plugin event system.\n- invariant(\n- rootContainerElement != null &&\n- rootContainerElement.nodeType === ELEMENT_NODE,\n- 'ensureListeningTo(): received a container that was not an element node. ' +\n- 'This is likely a bug in React.',\n- );\n- listenToEvent(registrationName, ((rootContainerElement: any): Element));\n- } else {\n- \/\/ Legacy plugin event system path\n- const isDocumentOrFragment =\n- rootContainerInstance.nodeType === DOCUMENT_NODE ||\n- rootContainerInstance.nodeType === DOCUMENT_FRAGMENT_NODE;\n- const doc = isDocumentOrFragment\n- ? rootContainerInstance\n- : rootContainerInstance.ownerDocument;\n- legacyListenToEvent(registrationName, ((doc: any): Document));\n- }\n+ \/\/ If we have a comment node, then use the parent node,\n+ \/\/ which should be an element.\n+ const rootContainerElement =\n+ rootContainerInstance.nodeType === COMMENT_NODE\n+ ? rootContainerInstance.parentNode\n+ : rootContainerInstance;\n+ \/\/ Containers should only ever be element nodes. We do not\n+ \/\/ want to register events to document fragments or documents\n+ \/\/ with the modern plugin event system.\n+ invariant(\n+ rootContainerElement != null &&\n+ rootContainerElement.nodeType === ELEMENT_NODE,\n+ 'ensureListeningTo(): received a container that was not an element node. ' +\n+ 'This is likely a bug in React.',\n+ );\n+ listenToEvent(registrationName, ((rootContainerElement: any): Element));\n }\n \n function getOwnerDocumentFromRootContainer(\n@@ -544,55 +518,29 @@ export function setInitialProperties(\n case 'iframe':\n case 'object':\n case 'embed':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_LOAD, domElement);\n- }\n props = rawProps;\n break;\n case 'video':\n case 'audio':\n- if (!enableModernEventSystem) {\n- \/\/ Create listener for each media event\n- for (let i = 0; i < mediaEventTypes.length; i++) {\n- legacyTrapBubbledEvent(mediaEventTypes[i], domElement);\n- }\n- }\n props = rawProps;\n break;\n case 'source':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_ERROR, domElement);\n- }\n props = rawProps;\n break;\n case 'img':\n case 'image':\n case 'link':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_ERROR, domElement);\n- legacyTrapBubbledEvent(TOP_LOAD, domElement);\n- }\n props = rawProps;\n break;\n case 'form':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_RESET, domElement);\n- legacyTrapBubbledEvent(TOP_SUBMIT, domElement);\n- }\n props = rawProps;\n break;\n case 'details':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_TOGGLE, domElement);\n- }\n props = rawProps;\n break;\n case 'input':\n ReactDOMInputInitWrapperState(domElement, rawProps);\n props = ReactDOMInputGetHostProps(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\n@@ -604,9 +552,6 @@ export function setInitialProperties(\n case 'select':\n ReactDOMSelectInitWrapperState(domElement, rawProps);\n props = ReactDOMSelectGetHostProps(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\n@@ -614,9 +559,6 @@ export function setInitialProperties(\n case 'textarea':\n ReactDOMTextareaInitWrapperState(domElement, rawProps);\n props = ReactDOMTextareaGetHostProps(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\n@@ -949,51 +891,8 @@ export function diffHydratedProperties(\n \n \/\/ TODO: Make sure that we check isMounted before firing any of these events.\n switch (tag) {\n- case 'iframe':\n- case 'object':\n- case 'embed':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_LOAD, domElement);\n- }\n- break;\n- case 'video':\n- case 'audio':\n- if (!enableModernEventSystem) {\n- \/\/ Create listener for each media event\n- for (let i = 0; i < mediaEventTypes.length; i++) {\n- legacyTrapBubbledEvent(mediaEventTypes[i], domElement);\n- }\n- }\n- break;\n- case 'source':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_ERROR, domElement);\n- }\n- break;\n- case 'img':\n- case 'image':\n- case 'link':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_ERROR, domElement);\n- legacyTrapBubbledEvent(TOP_LOAD, domElement);\n- }\n- break;\n- case 'form':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_RESET, domElement);\n- legacyTrapBubbledEvent(TOP_SUBMIT, domElement);\n- }\n- break;\n- case 'details':\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_TOGGLE, domElement);\n- }\n- break;\n case 'input':\n ReactDOMInputInitWrapperState(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\n@@ -1003,18 +902,12 @@ export function diffHydratedProperties(\n break;\n case 'select':\n ReactDOMSelectInitWrapperState(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\n break;\n case 'textarea':\n ReactDOMTextareaInitWrapperState(domElement, rawProps);\n- if (!enableModernEventSystem) {\n- legacyTrapBubbledEvent(TOP_INVALID, domElement);\n- }\n \/\/ For controlled components we always need to ensure we're listening\n \/\/ to onChange. Even if there is no listener.\n ensureListeningTo(rootContainerElement, 'onChange');\ndiff --git a\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js b\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\nindex a7039702b8..2c09646696 100644\n--- a\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\n+++ b\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\n@@ -75,7 +75,6 @@ import {\n enableSuspenseServerRenderer,\n enableDeprecatedFlareAPI,\n enableFundamentalAPI,\n- enableModernEventSystem,\n enableCreateEventHandleAPI,\n enableScopeAPI,\n } from 'shared\/ReactFeatureFlags';\n@@ -1123,9 +1122,7 @@ export function makeOpaqueHydratingObject(\n }\n \n export function preparePortalMount(portalInstance: Instance): void {\n- if (enableModernEventSystem) {\n- listenToEvent('onMouseEnter', portalInstance);\n- }\n+ listenToEvent('onMouseEnter', portalInstance);\n }\n \n export function prepareScopeUpdate(\ndiff --git a\/packages\/react-dom\/src\/client\/ReactDOMRoot.js b\/packages\/react-dom\/src\/client\/ReactDOMRoot.js\nindex 549f7c3e60..31a869ba2d 100644\n--- a\/packages\/react-dom\/src\/client\/ReactDOMRoot.js\n+++ b\/packages\/react-dom\/src\/client\/ReactDOMRoot.js\n@@ -57,8 +57,6 @@ import {\n LegacyRoot,\n } from 'react-reconciler\/src\/ReactRootTags';\n \n-import {enableModernEventSystem} from 'shared\/ReactFeatureFlags';\n-\n function ReactDOMRoot(container: Container, options: void | RootOptions) {\n this._internalRoot = createRootImpl(container, ConcurrentRoot, options);\n }\n@@ -144,7 +142,6 @@ function createRootImpl(\n \/\/ hoist it to reduce code-size.\n eagerlyTrapReplayableEvents(container, ((doc: any): Document));\n } else if (\n- enableModernEventSystem &&\n containerNodeType !== DOCUMENT_FRAGMENT_NODE &&\n containerNodeType !== DOCUMENT_NODE\n ) {\ndiff --git a\/packages\/react-dom\/src\/events\/DOMLegacyEventPluginSystem.js b\/packages\/react-dom\/src\/events\/DOMLegacyEventPluginSystem.js\ndeleted file mode 100644\nindex fde6a1c650..0000000000\n--- a\/packages\/react-dom\/src\/events\/DOMLegacyEventPluginSystem.js\n+++ \/dev\/null\n@@ -1,622 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @flow\n- *\/\n-\n-import type {AnyNativeEvent} from '..\/legacy-events\/PluginModuleType';\n-import type {DOMTopLevelEventType} from '..\/legacy-events\/TopLevelEventTypes';\n-import type {ElementListenerMap} from '..\/client\/ReactDOMComponentTree';\n-import type {EventSystemFlags} from '.\/EventSystemFlags';\n-import type {Fiber} from 'react-reconciler\/src\/ReactInternalTypes';\n-import type {LegacyPluginModule} from '..\/legacy-events\/PluginModuleType';\n-import type {ReactSyntheticEvent} from '..\/legacy-events\/ReactSyntheticEventType';\n-import type {TopLevelType} from '..\/legacy-events\/TopLevelEventTypes';\n-import forEachAccumulated from '..\/legacy-events\/forEachAccumulated';\n-\n-import {\n- HostRoot,\n- HostComponent,\n- HostText,\n-} from 'react-reconciler\/src\/ReactWorkTags';\n-import {IS_FIRST_ANCESTOR, PLUGIN_EVENT_SYSTEM} from '.\/EventSystemFlags';\n-import {runEventsInBatch} from '..\/legacy-events\/EventBatching';\n-import {plugins} from '..\/legacy-events\/EventPluginRegistry';\n-import accumulateInto from '..\/legacy-events\/accumulateInto';\n-import {registrationNameDependencies} from '..\/legacy-events\/EventPluginRegistry';\n-\n-import getEventTarget from '.\/getEventTarget';\n-import {\n- getClosestInstanceFromNode,\n- getEventListenerMap,\n-} from '..\/client\/ReactDOMComponentTree';\n-import isEventSupported from '.\/isEventSupported';\n-import {\n- TOP_BLUR,\n- TOP_CANCEL,\n- TOP_CLOSE,\n- TOP_FOCUS,\n- TOP_INVALID,\n- TOP_RESET,\n- TOP_SCROLL,\n- TOP_SUBMIT,\n- getRawEventName,\n- mediaEventTypes,\n-} from '.\/DOMTopLevelEventTypes';\n-import {createEventListenerWrapperWithPriority} from '.\/ReactDOMEventListener';\n-import {batchedEventUpdates} from '.\/ReactDOMUpdateBatching';\n-import getListener from '.\/getListener';\n-import {addEventCaptureListener, addEventBubbleListener} from '.\/EventListener';\n-\n-\/**\n- * Summary of `DOMEventPluginSystem` event handling:\n- *\n- * - Top-level delegation is used to trap most native browser events. This\n- * may only occur in the main thread and is the responsibility of\n- * ReactDOMEventListener, which is injected and can therefore support\n- * pluggable event sources. This is the only work that occurs in the main\n- * thread.\n- *\n- * - We normalize and de-duplicate events to account for browser quirks. This\n- * may be done in the worker thread.\n- *\n- * - Forward these native events (with the associated top-level type used to\n- * trap it) to `EventPluginRegistry`, which in turn will ask plugins if they want\n- * to extract any synthetic events.\n- *\n- * - The `EventPluginRegistry` will then process each event by annotating them with\n- * \"dispatches\", a sequence of listeners and IDs that care about that event.\n- *\n- * - The `EventPluginRegistry` then dispatches the events.\n- *\n- * Overview of React and the event system:\n- *\n- * +------------+ .\n- * | DOM | .\n- * +------------+ .\n- * | .\n- * v .\n- * +------------+ .\n- * | ReactEvent | .\n- * | Listener | .\n- * +------------+ . +-----------+\n- * | . +--------+|SimpleEvent|\n- * | . | |Plugin |\n- * +-----|------+ . v +-----------+\n- * | | | . +--------------+ +------------+\n- * | +-----------.--->|PluginRegistry| | Event |\n- * | | . | | +-----------+ | Propagators|\n- * | ReactEvent | . | | |TapEvent | |------------|\n- * | Emitter | . | |<---+|Plugin | |other plugin|\n- * | | . | | +-----------+ | utilities |\n- * | +-----------.--->| | +------------+\n- * | | | . +--------------+\n- * +-----|------+ . ^ +-----------+\n- * | . | |Enter\/Leave|\n- * + . +-------+|Plugin |\n- * +-------------+ . +-----------+\n- * | application | .\n- * |-------------| .\n- * | | .\n- * | | .\n- * +-------------+ .\n- * .\n- * React Core . General Purpose Event Plugin System\n- *\/\n-\n-const CALLBACK_BOOKKEEPING_POOL_SIZE = 10;\n-const callbackBookkeepingPool = [];\n-\n-type BookKeepingInstance = {|\n- topLevelType: DOMTopLevelEventType | null,\n- eventSystemFlags: EventSystemFlags,\n- nativeEvent: AnyNativeEvent | null,\n- targetInst: Fiber | null,\n- ancestors: Array,\n-|};\n-\n-function releaseTopLevelCallbackBookKeeping(\n- instance: BookKeepingInstance,\n-): void {\n- instance.topLevelType = null;\n- instance.nativeEvent = null;\n- instance.targetInst = null;\n- instance.ancestors.length = 0;\n- if (callbackBookkeepingPool.length < CALLBACK_BOOKKEEPING_POOL_SIZE) {\n- callbackBookkeepingPool.push(instance);\n- }\n-}\n-\n-\/\/ Used to store ancestor hierarchy in top level callback\n-function getTopLevelCallbackBookKeeping(\n- topLevelType: DOMTopLevelEventType,\n- nativeEvent: AnyNativeEvent,\n- targetInst: Fiber | null,\n- eventSystemFlags: EventSystemFlags,\n-): BookKeepingInstance {\n- if (callbackBookkeepingPool.length) {\n- const instance = callbackBookkeepingPool.pop();\n- instance.topLevelType = topLevelType;\n- instance.eventSystemFlags = eventSystemFlags;\n- instance.nativeEvent = nativeEvent;\n- instance.targetInst = targetInst;\n- return instance;\n- }\n- return {\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- targetInst,\n- ancestors: [],\n- };\n-}\n-\n-\/**\n- * Find the deepest React component completely containing the root of the\n- * passed-in instance (for use when entire React trees are nested within each\n- * other). If React trees are not nested, returns null.\n- *\/\n-function findRootContainerNode(inst) {\n- if (inst.tag === HostRoot) {\n- return inst.stateNode.containerInfo;\n- }\n- \/\/ TODO: It may be a good idea to cache this to prevent unnecessary DOM\n- \/\/ traversal, but caching is difficult to do correctly without using a\n- \/\/ mutation observer to listen for all DOM changes.\n- while (inst.return) {\n- inst = inst.return;\n- }\n- if (inst.tag !== HostRoot) {\n- \/\/ This can happen if we're in a detached tree.\n- return null;\n- }\n- return inst.stateNode.containerInfo;\n-}\n-\n-\/**\n- * Allows registered plugins an opportunity to extract events from top-level\n- * native browser events.\n- *\n- * @return {*} An accumulation of synthetic events.\n- * @internal\n- *\/\n-function extractPluginEvents(\n- topLevelType: TopLevelType,\n- targetInst: null | Fiber,\n- nativeEvent: AnyNativeEvent,\n- nativeEventTarget: null | EventTarget,\n- eventSystemFlags: EventSystemFlags,\n-): Array | ReactSyntheticEvent | null {\n- let events = null;\n- const legacyPlugins = ((plugins: any): Array>);\n- for (let i = 0; i < legacyPlugins.length; i++) {\n- \/\/ Not every plugin in the ordering may be loaded at runtime.\n- const possiblePlugin = legacyPlugins[i];\n- if (possiblePlugin) {\n- const extractedEvents = possiblePlugin.extractEvents(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- );\n- if (extractedEvents) {\n- events = accumulateInto(events, extractedEvents);\n- }\n- }\n- }\n- return events;\n-}\n-\n-function runExtractedPluginEventsInBatch(\n- topLevelType: TopLevelType,\n- targetInst: null | Fiber,\n- nativeEvent: AnyNativeEvent,\n- nativeEventTarget: null | EventTarget,\n- eventSystemFlags: EventSystemFlags,\n-) {\n- const events = extractPluginEvents(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- );\n- runEventsInBatch(events);\n-}\n-\n-function handleTopLevel(bookKeeping: BookKeepingInstance) {\n- let targetInst = bookKeeping.targetInst;\n-\n- \/\/ Loop through the hierarchy, in case there's any nested components.\n- \/\/ It's important that we build the array of ancestors before calling any\n- \/\/ event handlers, because event handlers can modify the DOM, leading to\n- \/\/ inconsistencies with ReactMount's node cache. See #1105.\n- let ancestor = targetInst;\n- do {\n- if (!ancestor) {\n- const ancestors = bookKeeping.ancestors;\n- ((ancestors: any): Array).push(ancestor);\n- break;\n- }\n- const root = findRootContainerNode(ancestor);\n- if (!root) {\n- break;\n- }\n- const tag = ancestor.tag;\n- if (tag === HostComponent || tag === HostText) {\n- bookKeeping.ancestors.push(ancestor);\n- }\n- ancestor = getClosestInstanceFromNode(root);\n- } while (ancestor);\n-\n- for (let i = 0; i < bookKeeping.ancestors.length; i++) {\n- targetInst = bookKeeping.ancestors[i];\n- const eventTarget = getEventTarget(bookKeeping.nativeEvent);\n- const topLevelType = ((bookKeeping.topLevelType: any): DOMTopLevelEventType);\n- const nativeEvent = ((bookKeeping.nativeEvent: any): AnyNativeEvent);\n- let eventSystemFlags = bookKeeping.eventSystemFlags;\n-\n- \/\/ If this is the first ancestor, we mark it on the system flags\n- if (i === 0) {\n- eventSystemFlags |= IS_FIRST_ANCESTOR;\n- }\n-\n- runExtractedPluginEventsInBatch(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- eventTarget,\n- eventSystemFlags,\n- );\n- }\n-}\n-\n-export function dispatchEventForLegacyPluginEventSystem(\n- topLevelType: DOMTopLevelEventType,\n- eventSystemFlags: EventSystemFlags,\n- nativeEvent: AnyNativeEvent,\n- targetInst: null | Fiber,\n-): void {\n- const bookKeeping = getTopLevelCallbackBookKeeping(\n- topLevelType,\n- nativeEvent,\n- targetInst,\n- eventSystemFlags,\n- );\n-\n- try {\n- \/\/ Event queue being processed in the same cycle allows\n- \/\/ `preventDefault`.\n- batchedEventUpdates(handleTopLevel, bookKeeping);\n- } finally {\n- releaseTopLevelCallbackBookKeeping(bookKeeping);\n- }\n-}\n-\n-\/**\n- * We listen for bubbled touch events on the document object.\n- *\n- * Firefox v8.01 (and possibly others) exhibited strange behavior when\n- * mounting `onmousemove` events at some node that was not the document\n- * element. The symptoms were that if your mouse is not moving over something\n- * contained within that mount point (for example on the background) the\n- * top-level listeners for `onmousemove` won't be called. However, if you\n- * register the `mousemove` on the document object, then it will of course\n- * catch all `mousemove`s. This along with iOS quirks, justifies restricting\n- * top-level listeners to the document object only, at least for these\n- * movement types of events and possibly all events.\n- *\n- * @see https:\/\/www.quirksmode.org\/blog\/archives\/2010\/09\/click_event_del.html\n- *\n- * Also, `keyup`\/`keypress`\/`keydown` do not bubble to the window on IE, but\n- * they bubble to document.\n- *\n- * @param {string} registrationName Name of listener (e.g. `onClick`).\n- * @param {object} mountAt Container where to mount the listener\n- *\/\n-export function legacyListenToEvent(\n- registrationName: string,\n- mountAt: Document | Element,\n-): void {\n- const listenerMap = getEventListenerMap(mountAt);\n- const dependencies = registrationNameDependencies[registrationName];\n-\n- for (let i = 0; i < dependencies.length; i++) {\n- const dependency = dependencies[i];\n- legacyListenToTopLevelEvent(dependency, mountAt, listenerMap);\n- }\n-}\n-\n-export function legacyListenToTopLevelEvent(\n- topLevelType: DOMTopLevelEventType,\n- mountAt: Document | Element,\n- listenerMap: ElementListenerMap,\n-): void {\n- if (!listenerMap.has(topLevelType)) {\n- switch (topLevelType) {\n- case TOP_SCROLL: {\n- legacyTrapCapturedEvent(TOP_SCROLL, mountAt, listenerMap);\n- break;\n- }\n- case TOP_FOCUS:\n- case TOP_BLUR:\n- legacyTrapCapturedEvent(TOP_FOCUS, mountAt, listenerMap);\n- legacyTrapCapturedEvent(TOP_BLUR, mountAt, listenerMap);\n- break;\n- case TOP_CANCEL:\n- case TOP_CLOSE: {\n- if (isEventSupported(getRawEventName(topLevelType))) {\n- legacyTrapCapturedEvent(topLevelType, mountAt, listenerMap);\n- }\n- break;\n- }\n- case TOP_INVALID:\n- case TOP_SUBMIT:\n- case TOP_RESET:\n- \/\/ We listen to them on the target DOM elements.\n- \/\/ Some of them bubble so we don't want them to fire twice.\n- break;\n- default: {\n- \/\/ By default, listen on the top level to all non-media events.\n- \/\/ Media events don't bubble so adding the listener wouldn't do anything.\n- const isMediaEvent = mediaEventTypes.indexOf(topLevelType) !== -1;\n- if (!isMediaEvent) {\n- legacyTrapBubbledEvent(topLevelType, mountAt, listenerMap);\n- }\n- break;\n- }\n- }\n- }\n-}\n-\n-export function legacyTrapBubbledEvent(\n- topLevelType: DOMTopLevelEventType,\n- element: Document | Element,\n- listenerMap?: ElementListenerMap,\n-): void {\n- const listener = addTrappedEventListener(\n- element,\n- topLevelType,\n- PLUGIN_EVENT_SYSTEM,\n- false,\n- );\n- if (listenerMap) {\n- listenerMap.set(topLevelType, {passive: undefined, listener});\n- }\n-}\n-\n-export function legacyTrapCapturedEvent(\n- topLevelType: DOMTopLevelEventType,\n- element: Document | Element,\n- listenerMap: ElementListenerMap,\n-): void {\n- const listener = addTrappedEventListener(\n- element,\n- topLevelType,\n- PLUGIN_EVENT_SYSTEM,\n- true,\n- );\n- listenerMap.set(topLevelType, {passive: undefined, listener});\n-}\n-\n-function addTrappedEventListener(\n- targetContainer: EventTarget,\n- topLevelType: DOMTopLevelEventType,\n- eventSystemFlags: EventSystemFlags,\n- capture: boolean,\n-): any => void {\n- const rawEventName = getRawEventName(topLevelType);\n- const listener = createEventListenerWrapperWithPriority(\n- targetContainer,\n- topLevelType,\n- eventSystemFlags,\n- );\n- const unsubscribeListener = capture\n- ? addEventCaptureListener(targetContainer, rawEventName, listener)\n- : addEventBubbleListener(targetContainer, rawEventName, listener);\n- return unsubscribeListener;\n-}\n-\n-function getParent(inst: Object | null): Object | null {\n- if (!inst) {\n- return null;\n- }\n- do {\n- inst = inst.return;\n- \/\/ TODO: If this is a HostRoot we might want to bail out.\n- \/\/ That is depending on if we want nested subtrees (layers) to bubble\n- \/\/ events to their parent. We could also go through parentNode on the\n- \/\/ host node but that wouldn't work for React Native and doesn't let us\n- \/\/ do the portal feature.\n- } while (inst && inst.tag !== HostComponent);\n- if (inst) {\n- return inst;\n- }\n- return null;\n-}\n-\n-\/**\n- * Simulates the traversal of a two-phase, capture\/bubble event dispatch.\n- *\/\n-function traverseTwoPhase(\n- inst: Object,\n- fn: Function,\n- arg: ReactSyntheticEvent,\n-) {\n- const path = [];\n- while (inst) {\n- path.push(inst);\n- inst = getParent(inst);\n- }\n- let i;\n- for (i = path.length; i-- > 0; ) {\n- fn(path[i], 'captured', arg);\n- }\n- for (i = 0; i < path.length; i++) {\n- fn(path[i], 'bubbled', arg);\n- }\n-}\n-\n-function listenerAtPhase(inst, event, propagationPhase) {\n- const registrationName =\n- event.dispatchConfig.phasedRegistrationNames[propagationPhase];\n- return getListener(inst, registrationName);\n-}\n-\n-\/**\n- * Return the lowest common ancestor of A and B, or null if they are in\n- * different trees.\n- *\/\n-export function getLowestCommonAncestor(\n- instA: Object,\n- instB: Object,\n-): Object | null {\n- let depthA = 0;\n- for (let tempA = instA; tempA; tempA = getParent(tempA)) {\n- depthA++;\n- }\n- let depthB = 0;\n- for (let tempB = instB; tempB; tempB = getParent(tempB)) {\n- depthB++;\n- }\n-\n- \/\/ If A is deeper, crawl up.\n- while (depthA - depthB > 0) {\n- instA = getParent(instA);\n- depthA--;\n- }\n-\n- \/\/ If B is deeper, crawl up.\n- while (depthB - depthA > 0) {\n- instB = getParent(instB);\n- depthB--;\n- }\n-\n- \/\/ Walk in lockstep until we find a match.\n- let depth = depthA;\n- while (depth--) {\n- if (instA === instB || instA === instB.alternate) {\n- return instA;\n- }\n- instA = getParent(instA);\n- instB = getParent(instB);\n- }\n- return null;\n-}\n-\n-\/**\n- * Traverses the ID hierarchy and invokes the supplied `cb` on any IDs that\n- * should would receive a `mouseEnter` or `mouseLeave` event.\n- *\n- * Does not invoke the callback on the nearest common ancestor because nothing\n- * \"entered\" or \"left\" that element.\n- *\/\n-export function traverseEnterLeave(\n- from: Object,\n- to: Object,\n- fn: Function,\n- argFrom: ReactSyntheticEvent,\n- argTo: ReactSyntheticEvent,\n-) {\n- const common = from && to ? getLowestCommonAncestor(from, to) : null;\n- const pathFrom = [];\n- while (true) {\n- if (!from) {\n- break;\n- }\n- if (from === common) {\n- break;\n- }\n- const alternate = from.alternate;\n- if (alternate !== null && alternate === common) {\n- break;\n- }\n- pathFrom.push(from);\n- from = getParent(from);\n- }\n- const pathTo = [];\n- while (true) {\n- if (!to) {\n- break;\n- }\n- if (to === common) {\n- break;\n- }\n- const alternate = to.alternate;\n- if (alternate !== null && alternate === common) {\n- break;\n- }\n- pathTo.push(to);\n- to = getParent(to);\n- }\n- for (let i = 0; i < pathFrom.length; i++) {\n- fn(pathFrom[i], 'bubbled', argFrom);\n- }\n- for (let i = pathTo.length; i-- > 0; ) {\n- fn(pathTo[i], 'captured', argTo);\n- }\n-}\n-\n-function accumulateDirectionalDispatches(inst, phase, event) {\n- if (__DEV__) {\n- if (!inst) {\n- console.error('Dispatching inst must not be null');\n- }\n- }\n- const listener = listenerAtPhase(inst, event, phase);\n- if (listener) {\n- event._dispatchListeners = accumulateInto(\n- event._dispatchListeners,\n- listener,\n- );\n- event._dispatchInstances = accumulateInto(event._dispatchInstances, inst);\n- }\n-}\n-\n-function accumulateTwoPhaseDispatchesSingle(event) {\n- if (event && event.dispatchConfig.phasedRegistrationNames) {\n- traverseTwoPhase(event._targetInst, accumulateDirectionalDispatches, event);\n- }\n-}\n-\n-\/**\n- * Accumulates without regard to direction, does not look for phased\n- * registration names. Same as `accumulateDirectDispatchesSingle` but without\n- * requiring that the `dispatchMarker` be the same as the dispatched ID.\n- *\/\n-function accumulateDispatches(\n- inst: Object,\n- ignoredDirection: ?boolean,\n- event: Object,\n-): void {\n- if (inst && event && event.dispatchConfig.registrationName) {\n- const registrationName = event.dispatchConfig.registrationName;\n- const listener = getListener(inst, registrationName);\n- if (listener) {\n- event._dispatchListeners = accumulateInto(\n- event._dispatchListeners,\n- listener,\n- );\n- event._dispatchInstances = accumulateInto(event._dispatchInstances, inst);\n- }\n- }\n-}\n-\n-export function accumulateTwoPhaseDispatches(\n- events: ReactSyntheticEvent | Array,\n-): void {\n- forEachAccumulated(events, accumulateTwoPhaseDispatchesSingle);\n-}\n-\n-export function accumulateEnterLeaveDispatches(\n- leave: ReactSyntheticEvent,\n- enter: ReactSyntheticEvent,\n- from: Fiber,\n- to: Fiber,\n-) {\n- traverseEnterLeave(from, to, accumulateDispatches, leave, enter);\n-}\ndiff --git a\/packages\/react-dom\/src\/events\/ReactDOMEventListener.js b\/packages\/react-dom\/src\/events\/ReactDOMEventListener.js\nindex d906ea8b54..c83e3cd284 100644\n--- a\/packages\/react-dom\/src\/events\/ReactDOMEventListener.js\n+++ b\/packages\/react-dom\/src\/events\/ReactDOMEventListener.js\n@@ -43,7 +43,6 @@ import {getClosestInstanceFromNode} from '..\/client\/ReactDOMComponentTree';\n \n import {\n enableDeprecatedFlareAPI,\n- enableModernEventSystem,\n enableLegacyFBSupport,\n } from 'shared\/ReactFeatureFlags';\n import {\n@@ -52,7 +51,6 @@ import {\n DiscreteEvent,\n } from 'shared\/ReactTypes';\n import {getEventPriorityForPluginSystem} from '.\/DOMEventProperties';\n-import {dispatchEventForLegacyPluginEventSystem} from '.\/DOMLegacyEventPluginSystem';\n import {dispatchEventForPluginEventSystem} from '.\/DOMModernPluginEventSystem';\n import {\n flushDiscreteUpdatesIfNeeded,\n@@ -230,22 +228,13 @@ export function dispatchEvent(\n \/\/ in case the event system needs to trace it.\n if (enableDeprecatedFlareAPI) {\n if (eventSystemFlags & PLUGIN_EVENT_SYSTEM) {\n- if (enableModernEventSystem) {\n- dispatchEventForPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- null,\n- targetContainer,\n- );\n- } else {\n- dispatchEventForLegacyPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- null,\n- );\n- }\n+ dispatchEventForPluginEventSystem(\n+ topLevelType,\n+ eventSystemFlags,\n+ nativeEvent,\n+ null,\n+ targetContainer,\n+ );\n }\n if (eventSystemFlags & RESPONDER_EVENT_SYSTEM) {\n \/\/ React Flare event system\n@@ -258,22 +247,13 @@ export function dispatchEvent(\n );\n }\n } else {\n- if (enableModernEventSystem) {\n- dispatchEventForPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- null,\n- targetContainer,\n- );\n- } else {\n- dispatchEventForLegacyPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- null,\n- );\n- }\n+ dispatchEventForPluginEventSystem(\n+ topLevelType,\n+ eventSystemFlags,\n+ nativeEvent,\n+ null,\n+ targetContainer,\n+ );\n }\n }\n \n@@ -329,22 +309,13 @@ export function attemptToDispatchEvent(\n \n if (enableDeprecatedFlareAPI) {\n if (eventSystemFlags & PLUGIN_EVENT_SYSTEM) {\n- if (enableModernEventSystem) {\n- dispatchEventForPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- targetInst,\n- targetContainer,\n- );\n- } else {\n- dispatchEventForLegacyPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- targetInst,\n- );\n- }\n+ dispatchEventForPluginEventSystem(\n+ topLevelType,\n+ eventSystemFlags,\n+ nativeEvent,\n+ targetInst,\n+ targetContainer,\n+ );\n }\n if (eventSystemFlags & RESPONDER_EVENT_SYSTEM) {\n \/\/ React Flare event system\n@@ -357,22 +328,13 @@ export function attemptToDispatchEvent(\n );\n }\n } else {\n- if (enableModernEventSystem) {\n- dispatchEventForPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- targetInst,\n- targetContainer,\n- );\n- } else {\n- dispatchEventForLegacyPluginEventSystem(\n- topLevelType,\n- eventSystemFlags,\n- nativeEvent,\n- targetInst,\n- );\n- }\n+ dispatchEventForPluginEventSystem(\n+ topLevelType,\n+ eventSystemFlags,\n+ nativeEvent,\n+ targetInst,\n+ targetContainer,\n+ );\n }\n \/\/ We're not blocked on anything.\n return null;\ndiff --git a\/packages\/react-dom\/src\/events\/ReactDOMEventReplaying.js b\/packages\/react-dom\/src\/events\/ReactDOMEventReplaying.js\nindex f544755937..9d4cd1a9e3 100644\n--- a\/packages\/react-dom\/src\/events\/ReactDOMEventReplaying.js\n+++ b\/packages\/react-dom\/src\/events\/ReactDOMEventReplaying.js\n@@ -17,7 +17,6 @@ import type {FiberRoot} from 'react-reconciler\/src\/ReactInternalTypes';\n import {\n enableDeprecatedFlareAPI,\n enableSelectiveHydration,\n- enableModernEventSystem,\n } from 'shared\/ReactFeatureFlags';\n import {\n unstable_runWithPriority as runWithPriority,\n@@ -116,7 +115,6 @@ import {\n TOP_BLUR,\n } from '.\/DOMTopLevelEventTypes';\n import {IS_REPLAYED, PLUGIN_EVENT_SYSTEM} from '.\/EventSystemFlags';\n-import {legacyListenToTopLevelEvent} from '.\/DOMLegacyEventPluginSystem';\n import {listenToTopLevelEvent} from '.\/DOMModernPluginEventSystem';\n import {addResponderEventSystemEvent} from '.\/DeprecatedDOMEventResponderSystem';\n \n@@ -230,9 +228,6 @@ function trapReplayableEventForDocument(\n document: Document,\n listenerMap: ElementListenerMap,\n ) {\n- if (!enableModernEventSystem) {\n- legacyListenToTopLevelEvent(topLevelType, document, listenerMap);\n- }\n if (enableDeprecatedFlareAPI) {\n \/\/ Trap events for the responder system.\n const topLevelTypeString = unsafeCastDOMTopLevelTypeToString(topLevelType);\n@@ -257,30 +252,23 @@ export function eagerlyTrapReplayableEvents(\n document: Document,\n ) {\n const listenerMapForDoc = getEventListenerMap(document);\n- let listenerMapForContainer;\n- if (enableModernEventSystem) {\n- listenerMapForContainer = getEventListenerMap(container);\n- }\n+ const listenerMapForContainer = getEventListenerMap(container);\n \/\/ Discrete\n discreteReplayableEvents.forEach(topLevelType => {\n- if (enableModernEventSystem) {\n- trapReplayableEventForContainer(\n- topLevelType,\n- container,\n- listenerMapForContainer,\n- );\n- }\n+ trapReplayableEventForContainer(\n+ topLevelType,\n+ container,\n+ listenerMapForContainer,\n+ );\n trapReplayableEventForDocument(topLevelType, document, listenerMapForDoc);\n });\n \/\/ Continuous\n continuousReplayableEvents.forEach(topLevelType => {\n- if (enableModernEventSystem) {\n- trapReplayableEventForContainer(\n- topLevelType,\n- container,\n- listenerMapForContainer,\n- );\n- }\n+ trapReplayableEventForContainer(\n+ topLevelType,\n+ container,\n+ listenerMapForContainer,\n+ );\n trapReplayableEventForDocument(topLevelType, document, listenerMapForDoc);\n });\n }\ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/DOMModernPluginEventSystem-test.internal.js b\/packages\/react-dom\/src\/events\/__tests__\/DOMModernPluginEventSystem-test.internal.js\nindex ce7d006905..9e5b09e8b0 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/DOMModernPluginEventSystem-test.internal.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/DOMModernPluginEventSystem-test.internal.js\n@@ -60,7 +60,6 @@ describe('DOMModernPluginEventSystem', () => {\n beforeEach(() => {\n jest.resetModules();\n ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n ReactFeatureFlags.enableLegacyFBSupport = enableLegacyFBSupport;\n \n React = require('react');\n@@ -1197,7 +1196,6 @@ describe('DOMModernPluginEventSystem', () => {\n jest.resetModules();\n ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n ReactFeatureFlags.enableLegacyFBSupport = enableLegacyFBSupport;\n- ReactFeatureFlags.enableModernEventSystem = true;\n ReactFeatureFlags.enableCreateEventHandleAPI = true;\n \n React = require('react');\n@@ -2555,7 +2553,6 @@ describe('DOMModernPluginEventSystem', () => {\n beforeEach(() => {\n jest.resetModules();\n ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n ReactFeatureFlags.enableCreateEventHandleAPI = true;\n ReactFeatureFlags.enableScopeAPI = true;\n \ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticClipboardEvent-test.js b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticClipboardEvent-test.js\nindex adef2ac705..4bc4d57019 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticClipboardEvent-test.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticClipboardEvent-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n \n describe('SyntheticClipboardEvent', () => {\n let container;\n@@ -117,44 +116,5 @@ describe('SyntheticClipboardEvent', () => {\n \n expect(expectedCount).toBe(3);\n });\n-\n- if (!ReactFeatureFlags.enableModernEventSystem) {\n- it('is able to `persist`', () => {\n- const persistentEvents = [];\n- const eventHandler = event => {\n- expect(event.isPersistent()).toBe(false);\n- event.persist();\n- expect(event.isPersistent()).toBe(true);\n- persistentEvents.push(event);\n- };\n-\n- const div = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- let event;\n- event = document.createEvent('Event');\n- event.initEvent('copy', true, true);\n- div.dispatchEvent(event);\n-\n- event = document.createEvent('Event');\n- event.initEvent('cut', true, true);\n- div.dispatchEvent(event);\n-\n- event = document.createEvent('Event');\n- event.initEvent('paste', true, true);\n- div.dispatchEvent(event);\n-\n- expect(persistentEvents.length).toBe(3);\n- expect(persistentEvents[0].type).toBe('copy');\n- expect(persistentEvents[1].type).toBe('cut');\n- expect(persistentEvents[2].type).toBe('paste');\n- });\n- }\n });\n });\ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticEvent-test.js b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticEvent-test.js\nindex 718173ef7f..78e576e4e0 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticEvent-test.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticEvent-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n \n describe('SyntheticEvent', () => {\n let container;\n@@ -99,256 +98,4 @@ describe('SyntheticEvent', () => {\n \n expect(expectedCount).toBe(1);\n });\n-\n- if (!ReactFeatureFlags.enableModernEventSystem) {\n- it('should be able to `persist`', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- expect(e.isPersistent()).toBe(false);\n- e.persist();\n- syntheticEvent = e;\n- expect(e.isPersistent()).toBe(true);\n-\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- expect(syntheticEvent.type).toBe('click');\n- expect(syntheticEvent.bubbles).toBe(true);\n- expect(syntheticEvent.cancelable).toBe(true);\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should be nullified and log warnings if the synthetic event has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n-\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- const getExpectedWarning = property =>\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- `you're seeing this, you're accessing the property \\`${property}\\` on a ` +\n- 'released\/nullified synthetic event. This is set to null. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.';\n-\n- \/\/ once for each property accessed\n- expect(() =>\n- expect(syntheticEvent.type).toBe(null),\n- ).toErrorDev(getExpectedWarning('type'), {withoutStack: true});\n- expect(() =>\n- expect(syntheticEvent.nativeEvent).toBe(null),\n- ).toErrorDev(getExpectedWarning('nativeEvent'), {withoutStack: true});\n- expect(() =>\n- expect(syntheticEvent.target).toBe(null),\n- ).toErrorDev(getExpectedWarning('target'), {withoutStack: true});\n-\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should warn when setting properties of a synthetic event that has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n-\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- expect(() => {\n- syntheticEvent.type = 'MouseEvent';\n- }).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're setting the property `type` on a \" +\n- 'released\/nullified synthetic event. This is effectively a no-op. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should warn when calling `preventDefault` if the synthetic event has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- expect(() =>\n- syntheticEvent.preventDefault(),\n- ).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're accessing the method `preventDefault` on a \" +\n- 'released\/nullified synthetic event. This is a no-op function. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should warn when calling `stopPropagation` if the synthetic event has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n-\n- node.dispatchEvent(event);\n-\n- expect(() =>\n- syntheticEvent.stopPropagation(),\n- ).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're accessing the method `stopPropagation` on a \" +\n- 'released\/nullified synthetic event. This is a no-op function. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should warn when calling `isPropagationStopped` if the synthetic event has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- expect(() =>\n- expect(syntheticEvent.isPropagationStopped()).toBe(false),\n- ).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're accessing the method `isPropagationStopped` on a \" +\n- 'released\/nullified synthetic event. This is a no-op function. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should warn when calling `isDefaultPrevented` if the synthetic event has not been persisted', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- syntheticEvent = e;\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n- node.dispatchEvent(event);\n-\n- expect(() =>\n- expect(syntheticEvent.isDefaultPrevented()).toBe(false),\n- ).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're accessing the method `isDefaultPrevented` on a \" +\n- 'released\/nullified synthetic event. This is a no-op function. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- expect(expectedCount).toBe(1);\n- });\n-\n- it('should properly log warnings when events simulated with rendered components', () => {\n- let event;\n- function assignEvent(e) {\n- event = e;\n- }\n- const node = ReactDOM.render(

, container);\n- node.click();\n-\n- \/\/ access a property to cause the warning\n- expect(() => {\n- event.nativeEvent; \/\/ eslint-disable-line no-unused-expressions\n- }).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're accessing the property `nativeEvent` on a \" +\n- 'released\/nullified synthetic event. This is set to null. If you must ' +\n- 'keep the original synthetic event around, use event.persist(). ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- });\n- }\n-\n- \/\/ TODO: we might want to re-add a warning like this in the future,\n- \/\/ but it shouldn't use Proxies because they make debugging difficult.\n- \/\/ Or we might disallow this pattern altogether:\n- \/\/ https:\/\/github.com\/facebook\/react\/issues\/13224\n- xit('should warn if a property is added to the synthetic event', () => {\n- let expectedCount = 0;\n- let syntheticEvent;\n-\n- const eventHandler = e => {\n- expect(() => {\n- e.foo = 'bar';\n- }).toErrorDev(\n- 'Warning: This synthetic event is reused for performance reasons. If ' +\n- \"you're seeing this, you're adding a new property in the synthetic \" +\n- 'event object. The property is never released. ' +\n- 'See https:\/\/fb.me\/react-event-pooling for more information.',\n- {withoutStack: true},\n- );\n- syntheticEvent = e;\n- expectedCount++;\n- };\n- const node = ReactDOM.render(

, container);\n-\n- const event = document.createEvent('Event');\n- event.initEvent('click', true, true);\n-\n- node.dispatchEvent(event);\n-\n- expect(syntheticEvent.foo).toBe('bar');\n- expect(expectedCount).toBe(1);\n- });\n });\ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticKeyboardEvent-test.js b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticKeyboardEvent-test.js\nindex fb99edef4d..6cfd34f5d0 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticKeyboardEvent-test.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticKeyboardEvent-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n \n describe('SyntheticKeyboardEvent', () => {\n let container;\n@@ -547,52 +546,5 @@ describe('SyntheticKeyboardEvent', () => {\n );\n expect(expectedCount).toBe(3);\n });\n-\n- if (!ReactFeatureFlags.enableModernEventSystem) {\n- it('is able to `persist`', () => {\n- const persistentEvents = [];\n- const eventHandler = event => {\n- expect(event.isPersistent()).toBe(false);\n- event.persist();\n- expect(event.isPersistent()).toBe(true);\n- persistentEvents.push(event);\n- };\n- const div = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- div.dispatchEvent(\n- new KeyboardEvent('keydown', {\n- keyCode: 40,\n- bubbles: true,\n- cancelable: true,\n- }),\n- );\n- div.dispatchEvent(\n- new KeyboardEvent('keyup', {\n- keyCode: 40,\n- bubbles: true,\n- cancelable: true,\n- }),\n- );\n- div.dispatchEvent(\n- new KeyboardEvent('keypress', {\n- charCode: 40,\n- keyCode: 40,\n- bubbles: true,\n- cancelable: true,\n- }),\n- );\n- expect(persistentEvents.length).toBe(3);\n- expect(persistentEvents[0].type).toBe('keydown');\n- expect(persistentEvents[1].type).toBe('keyup');\n- expect(persistentEvents[2].type).toBe('keypress');\n- });\n- }\n });\n });\ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticWheelEvent-test.js b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticWheelEvent-test.js\nindex 64f496c85e..1ae7c5b768 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/SyntheticWheelEvent-test.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/SyntheticWheelEvent-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-const ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n \n describe('SyntheticWheelEvent', () => {\n let container;\n@@ -113,26 +112,4 @@ describe('SyntheticWheelEvent', () => {\n \n expect(events.length).toBe(2);\n });\n-\n- if (!ReactFeatureFlags.enableModernEventSystem) {\n- it('should be able to `persist`', () => {\n- const events = [];\n- const onWheel = event => {\n- expect(event.isPersistent()).toBe(false);\n- event.persist();\n- expect(event.isPersistent()).toBe(true);\n- events.push(event);\n- };\n- ReactDOM.render(

, container);\n-\n- container.firstChild.dispatchEvent(\n- new MouseEvent('wheel', {\n- bubbles: true,\n- }),\n- );\n-\n- expect(events.length).toBe(1);\n- expect(events[0].type).toBe('wheel');\n- });\n- }\n });\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/LegacyBeforeInputEventPlugin.js b\/packages\/react-dom\/src\/events\/plugins\/LegacyBeforeInputEventPlugin.js\ndeleted file mode 100644\nindex 1175fd56fc..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/LegacyBeforeInputEventPlugin.js\n+++ \/dev\/null\n@@ -1,498 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\/\n-\n-import type {TopLevelType} from '..\/..\/legacy-events\/TopLevelEventTypes';\n-\n-import {canUseDOM} from 'shared\/ExecutionEnvironment';\n-\n-import {\n- TOP_BLUR,\n- TOP_COMPOSITION_START,\n- TOP_COMPOSITION_END,\n- TOP_COMPOSITION_UPDATE,\n- TOP_KEY_DOWN,\n- TOP_KEY_PRESS,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- TOP_TEXT_INPUT,\n- TOP_PASTE,\n-} from '..\/DOMTopLevelEventTypes';\n-import {\n- getData as FallbackCompositionStateGetData,\n- initialize as FallbackCompositionStateInitialize,\n- reset as FallbackCompositionStateReset,\n-} from '..\/FallbackCompositionState';\n-import SyntheticCompositionEvent from '..\/SyntheticCompositionEvent';\n-import SyntheticInputEvent from '..\/SyntheticInputEvent';\n-import {accumulateTwoPhaseDispatches} from '..\/DOMLegacyEventPluginSystem';\n-\n-const END_KEYCODES = [9, 13, 27, 32]; \/\/ Tab, Return, Esc, Space\n-const START_KEYCODE = 229;\n-\n-const canUseCompositionEvent = canUseDOM && 'CompositionEvent' in window;\n-\n-let documentMode = null;\n-if (canUseDOM && 'documentMode' in document) {\n- documentMode = document.documentMode;\n-}\n-\n-\/\/ Webkit offers a very useful `textInput` event that can be used to\n-\/\/ directly represent `beforeInput`. The IE `textinput` event is not as\n-\/\/ useful, so we don't use it.\n-const canUseTextInputEvent =\n- canUseDOM && 'TextEvent' in window && !documentMode;\n-\n-\/\/ In IE9+, we have access to composition events, but the data supplied\n-\/\/ by the native compositionend event may be incorrect. Japanese ideographic\n-\/\/ spaces, for instance (\\u3000) are not recorded correctly.\n-const useFallbackCompositionData =\n- canUseDOM &&\n- (!canUseCompositionEvent ||\n- (documentMode && documentMode > 8 && documentMode <= 11));\n-\n-const SPACEBAR_CODE = 32;\n-const SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);\n-\n-\/\/ Events and their corresponding property names.\n-const eventTypes = {\n- beforeInput: {\n- phasedRegistrationNames: {\n- bubbled: 'onBeforeInput',\n- captured: 'onBeforeInputCapture',\n- },\n- dependencies: [\n- TOP_COMPOSITION_END,\n- TOP_KEY_PRESS,\n- TOP_TEXT_INPUT,\n- TOP_PASTE,\n- ],\n- },\n- compositionEnd: {\n- phasedRegistrationNames: {\n- bubbled: 'onCompositionEnd',\n- captured: 'onCompositionEndCapture',\n- },\n- dependencies: [\n- TOP_BLUR,\n- TOP_COMPOSITION_END,\n- TOP_KEY_DOWN,\n- TOP_KEY_PRESS,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- ],\n- },\n- compositionStart: {\n- phasedRegistrationNames: {\n- bubbled: 'onCompositionStart',\n- captured: 'onCompositionStartCapture',\n- },\n- dependencies: [\n- TOP_BLUR,\n- TOP_COMPOSITION_START,\n- TOP_KEY_DOWN,\n- TOP_KEY_PRESS,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- ],\n- },\n- compositionUpdate: {\n- phasedRegistrationNames: {\n- bubbled: 'onCompositionUpdate',\n- captured: 'onCompositionUpdateCapture',\n- },\n- dependencies: [\n- TOP_BLUR,\n- TOP_COMPOSITION_UPDATE,\n- TOP_KEY_DOWN,\n- TOP_KEY_PRESS,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- ],\n- },\n-};\n-\n-\/\/ Track whether we've ever handled a keypress on the space key.\n-let hasSpaceKeypress = false;\n-\n-\/**\n- * Return whether a native keypress event is assumed to be a command.\n- * This is required because Firefox fires `keypress` events for key commands\n- * (cut, copy, select-all, etc.) even though no character is inserted.\n- *\/\n-function isKeypressCommand(nativeEvent) {\n- return (\n- (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) &&\n- \/\/ ctrlKey && altKey is equivalent to AltGr, and is not a command.\n- !(nativeEvent.ctrlKey && nativeEvent.altKey)\n- );\n-}\n-\n-\/**\n- * Translate native top level events into event types.\n- *\n- * @param {string} topLevelType\n- * @return {object}\n- *\/\n-function getCompositionEventType(topLevelType) {\n- switch (topLevelType) {\n- case TOP_COMPOSITION_START:\n- return eventTypes.compositionStart;\n- case TOP_COMPOSITION_END:\n- return eventTypes.compositionEnd;\n- case TOP_COMPOSITION_UPDATE:\n- return eventTypes.compositionUpdate;\n- }\n-}\n-\n-\/**\n- * Does our fallback best-guess model think this event signifies that\n- * composition has begun?\n- *\n- * @param {string} topLevelType\n- * @param {object} nativeEvent\n- * @return {boolean}\n- *\/\n-function isFallbackCompositionStart(topLevelType, nativeEvent) {\n- return topLevelType === TOP_KEY_DOWN && nativeEvent.keyCode === START_KEYCODE;\n-}\n-\n-\/**\n- * Does our fallback mode think that this event is the end of composition?\n- *\n- * @param {string} topLevelType\n- * @param {object} nativeEvent\n- * @return {boolean}\n- *\/\n-function isFallbackCompositionEnd(topLevelType, nativeEvent) {\n- switch (topLevelType) {\n- case TOP_KEY_UP:\n- \/\/ Command keys insert or clear IME input.\n- return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1;\n- case TOP_KEY_DOWN:\n- \/\/ Expect IME keyCode on each keydown. If we get any other\n- \/\/ code we must have exited earlier.\n- return nativeEvent.keyCode !== START_KEYCODE;\n- case TOP_KEY_PRESS:\n- case TOP_MOUSE_DOWN:\n- case TOP_BLUR:\n- \/\/ Events are not possible without cancelling IME.\n- return true;\n- default:\n- return false;\n- }\n-}\n-\n-\/**\n- * Google Input Tools provides composition data via a CustomEvent,\n- * with the `data` property populated in the `detail` object. If this\n- * is available on the event object, use it. If not, this is a plain\n- * composition event and we have nothing special to extract.\n- *\n- * @param {object} nativeEvent\n- * @return {?string}\n- *\/\n-function getDataFromCustomEvent(nativeEvent) {\n- const detail = nativeEvent.detail;\n- if (typeof detail === 'object' && 'data' in detail) {\n- return detail.data;\n- }\n- return null;\n-}\n-\n-\/**\n- * Check if a composition event was triggered by Korean IME.\n- * Our fallback mode does not work well with IE's Korean IME,\n- * so just use native composition events when Korean IME is used.\n- * Although CompositionEvent.locale property is deprecated,\n- * it is available in IE, where our fallback mode is enabled.\n- *\n- * @param {object} nativeEvent\n- * @return {boolean}\n- *\/\n-function isUsingKoreanIME(nativeEvent) {\n- return nativeEvent.locale === 'ko';\n-}\n-\n-\/\/ Track the current IME composition status, if any.\n-let isComposing = false;\n-\n-\/**\n- * @return {?object} A SyntheticCompositionEvent.\n- *\/\n-function extractCompositionEvent(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n-) {\n- let eventType;\n- let fallbackData;\n-\n- if (canUseCompositionEvent) {\n- eventType = getCompositionEventType(topLevelType);\n- } else if (!isComposing) {\n- if (isFallbackCompositionStart(topLevelType, nativeEvent)) {\n- eventType = eventTypes.compositionStart;\n- }\n- } else if (isFallbackCompositionEnd(topLevelType, nativeEvent)) {\n- eventType = eventTypes.compositionEnd;\n- }\n-\n- if (!eventType) {\n- return null;\n- }\n-\n- if (useFallbackCompositionData && !isUsingKoreanIME(nativeEvent)) {\n- \/\/ The current composition is stored statically and must not be\n- \/\/ overwritten while composition continues.\n- if (!isComposing && eventType === eventTypes.compositionStart) {\n- isComposing = FallbackCompositionStateInitialize(nativeEventTarget);\n- } else if (eventType === eventTypes.compositionEnd) {\n- if (isComposing) {\n- fallbackData = FallbackCompositionStateGetData();\n- }\n- }\n- }\n-\n- const event = SyntheticCompositionEvent.getPooled(\n- eventType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n-\n- if (fallbackData) {\n- \/\/ Inject data generated from fallback path into the synthetic event.\n- \/\/ This matches the property of native CompositionEventInterface.\n- event.data = fallbackData;\n- } else {\n- const customData = getDataFromCustomEvent(nativeEvent);\n- if (customData !== null) {\n- event.data = customData;\n- }\n- }\n-\n- accumulateTwoPhaseDispatches(event);\n- return event;\n-}\n-\n-\/**\n- * @param {TopLevelType} topLevelType Number from `TopLevelType`.\n- * @param {object} nativeEvent Native browser event.\n- * @return {?string} The string corresponding to this `beforeInput` event.\n- *\/\n-function getNativeBeforeInputChars(topLevelType: TopLevelType, nativeEvent) {\n- switch (topLevelType) {\n- case TOP_COMPOSITION_END:\n- return getDataFromCustomEvent(nativeEvent);\n- case TOP_KEY_PRESS:\n- \/**\n- * If native `textInput` events are available, our goal is to make\n- * use of them. However, there is a special case: the spacebar key.\n- * In Webkit, preventing default on a spacebar `textInput` event\n- * cancels character insertion, but it *also* causes the browser\n- * to fall back to its default spacebar behavior of scrolling the\n- * page.\n- *\n- * Tracking at:\n- * https:\/\/code.google.com\/p\/chromium\/issues\/detail?id=355103\n- *\n- * To avoid this issue, use the keypress event as if no `textInput`\n- * event is available.\n- *\/\n- const which = nativeEvent.which;\n- if (which !== SPACEBAR_CODE) {\n- return null;\n- }\n-\n- hasSpaceKeypress = true;\n- return SPACEBAR_CHAR;\n-\n- case TOP_TEXT_INPUT:\n- \/\/ Record the characters to be added to the DOM.\n- const chars = nativeEvent.data;\n-\n- \/\/ If it's a spacebar character, assume that we have already handled\n- \/\/ it at the keypress level and bail immediately. Android Chrome\n- \/\/ doesn't give us keycodes, so we need to ignore it.\n- if (chars === SPACEBAR_CHAR && hasSpaceKeypress) {\n- return null;\n- }\n-\n- return chars;\n-\n- default:\n- \/\/ For other native event types, do nothing.\n- return null;\n- }\n-}\n-\n-\/**\n- * For browsers that do not provide the `textInput` event, extract the\n- * appropriate string to use for SyntheticInputEvent.\n- *\n- * @param {number} topLevelType Number from `TopLevelEventTypes`.\n- * @param {object} nativeEvent Native browser event.\n- * @return {?string} The fallback string for this `beforeInput` event.\n- *\/\n-function getFallbackBeforeInputChars(topLevelType: TopLevelType, nativeEvent) {\n- \/\/ If we are currently composing (IME) and using a fallback to do so,\n- \/\/ try to extract the composed characters from the fallback object.\n- \/\/ If composition event is available, we extract a string only at\n- \/\/ compositionevent, otherwise extract it at fallback events.\n- if (isComposing) {\n- if (\n- topLevelType === TOP_COMPOSITION_END ||\n- (!canUseCompositionEvent &&\n- isFallbackCompositionEnd(topLevelType, nativeEvent))\n- ) {\n- const chars = FallbackCompositionStateGetData();\n- FallbackCompositionStateReset();\n- isComposing = false;\n- return chars;\n- }\n- return null;\n- }\n-\n- switch (topLevelType) {\n- case TOP_PASTE:\n- \/\/ If a paste event occurs after a keypress, throw out the input\n- \/\/ chars. Paste events should not lead to BeforeInput events.\n- return null;\n- case TOP_KEY_PRESS:\n- \/**\n- * As of v27, Firefox may fire keypress events even when no character\n- * will be inserted. A few possibilities:\n- *\n- * - `which` is `0`. Arrow keys, Esc key, etc.\n- *\n- * - `which` is the pressed key code, but no char is available.\n- * Ex: 'AltGr + d` in Polish. There is no modified character for\n- * this key combination and no character is inserted into the\n- * document, but FF fires the keypress for char code `100` anyway.\n- * No `input` event will occur.\n- *\n- * - `which` is the pressed key code, but a command combination is\n- * being used. Ex: `Cmd+C`. No character is inserted, and no\n- * `input` event will occur.\n- *\/\n- if (!isKeypressCommand(nativeEvent)) {\n- \/\/ IE fires the `keypress` event when a user types an emoji via\n- \/\/ Touch keyboard of Windows. In such a case, the `char` property\n- \/\/ holds an emoji character like `\\uD83D\\uDE0A`. Because its length\n- \/\/ is 2, the property `which` does not represent an emoji correctly.\n- \/\/ In such a case, we directly return the `char` property instead of\n- \/\/ using `which`.\n- if (nativeEvent.char && nativeEvent.char.length > 1) {\n- return nativeEvent.char;\n- } else if (nativeEvent.which) {\n- return String.fromCharCode(nativeEvent.which);\n- }\n- }\n- return null;\n- case TOP_COMPOSITION_END:\n- return useFallbackCompositionData && !isUsingKoreanIME(nativeEvent)\n- ? null\n- : nativeEvent.data;\n- default:\n- return null;\n- }\n-}\n-\n-\/**\n- * Extract a SyntheticInputEvent for `beforeInput`, based on either native\n- * `textInput` or fallback behavior.\n- *\n- * @return {?object} A SyntheticInputEvent.\n- *\/\n-function extractBeforeInputEvent(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n-) {\n- let chars;\n-\n- if (canUseTextInputEvent) {\n- chars = getNativeBeforeInputChars(topLevelType, nativeEvent);\n- } else {\n- chars = getFallbackBeforeInputChars(topLevelType, nativeEvent);\n- }\n-\n- \/\/ If no characters are being inserted, no BeforeInput event should\n- \/\/ be fired.\n- if (!chars) {\n- return null;\n- }\n-\n- const event = SyntheticInputEvent.getPooled(\n- eventTypes.beforeInput,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n-\n- event.data = chars;\n- accumulateTwoPhaseDispatches(event);\n- return event;\n-}\n-\n-\/**\n- * Create an `onBeforeInput` event to match\n- * http:\/\/www.w3.org\/TR\/2013\/WD-DOM-Level-3-Events-20131105\/#events-inputevents.\n- *\n- * This event plugin is based on the native `textInput` event\n- * available in Chrome, Safari, Opera, and IE. This event fires after\n- * `onKeyPress` and `onCompositionEnd`, but before `onInput`.\n- *\n- * `beforeInput` is spec'd but not implemented in any browsers, and\n- * the `input` event does not provide any useful information about what has\n- * actually been added, contrary to the spec. Thus, `textInput` is the best\n- * available event to identify the characters that have actually been inserted\n- * into the target node.\n- *\n- * This plugin is also responsible for emitting `composition` events, thus\n- * allowing us to share composition fallback code for both `beforeInput` and\n- * `composition` event types.\n- *\/\n-const BeforeInputEventPlugin = {\n- eventTypes: eventTypes,\n-\n- extractEvents: function(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- ) {\n- const composition = extractCompositionEvent(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n-\n- const beforeInput = extractBeforeInputEvent(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n-\n- if (composition === null) {\n- return beforeInput;\n- }\n-\n- if (beforeInput === null) {\n- return composition;\n- }\n-\n- return [composition, beforeInput];\n- },\n-};\n-\n-export default BeforeInputEventPlugin;\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/LegacyChangeEventPlugin.js b\/packages\/react-dom\/src\/events\/plugins\/LegacyChangeEventPlugin.js\ndeleted file mode 100644\nindex a03c3819a4..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/LegacyChangeEventPlugin.js\n+++ \/dev\/null\n@@ -1,310 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\/\n-\n-import {runEventsInBatch} from '..\/..\/legacy-events\/EventBatching';\n-import SyntheticEvent from '..\/..\/legacy-events\/SyntheticEvent';\n-import isTextInputElement from '..\/isTextInputElement';\n-import {canUseDOM} from 'shared\/ExecutionEnvironment';\n-\n-import {\n- TOP_BLUR,\n- TOP_CHANGE,\n- TOP_CLICK,\n- TOP_FOCUS,\n- TOP_INPUT,\n- TOP_KEY_DOWN,\n- TOP_KEY_UP,\n- TOP_SELECTION_CHANGE,\n-} from '..\/DOMTopLevelEventTypes';\n-import getEventTarget from '..\/getEventTarget';\n-import isEventSupported from '..\/isEventSupported';\n-import {getNodeFromInstance} from '..\/..\/client\/ReactDOMComponentTree';\n-import {updateValueIfChanged} from '..\/..\/client\/inputValueTracking';\n-import {setDefaultValue} from '..\/..\/client\/ReactDOMInput';\n-import {enqueueStateRestore} from '..\/ReactDOMControlledComponent';\n-\n-import {disableInputAttributeSyncing} from 'shared\/ReactFeatureFlags';\n-import {batchedUpdates} from '..\/ReactDOMUpdateBatching';\n-import {accumulateTwoPhaseDispatches} from '..\/DOMLegacyEventPluginSystem';\n-\n-const eventTypes = {\n- change: {\n- phasedRegistrationNames: {\n- bubbled: 'onChange',\n- captured: 'onChangeCapture',\n- },\n- dependencies: [\n- TOP_BLUR,\n- TOP_CHANGE,\n- TOP_CLICK,\n- TOP_FOCUS,\n- TOP_INPUT,\n- TOP_KEY_DOWN,\n- TOP_KEY_UP,\n- TOP_SELECTION_CHANGE,\n- ],\n- },\n-};\n-\n-function createAndAccumulateChangeEvent(inst, nativeEvent, target) {\n- const event = SyntheticEvent.getPooled(\n- eventTypes.change,\n- inst,\n- nativeEvent,\n- target,\n- );\n- event.type = 'change';\n- \/\/ Flag this event loop as needing state restore.\n- enqueueStateRestore(target);\n- accumulateTwoPhaseDispatches(event);\n- return event;\n-}\n-\/**\n- * For IE shims\n- *\/\n-let activeElement = null;\n-let activeElementInst = null;\n-\n-\/**\n- * SECTION: handle `change` event\n- *\/\n-function shouldUseChangeEvent(elem) {\n- const nodeName = elem.nodeName && elem.nodeName.toLowerCase();\n- return (\n- nodeName === 'select' || (nodeName === 'input' && elem.type === 'file')\n- );\n-}\n-\n-function manualDispatchChangeEvent(nativeEvent) {\n- const event = createAndAccumulateChangeEvent(\n- activeElementInst,\n- nativeEvent,\n- getEventTarget(nativeEvent),\n- );\n-\n- \/\/ If change and propertychange bubbled, we'd just bind to it like all the\n- \/\/ other events and have it go through ReactBrowserEventEmitter. Since it\n- \/\/ doesn't, we manually listen for the events and so we have to enqueue and\n- \/\/ process the abstract event manually.\n- \/\/\n- \/\/ Batching is necessary here in order to ensure that all event handlers run\n- \/\/ before the next rerender (including event handlers attached to ancestor\n- \/\/ elements instead of directly on the input). Without this, controlled\n- \/\/ components don't work properly in conjunction with event bubbling because\n- \/\/ the component is rerendered and the value reverted before all the event\n- \/\/ handlers can run. See https:\/\/github.com\/facebook\/react\/issues\/708.\n- batchedUpdates(runEventInBatch, event);\n-}\n-\n-function runEventInBatch(event) {\n- runEventsInBatch(event);\n-}\n-\n-function getInstIfValueChanged(targetInst) {\n- const targetNode = getNodeFromInstance(targetInst);\n- if (updateValueIfChanged(targetNode)) {\n- return targetInst;\n- }\n-}\n-\n-function getTargetInstForChangeEvent(topLevelType, targetInst) {\n- if (topLevelType === TOP_CHANGE) {\n- return targetInst;\n- }\n-}\n-\n-\/**\n- * SECTION: handle `input` event\n- *\/\n-let isInputEventSupported = false;\n-if (canUseDOM) {\n- \/\/ IE9 claims to support the input event but fails to trigger it when\n- \/\/ deleting text, so we ignore its input events.\n- isInputEventSupported =\n- isEventSupported('input') &&\n- (!document.documentMode || document.documentMode > 9);\n-}\n-\n-\/**\n- * (For IE <=9) Starts tracking propertychange events on the passed-in element\n- * and override the value property so that we can distinguish user events from\n- * value changes in JS.\n- *\/\n-function startWatchingForValueChange(target, targetInst) {\n- activeElement = target;\n- activeElementInst = targetInst;\n- activeElement.attachEvent('onpropertychange', handlePropertyChange);\n-}\n-\n-\/**\n- * (For IE <=9) Removes the event listeners from the currently-tracked element,\n- * if any exists.\n- *\/\n-function stopWatchingForValueChange() {\n- if (!activeElement) {\n- return;\n- }\n- activeElement.detachEvent('onpropertychange', handlePropertyChange);\n- activeElement = null;\n- activeElementInst = null;\n-}\n-\n-\/**\n- * (For IE <=9) Handles a propertychange event, sending a `change` event if\n- * the value of the active element has changed.\n- *\/\n-function handlePropertyChange(nativeEvent) {\n- if (nativeEvent.propertyName !== 'value') {\n- return;\n- }\n- if (getInstIfValueChanged(activeElementInst)) {\n- manualDispatchChangeEvent(nativeEvent);\n- }\n-}\n-\n-function handleEventsForInputEventPolyfill(topLevelType, target, targetInst) {\n- if (topLevelType === TOP_FOCUS) {\n- \/\/ In IE9, propertychange fires for most input events but is buggy and\n- \/\/ doesn't fire when text is deleted, but conveniently, selectionchange\n- \/\/ appears to fire in all of the remaining cases so we catch those and\n- \/\/ forward the event if the value has changed\n- \/\/ In either case, we don't want to call the event handler if the value\n- \/\/ is changed from JS so we redefine a setter for `.value` that updates\n- \/\/ our activeElementValue variable, allowing us to ignore those changes\n- \/\/\n- \/\/ stopWatching() should be a noop here but we call it just in case we\n- \/\/ missed a blur event somehow.\n- stopWatchingForValueChange();\n- startWatchingForValueChange(target, targetInst);\n- } else if (topLevelType === TOP_BLUR) {\n- stopWatchingForValueChange();\n- }\n-}\n-\n-\/\/ For IE8 and IE9.\n-function getTargetInstForInputEventPolyfill(topLevelType, targetInst) {\n- if (\n- topLevelType === TOP_SELECTION_CHANGE ||\n- topLevelType === TOP_KEY_UP ||\n- topLevelType === TOP_KEY_DOWN\n- ) {\n- \/\/ On the selectionchange event, the target is just document which isn't\n- \/\/ helpful for us so just check activeElement instead.\n- \/\/\n- \/\/ 99% of the time, keydown and keyup aren't necessary. IE8 fails to fire\n- \/\/ propertychange on the first input event after setting `value` from a\n- \/\/ script and fires only keydown, keypress, keyup. Catching keyup usually\n- \/\/ gets it and catching keydown lets us fire an event for the first\n- \/\/ keystroke if user does a key repeat (it'll be a little delayed: right\n- \/\/ before the second keystroke). Other input methods (e.g., paste) seem to\n- \/\/ fire selectionchange normally.\n- return getInstIfValueChanged(activeElementInst);\n- }\n-}\n-\n-\/**\n- * SECTION: handle `click` event\n- *\/\n-function shouldUseClickEvent(elem) {\n- \/\/ Use the `click` event to detect changes to checkbox and radio inputs.\n- \/\/ This approach works across all browsers, whereas `change` does not fire\n- \/\/ until `blur` in IE8.\n- const nodeName = elem.nodeName;\n- return (\n- nodeName &&\n- nodeName.toLowerCase() === 'input' &&\n- (elem.type === 'checkbox' || elem.type === 'radio')\n- );\n-}\n-\n-function getTargetInstForClickEvent(topLevelType, targetInst) {\n- if (topLevelType === TOP_CLICK) {\n- return getInstIfValueChanged(targetInst);\n- }\n-}\n-\n-function getTargetInstForInputOrChangeEvent(topLevelType, targetInst) {\n- if (topLevelType === TOP_INPUT || topLevelType === TOP_CHANGE) {\n- return getInstIfValueChanged(targetInst);\n- }\n-}\n-\n-function handleControlledInputBlur(node) {\n- const state = node._wrapperState;\n-\n- if (!state || !state.controlled || node.type !== 'number') {\n- return;\n- }\n-\n- if (!disableInputAttributeSyncing) {\n- \/\/ If controlled, assign the value attribute to the current value on blur\n- setDefaultValue(node, 'number', node.value);\n- }\n-}\n-\n-\/**\n- * This plugin creates an `onChange` event that normalizes change events\n- * across form elements. This event fires at a time when it's possible to\n- * change the element's value without seeing a flicker.\n- *\n- * Supported elements are:\n- * - input (see `isTextInputElement`)\n- * - textarea\n- * - select\n- *\/\n-const ChangeEventPlugin = {\n- eventTypes: eventTypes,\n-\n- _isInputEventSupported: isInputEventSupported,\n-\n- extractEvents: function(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- ) {\n- const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;\n-\n- let getTargetInstFunc, handleEventFunc;\n- if (shouldUseChangeEvent(targetNode)) {\n- getTargetInstFunc = getTargetInstForChangeEvent;\n- } else if (isTextInputElement(targetNode)) {\n- if (isInputEventSupported) {\n- getTargetInstFunc = getTargetInstForInputOrChangeEvent;\n- } else {\n- getTargetInstFunc = getTargetInstForInputEventPolyfill;\n- handleEventFunc = handleEventsForInputEventPolyfill;\n- }\n- } else if (shouldUseClickEvent(targetNode)) {\n- getTargetInstFunc = getTargetInstForClickEvent;\n- }\n-\n- if (getTargetInstFunc) {\n- const inst = getTargetInstFunc(topLevelType, targetInst);\n- if (inst) {\n- const event = createAndAccumulateChangeEvent(\n- inst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n- return event;\n- }\n- }\n-\n- if (handleEventFunc) {\n- handleEventFunc(topLevelType, targetNode, targetInst);\n- }\n-\n- \/\/ When blurring, set the value attribute for number inputs\n- if (topLevelType === TOP_BLUR) {\n- handleControlledInputBlur(targetNode);\n- }\n- },\n-};\n-\n-export default ChangeEventPlugin;\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/LegacyEnterLeaveEventPlugin.js b\/packages\/react-dom\/src\/events\/plugins\/LegacyEnterLeaveEventPlugin.js\ndeleted file mode 100644\nindex 9b23efd888..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/LegacyEnterLeaveEventPlugin.js\n+++ \/dev\/null\n@@ -1,179 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\/\n-\n-import {\n- TOP_MOUSE_OUT,\n- TOP_MOUSE_OVER,\n- TOP_POINTER_OUT,\n- TOP_POINTER_OVER,\n-} from '..\/DOMTopLevelEventTypes';\n-import {\n- IS_REPLAYED,\n- IS_FIRST_ANCESTOR,\n-} from 'react-dom\/src\/events\/EventSystemFlags';\n-import SyntheticMouseEvent from '..\/SyntheticMouseEvent';\n-import SyntheticPointerEvent from '..\/SyntheticPointerEvent';\n-import {\n- getClosestInstanceFromNode,\n- getNodeFromInstance,\n-} from '..\/..\/client\/ReactDOMComponentTree';\n-import {HostComponent, HostText} from 'react-reconciler\/src\/ReactWorkTags';\n-import {getNearestMountedFiber} from 'react-reconciler\/src\/ReactFiberTreeReflection';\n-import {accumulateEnterLeaveDispatches} from '..\/DOMLegacyEventPluginSystem';\n-\n-const eventTypes = {\n- mouseEnter: {\n- registrationName: 'onMouseEnter',\n- dependencies: [TOP_MOUSE_OUT, TOP_MOUSE_OVER],\n- },\n- mouseLeave: {\n- registrationName: 'onMouseLeave',\n- dependencies: [TOP_MOUSE_OUT, TOP_MOUSE_OVER],\n- },\n- pointerEnter: {\n- registrationName: 'onPointerEnter',\n- dependencies: [TOP_POINTER_OUT, TOP_POINTER_OVER],\n- },\n- pointerLeave: {\n- registrationName: 'onPointerLeave',\n- dependencies: [TOP_POINTER_OUT, TOP_POINTER_OVER],\n- },\n-};\n-\n-const EnterLeaveEventPlugin = {\n- eventTypes: eventTypes,\n-\n- \/**\n- * For almost every interaction we care about, there will be both a top-level\n- * `mouseover` and `mouseout` event that occurs. Only use `mouseout` so that\n- * we do not extract duplicate events. However, moving the mouse into the\n- * browser from outside will not fire a `mouseout` event. In this case, we use\n- * the `mouseover` top-level event.\n- *\/\n- extractEvents: function(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- ) {\n- const isOverEvent =\n- topLevelType === TOP_MOUSE_OVER || topLevelType === TOP_POINTER_OVER;\n- const isOutEvent =\n- topLevelType === TOP_MOUSE_OUT || topLevelType === TOP_POINTER_OUT;\n-\n- if (\n- isOverEvent &&\n- (eventSystemFlags & IS_REPLAYED) === 0 &&\n- (nativeEvent.relatedTarget || nativeEvent.fromElement)\n- ) {\n- \/\/ If this is an over event with a target, then we've already dispatched\n- \/\/ the event in the out event of the other target. If this is replayed,\n- \/\/ then it's because we couldn't dispatch against this target previously\n- \/\/ so we have to do it now instead.\n- return null;\n- }\n-\n- if (!isOutEvent && !isOverEvent) {\n- \/\/ Must not be a mouse or pointer in or out - ignoring.\n- return null;\n- }\n-\n- let win;\n- if (nativeEventTarget.window === nativeEventTarget) {\n- \/\/ `nativeEventTarget` is probably a window object.\n- win = nativeEventTarget;\n- } else {\n- \/\/ TODO: Figure out why `ownerDocument` is sometimes undefined in IE8.\n- const doc = nativeEventTarget.ownerDocument;\n- if (doc) {\n- win = doc.defaultView || doc.parentWindow;\n- } else {\n- win = window;\n- }\n- }\n-\n- let from;\n- let to;\n- if (isOutEvent) {\n- from = targetInst;\n- const related = nativeEvent.relatedTarget || nativeEvent.toElement;\n- to = related ? getClosestInstanceFromNode(related) : null;\n- if (to !== null) {\n- const nearestMounted = getNearestMountedFiber(to);\n- if (\n- to !== nearestMounted ||\n- (to.tag !== HostComponent && to.tag !== HostText)\n- ) {\n- to = null;\n- }\n- }\n- } else {\n- \/\/ Moving to a node from outside the window.\n- from = null;\n- to = targetInst;\n- }\n-\n- if (from === to) {\n- \/\/ Nothing pertains to our managed components.\n- return null;\n- }\n-\n- let eventInterface, leaveEventType, enterEventType, eventTypePrefix;\n-\n- if (topLevelType === TOP_MOUSE_OUT || topLevelType === TOP_MOUSE_OVER) {\n- eventInterface = SyntheticMouseEvent;\n- leaveEventType = eventTypes.mouseLeave;\n- enterEventType = eventTypes.mouseEnter;\n- eventTypePrefix = 'mouse';\n- } else if (\n- topLevelType === TOP_POINTER_OUT ||\n- topLevelType === TOP_POINTER_OVER\n- ) {\n- eventInterface = SyntheticPointerEvent;\n- leaveEventType = eventTypes.pointerLeave;\n- enterEventType = eventTypes.pointerEnter;\n- eventTypePrefix = 'pointer';\n- }\n-\n- const fromNode = from == null ? win : getNodeFromInstance(from);\n- const toNode = to == null ? win : getNodeFromInstance(to);\n-\n- const leave = eventInterface.getPooled(\n- leaveEventType,\n- from,\n- nativeEvent,\n- nativeEventTarget,\n- );\n- leave.type = eventTypePrefix + 'leave';\n- leave.target = fromNode;\n- leave.relatedTarget = toNode;\n-\n- const enter = eventInterface.getPooled(\n- enterEventType,\n- to,\n- nativeEvent,\n- nativeEventTarget,\n- );\n- enter.type = eventTypePrefix + 'enter';\n- enter.target = toNode;\n- enter.relatedTarget = fromNode;\n-\n- accumulateEnterLeaveDispatches(leave, enter, from, to);\n-\n- \/\/ If we are not processing the first ancestor, then we\n- \/\/ should not process the same nativeEvent again, as we\n- \/\/ will have already processed it in the first ancestor.\n- if ((eventSystemFlags & IS_FIRST_ANCESTOR) === 0) {\n- return [leave];\n- }\n-\n- return [leave, enter];\n- },\n-};\n-\n-export default EnterLeaveEventPlugin;\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/LegacySelectEventPlugin.js b\/packages\/react-dom\/src\/events\/plugins\/LegacySelectEventPlugin.js\ndeleted file mode 100644\nindex 289994ed2b..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/LegacySelectEventPlugin.js\n+++ \/dev\/null\n@@ -1,248 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\/\n-\n-import {canUseDOM} from 'shared\/ExecutionEnvironment';\n-import SyntheticEvent from '..\/..\/legacy-events\/SyntheticEvent';\n-import isTextInputElement from '..\/isTextInputElement';\n-import shallowEqual from 'shared\/shallowEqual';\n-\n-import {\n- TOP_BLUR,\n- TOP_CONTEXT_MENU,\n- TOP_DRAG_END,\n- TOP_FOCUS,\n- TOP_KEY_DOWN,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- TOP_MOUSE_UP,\n- TOP_SELECTION_CHANGE,\n-} from '..\/DOMTopLevelEventTypes';\n-import getActiveElement from '..\/..\/client\/getActiveElement';\n-import {\n- getNodeFromInstance,\n- getEventListenerMap,\n-} from '..\/..\/client\/ReactDOMComponentTree';\n-import {hasSelectionCapabilities} from '..\/..\/client\/ReactInputSelection';\n-import {DOCUMENT_NODE} from '..\/..\/shared\/HTMLNodeType';\n-import {accumulateTwoPhaseDispatches} from '..\/DOMLegacyEventPluginSystem';\n-\n-import {registrationNameDependencies} from '..\/..\/legacy-events\/EventPluginRegistry';\n-\n-const skipSelectionChangeEvent =\n- canUseDOM && 'documentMode' in document && document.documentMode <= 11;\n-\n-const eventTypes = {\n- select: {\n- phasedRegistrationNames: {\n- bubbled: 'onSelect',\n- captured: 'onSelectCapture',\n- },\n- dependencies: [\n- TOP_BLUR,\n- TOP_CONTEXT_MENU,\n- TOP_DRAG_END,\n- TOP_FOCUS,\n- TOP_KEY_DOWN,\n- TOP_KEY_UP,\n- TOP_MOUSE_DOWN,\n- TOP_MOUSE_UP,\n- TOP_SELECTION_CHANGE,\n- ],\n- },\n-};\n-\n-let activeElement = null;\n-let activeElementInst = null;\n-let lastSelection = null;\n-let mouseDown = false;\n-\n-\/**\n- * Get an object which is a unique representation of the current selection.\n- *\n- * The return value will not be consistent across nodes or browsers, but\n- * two identical selections on the same node will return identical objects.\n- *\n- * @param {DOMElement} node\n- * @return {object}\n- *\/\n-function getSelection(node) {\n- if ('selectionStart' in node && hasSelectionCapabilities(node)) {\n- return {\n- start: node.selectionStart,\n- end: node.selectionEnd,\n- };\n- } else {\n- const win =\n- (node.ownerDocument && node.ownerDocument.defaultView) || window;\n- const selection = win.getSelection();\n- return {\n- anchorNode: selection.anchorNode,\n- anchorOffset: selection.anchorOffset,\n- focusNode: selection.focusNode,\n- focusOffset: selection.focusOffset,\n- };\n- }\n-}\n-\n-\/**\n- * Get document associated with the event target.\n- *\n- * @param {object} nativeEventTarget\n- * @return {Document}\n- *\/\n-function getEventTargetDocument(eventTarget) {\n- return eventTarget.window === eventTarget\n- ? eventTarget.document\n- : eventTarget.nodeType === DOCUMENT_NODE\n- ? eventTarget\n- : eventTarget.ownerDocument;\n-}\n-\n-\/**\n- * Poll selection to see whether it's changed.\n- *\n- * @param {object} nativeEvent\n- * @param {object} nativeEventTarget\n- * @return {?SyntheticEvent}\n- *\/\n-function constructSelectEvent(nativeEvent, nativeEventTarget) {\n- \/\/ Ensure we have the right element, and that the user is not dragging a\n- \/\/ selection (this matches native `select` event behavior). In HTML5, select\n- \/\/ fires only on input and textarea thus if there's no focused element we\n- \/\/ won't dispatch.\n- const doc = getEventTargetDocument(nativeEventTarget);\n-\n- if (\n- mouseDown ||\n- activeElement == null ||\n- activeElement !== getActiveElement(doc)\n- ) {\n- return null;\n- }\n-\n- \/\/ Only fire when selection has actually changed.\n- const currentSelection = getSelection(activeElement);\n- if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) {\n- lastSelection = currentSelection;\n-\n- const syntheticEvent = SyntheticEvent.getPooled(\n- eventTypes.select,\n- activeElementInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n-\n- syntheticEvent.type = 'select';\n- syntheticEvent.target = activeElement;\n-\n- accumulateTwoPhaseDispatches(syntheticEvent);\n-\n- return syntheticEvent;\n- }\n-\n- return null;\n-}\n-\n-function isListeningToAllDependencies(\n- registrationName: string,\n- mountAt: Document | Element,\n-): boolean {\n- const dependencies = registrationNameDependencies[registrationName];\n- const listenerMap = getEventListenerMap(mountAt);\n- for (let i = 0; i < dependencies.length; i++) {\n- const event = dependencies[i];\n- if (!listenerMap.has(event)) {\n- return false;\n- }\n- }\n- return true;\n-}\n-\n-\/**\n- * This plugin creates an `onSelect` event that normalizes select events\n- * across form elements.\n- *\n- * Supported elements are:\n- * - input (see `isTextInputElement`)\n- * - textarea\n- * - contentEditable\n- *\n- * This differs from native browser implementations in the following ways:\n- * - Fires on contentEditable fields as well as inputs.\n- * - Fires for collapsed selection.\n- * - Fires after user input.\n- *\/\n-const SelectEventPlugin = {\n- eventTypes: eventTypes,\n-\n- extractEvents: function(\n- topLevelType,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- eventSystemFlags,\n- ) {\n- const doc = getEventTargetDocument(nativeEventTarget);\n- \/\/ Track whether all listeners exists for this plugin. If none exist, we do\n- \/\/ not extract events. See #3639.\n- if (!doc || !isListeningToAllDependencies('onSelect', doc)) {\n- return null;\n- }\n-\n- const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;\n-\n- switch (topLevelType) {\n- \/\/ Track the input node that has focus.\n- case TOP_FOCUS:\n- if (\n- isTextInputElement(targetNode) ||\n- targetNode.contentEditable === 'true'\n- ) {\n- activeElement = targetNode;\n- activeElementInst = targetInst;\n- lastSelection = null;\n- }\n- break;\n- case TOP_BLUR:\n- activeElement = null;\n- activeElementInst = null;\n- lastSelection = null;\n- break;\n- \/\/ Don't fire the event while the user is dragging. This matches the\n- \/\/ semantics of the native select event.\n- case TOP_MOUSE_DOWN:\n- mouseDown = true;\n- break;\n- case TOP_CONTEXT_MENU:\n- case TOP_MOUSE_UP:\n- case TOP_DRAG_END:\n- mouseDown = false;\n- return constructSelectEvent(nativeEvent, nativeEventTarget);\n- \/\/ Chrome and IE fire non-standard event when selection is changed (and\n- \/\/ sometimes when it hasn't). IE's event fires out of order with respect\n- \/\/ to key and input events on deletion, so we discard it.\n- \/\/\n- \/\/ Firefox doesn't support selectionchange, so check selection status\n- \/\/ after each key entry. The selection changes after keydown and before\n- \/\/ keyup, but we check on keydown as well in the case of holding down a\n- \/\/ key, when multiple keydown events are fired but only one keyup is.\n- \/\/ This is also our approach for IE handling, for the reason above.\n- case TOP_SELECTION_CHANGE:\n- if (skipSelectionChangeEvent) {\n- break;\n- }\n- \/\/ falls through\n- case TOP_KEY_DOWN:\n- case TOP_KEY_UP:\n- return constructSelectEvent(nativeEvent, nativeEventTarget);\n- }\n-\n- return null;\n- },\n-};\n-\n-export default SelectEventPlugin;\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/LegacySimpleEventPlugin.js b\/packages\/react-dom\/src\/events\/plugins\/LegacySimpleEventPlugin.js\ndeleted file mode 100644\nindex b4e1aa8963..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/LegacySimpleEventPlugin.js\n+++ \/dev\/null\n@@ -1,197 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @flow\n- *\/\n-\n-import type {\n- TopLevelType,\n- DOMTopLevelEventType,\n-} from '..\/..\/legacy-events\/TopLevelEventTypes';\n-import type {ReactSyntheticEvent} from '..\/..\/legacy-events\/ReactSyntheticEventType';\n-import type {Fiber} from 'react-reconciler\/src\/ReactInternalTypes';\n-import type {LegacyPluginModule} from '..\/..\/legacy-events\/PluginModuleType';\n-\n-import SyntheticEvent from '..\/..\/legacy-events\/SyntheticEvent';\n-\n-import * as DOMTopLevelEventTypes from '..\/DOMTopLevelEventTypes';\n-import {\n- topLevelEventsToDispatchConfig,\n- simpleEventPluginEventTypes,\n-} from '..\/DOMEventProperties';\n-\n-import SyntheticAnimationEvent from '..\/SyntheticAnimationEvent';\n-import SyntheticClipboardEvent from '..\/SyntheticClipboardEvent';\n-import SyntheticFocusEvent from '..\/SyntheticFocusEvent';\n-import SyntheticKeyboardEvent from '..\/SyntheticKeyboardEvent';\n-import SyntheticMouseEvent from '..\/SyntheticMouseEvent';\n-import SyntheticPointerEvent from '..\/SyntheticPointerEvent';\n-import SyntheticDragEvent from '..\/SyntheticDragEvent';\n-import SyntheticTouchEvent from '..\/SyntheticTouchEvent';\n-import SyntheticTransitionEvent from '..\/SyntheticTransitionEvent';\n-import SyntheticUIEvent from '..\/SyntheticUIEvent';\n-import SyntheticWheelEvent from '..\/SyntheticWheelEvent';\n-import getEventCharCode from '..\/getEventCharCode';\n-import {accumulateTwoPhaseDispatches} from '..\/DOMLegacyEventPluginSystem';\n-\n-\/\/ Only used in DEV for exhaustiveness validation.\n-const knownHTMLTopLevelTypes: Array = [\n- DOMTopLevelEventTypes.TOP_ABORT,\n- DOMTopLevelEventTypes.TOP_CANCEL,\n- DOMTopLevelEventTypes.TOP_CAN_PLAY,\n- DOMTopLevelEventTypes.TOP_CAN_PLAY_THROUGH,\n- DOMTopLevelEventTypes.TOP_CLOSE,\n- DOMTopLevelEventTypes.TOP_DURATION_CHANGE,\n- DOMTopLevelEventTypes.TOP_EMPTIED,\n- DOMTopLevelEventTypes.TOP_ENCRYPTED,\n- DOMTopLevelEventTypes.TOP_ENDED,\n- DOMTopLevelEventTypes.TOP_ERROR,\n- DOMTopLevelEventTypes.TOP_INPUT,\n- DOMTopLevelEventTypes.TOP_INVALID,\n- DOMTopLevelEventTypes.TOP_LOAD,\n- DOMTopLevelEventTypes.TOP_LOADED_DATA,\n- DOMTopLevelEventTypes.TOP_LOADED_METADATA,\n- DOMTopLevelEventTypes.TOP_LOAD_START,\n- DOMTopLevelEventTypes.TOP_PAUSE,\n- DOMTopLevelEventTypes.TOP_PLAY,\n- DOMTopLevelEventTypes.TOP_PLAYING,\n- DOMTopLevelEventTypes.TOP_PROGRESS,\n- DOMTopLevelEventTypes.TOP_RATE_CHANGE,\n- DOMTopLevelEventTypes.TOP_RESET,\n- DOMTopLevelEventTypes.TOP_SEEKED,\n- DOMTopLevelEventTypes.TOP_SEEKING,\n- DOMTopLevelEventTypes.TOP_STALLED,\n- DOMTopLevelEventTypes.TOP_SUBMIT,\n- DOMTopLevelEventTypes.TOP_SUSPEND,\n- DOMTopLevelEventTypes.TOP_TIME_UPDATE,\n- DOMTopLevelEventTypes.TOP_TOGGLE,\n- DOMTopLevelEventTypes.TOP_VOLUME_CHANGE,\n- DOMTopLevelEventTypes.TOP_WAITING,\n-];\n-\n-const SimpleEventPlugin: LegacyPluginModule = {\n- \/\/ simpleEventPluginEventTypes gets populated from\n- \/\/ the DOMEventProperties module.\n- eventTypes: simpleEventPluginEventTypes,\n- extractEvents: function(\n- topLevelType: TopLevelType,\n- targetInst: null | Fiber,\n- nativeEvent: MouseEvent,\n- nativeEventTarget: null | EventTarget,\n- ): null | ReactSyntheticEvent {\n- const dispatchConfig = topLevelEventsToDispatchConfig.get(topLevelType);\n- if (!dispatchConfig) {\n- return null;\n- }\n- let EventConstructor;\n- switch (topLevelType) {\n- case DOMTopLevelEventTypes.TOP_KEY_PRESS:\n- \/\/ Firefox creates a keypress event for function keys too. This removes\n- \/\/ the unwanted keypress events. Enter is however both printable and\n- \/\/ non-printable. One would expect Tab to be as well (but it isn't).\n- if (getEventCharCode(nativeEvent) === 0) {\n- return null;\n- }\n- \/* falls through *\/\n- case DOMTopLevelEventTypes.TOP_KEY_DOWN:\n- case DOMTopLevelEventTypes.TOP_KEY_UP:\n- EventConstructor = SyntheticKeyboardEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_BLUR:\n- case DOMTopLevelEventTypes.TOP_FOCUS:\n- EventConstructor = SyntheticFocusEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_CLICK:\n- \/\/ Firefox creates a click event on right mouse clicks. This removes the\n- \/\/ unwanted click events.\n- if (nativeEvent.button === 2) {\n- return null;\n- }\n- \/* falls through *\/\n- case DOMTopLevelEventTypes.TOP_AUX_CLICK:\n- case DOMTopLevelEventTypes.TOP_DOUBLE_CLICK:\n- case DOMTopLevelEventTypes.TOP_MOUSE_DOWN:\n- case DOMTopLevelEventTypes.TOP_MOUSE_MOVE:\n- case DOMTopLevelEventTypes.TOP_MOUSE_UP:\n- \/\/ TODO: Disabled elements should not respond to mouse events\n- \/* falls through *\/\n- case DOMTopLevelEventTypes.TOP_MOUSE_OUT:\n- case DOMTopLevelEventTypes.TOP_MOUSE_OVER:\n- case DOMTopLevelEventTypes.TOP_CONTEXT_MENU:\n- EventConstructor = SyntheticMouseEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_DRAG:\n- case DOMTopLevelEventTypes.TOP_DRAG_END:\n- case DOMTopLevelEventTypes.TOP_DRAG_ENTER:\n- case DOMTopLevelEventTypes.TOP_DRAG_EXIT:\n- case DOMTopLevelEventTypes.TOP_DRAG_LEAVE:\n- case DOMTopLevelEventTypes.TOP_DRAG_OVER:\n- case DOMTopLevelEventTypes.TOP_DRAG_START:\n- case DOMTopLevelEventTypes.TOP_DROP:\n- EventConstructor = SyntheticDragEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_TOUCH_CANCEL:\n- case DOMTopLevelEventTypes.TOP_TOUCH_END:\n- case DOMTopLevelEventTypes.TOP_TOUCH_MOVE:\n- case DOMTopLevelEventTypes.TOP_TOUCH_START:\n- EventConstructor = SyntheticTouchEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_ANIMATION_END:\n- case DOMTopLevelEventTypes.TOP_ANIMATION_ITERATION:\n- case DOMTopLevelEventTypes.TOP_ANIMATION_START:\n- EventConstructor = SyntheticAnimationEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_TRANSITION_END:\n- EventConstructor = SyntheticTransitionEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_SCROLL:\n- EventConstructor = SyntheticUIEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_WHEEL:\n- EventConstructor = SyntheticWheelEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_COPY:\n- case DOMTopLevelEventTypes.TOP_CUT:\n- case DOMTopLevelEventTypes.TOP_PASTE:\n- EventConstructor = SyntheticClipboardEvent;\n- break;\n- case DOMTopLevelEventTypes.TOP_GOT_POINTER_CAPTURE:\n- case DOMTopLevelEventTypes.TOP_LOST_POINTER_CAPTURE:\n- case DOMTopLevelEventTypes.TOP_POINTER_CANCEL:\n- case DOMTopLevelEventTypes.TOP_POINTER_DOWN:\n- case DOMTopLevelEventTypes.TOP_POINTER_MOVE:\n- case DOMTopLevelEventTypes.TOP_POINTER_OUT:\n- case DOMTopLevelEventTypes.TOP_POINTER_OVER:\n- case DOMTopLevelEventTypes.TOP_POINTER_UP:\n- EventConstructor = SyntheticPointerEvent;\n- break;\n- default:\n- if (__DEV__) {\n- if (knownHTMLTopLevelTypes.indexOf(topLevelType) === -1) {\n- console.error(\n- 'SimpleEventPlugin: Unhandled event type, `%s`. This warning ' +\n- 'is likely caused by a bug in React. Please file an issue.',\n- topLevelType,\n- );\n- }\n- }\n- \/\/ HTML Events\n- \/\/ @see http:\/\/www.w3.org\/TR\/html5\/index.html#events-0\n- EventConstructor = SyntheticEvent;\n- break;\n- }\n- const event = EventConstructor.getPooled(\n- dispatchConfig,\n- targetInst,\n- nativeEvent,\n- nativeEventTarget,\n- );\n- accumulateTwoPhaseDispatches(event);\n- return event;\n- },\n-};\n-\n-export default SimpleEventPlugin;\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyChangeEventPlugin-test.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyChangeEventPlugin-test.js\ndeleted file mode 100644\nindex 5c81747996..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyChangeEventPlugin-test.js\n+++ \/dev\/null\n@@ -1,763 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @emails react-core\n- *\/\n-\n-'use strict';\n-\n-let React = require('react');\n-let ReactDOM = require('react-dom');\n-let TestUtils = require('react-dom\/test-utils');\n-let ReactFeatureFlags;\n-let Scheduler;\n-\n-const setUntrackedChecked = Object.getOwnPropertyDescriptor(\n- HTMLInputElement.prototype,\n- 'checked',\n-).set;\n-\n-const setUntrackedValue = Object.getOwnPropertyDescriptor(\n- HTMLInputElement.prototype,\n- 'value',\n-).set;\n-\n-const setUntrackedTextareaValue = Object.getOwnPropertyDescriptor(\n- HTMLTextAreaElement.prototype,\n- 'value',\n-).set;\n-\n-describe('ChangeEventPlugin', () => {\n- let container;\n-\n- beforeEach(() => {\n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- \/\/ TODO pull this into helper method, reduce repetition.\n- \/\/ mock the browser APIs which are used in schedule:\n- \/\/ - calling 'window.postMessage' should actually fire postmessage handlers\n- const originalAddEventListener = global.addEventListener;\n- let postMessageCallback;\n- global.addEventListener = function(eventName, callback, useCapture) {\n- if (eventName === 'message') {\n- postMessageCallback = callback;\n- } else {\n- originalAddEventListener(eventName, callback, useCapture);\n- }\n- };\n- global.postMessage = function(messageKey, targetOrigin) {\n- const postMessageEvent = {source: window, data: messageKey};\n- if (postMessageCallback) {\n- postMessageCallback(postMessageEvent);\n- }\n- };\n- jest.resetModules();\n- container = document.createElement('div');\n- document.body.appendChild(container);\n- });\n-\n- afterEach(() => {\n- document.body.removeChild(container);\n- container = null;\n- });\n-\n- \/\/ We try to avoid firing \"duplicate\" React change events.\n- \/\/ However, to tell which events are \"duplicates\" and should be ignored,\n- \/\/ we are tracking the \"current\" input value, and only respect events\n- \/\/ that occur after it changes. In most of these tests, we verify that we\n- \/\/ keep track of the \"current\" value and only fire events when it changes.\n- \/\/ See https:\/\/github.com\/facebook\/react\/pull\/5746.\n-\n- it('should consider initial text value to be current', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n- node.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- node.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));\n-\n- if (ReactFeatureFlags.disableInputAttributeSyncing) {\n- \/\/ TODO: figure out why. This might be a bug.\n- expect(called).toBe(1);\n- } else {\n- \/\/ There should be no React change events because the value stayed the same.\n- expect(called).toBe(0);\n- }\n- });\n-\n- it('should consider initial checkbox checked=true to be current', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ Secretly, set `checked` to false, so that dispatching the `click` will\n- \/\/ make it `true` again. Thus, at the time of the event, React should not\n- \/\/ consider it a change from the initial `true` value.\n- setUntrackedChecked.call(node, false);\n- node.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ There should be no React change events because the value stayed the same.\n- expect(called).toBe(0);\n- });\n-\n- it('should consider initial checkbox checked=false to be current', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ Secretly, set `checked` to true, so that dispatching the `click` will\n- \/\/ make it `false` again. Thus, at the time of the event, React should not\n- \/\/ consider it a change from the initial `false` value.\n- setUntrackedChecked.call(node, true);\n- node.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ There should be no React change events because the value stayed the same.\n- expect(called).toBe(0);\n- });\n-\n- it('should fire change for checkbox input', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- expect(node.checked).toBe(false);\n- node.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Note: unlike with text input events, dispatching `click` actually\n- \/\/ toggles the checkbox and updates its `checked` value.\n- expect(node.checked).toBe(true);\n- expect(called).toBe(1);\n-\n- expect(node.checked).toBe(true);\n- node.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- expect(node.checked).toBe(false);\n- expect(called).toBe(2);\n- });\n-\n- it('should not fire change setting the value programmatically', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ Set it programmatically.\n- input.value = 'bar';\n- \/\/ Even if a DOM input event fires, React sees that the real input value now\n- \/\/ ('bar') is the same as the \"current\" one we already recorded.\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- expect(input.value).toBe('bar');\n- \/\/ In this case we don't expect to get a React event.\n- expect(called).toBe(0);\n-\n- \/\/ However, we can simulate user typing by calling the underlying setter.\n- setUntrackedValue.call(input, 'foo');\n- \/\/ Now, when the event fires, the real input value ('foo') differs from the\n- \/\/ \"current\" one we previously recorded ('bar').\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- expect(input.value).toBe('foo');\n- \/\/ In this case React should fire an event for it.\n- expect(called).toBe(1);\n-\n- \/\/ Verify again that extra events without real changes are ignored.\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- expect(called).toBe(1);\n- });\n-\n- it('should not distinguish equal string and number values', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ When we set `value` as a property, React updates the \"current\" value\n- \/\/ that it tracks internally. The \"current\" value is later used to determine\n- \/\/ whether a change event is a duplicate or not.\n- \/\/ Even though we set value to a number, we still shouldn't get a change\n- \/\/ event because as a string, it's equal to the initial value ('42').\n- input.value = 42;\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- expect(input.value).toBe('42');\n- expect(called).toBe(0);\n- });\n-\n- \/\/ See a similar input test above for a detailed description of why.\n- it('should not fire change when setting checked programmatically', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ Set the value, updating the \"current\" value that React tracks to true.\n- input.checked = true;\n- \/\/ Under the hood, uncheck the box so that the click will \"check\" it again.\n- setUntrackedChecked.call(input, false);\n- input.click();\n- expect(input.checked).toBe(true);\n- \/\/ We don't expect a React event because at the time of the click, the real\n- \/\/ checked value (true) was the same as the last recorded \"current\" value\n- \/\/ (also true).\n- expect(called).toBe(0);\n-\n- \/\/ However, simulating a normal click should fire a React event because the\n- \/\/ real value (false) would have changed from the last tracked value (true).\n- input.click();\n- expect(called).toBe(1);\n- });\n-\n- it('should unmount', () => {\n- const input = ReactDOM.render(, container);\n-\n- ReactDOM.unmountComponentAtNode(container);\n- });\n-\n- it('should only fire change for checked radio button once', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- setUntrackedChecked.call(input, true);\n- input.dispatchEvent(new Event('click', {bubbles: true, cancelable: true}));\n- input.dispatchEvent(new Event('click', {bubbles: true, cancelable: true}));\n- expect(called).toBe(1);\n- });\n-\n- it('should track radio button cousins in a group', () => {\n- let called1 = 0;\n- let called2 = 0;\n-\n- function cb1(e) {\n- called1++;\n- expect(e.type).toBe('change');\n- }\n-\n- function cb2(e) {\n- called2++;\n- expect(e.type).toBe('change');\n- }\n-\n- const div = ReactDOM.render(\n-

\n- \n- \n- <\/div>,\n- container,\n- );\n- const option1 = div.childNodes[0];\n- const option2 = div.childNodes[1];\n-\n- \/\/ Select first option.\n- option1.click();\n- expect(called1).toBe(1);\n- expect(called2).toBe(0);\n-\n- \/\/ Select second option.\n- option2.click();\n- expect(called1).toBe(1);\n- expect(called2).toBe(1);\n-\n- \/\/ Select the first option.\n- \/\/ It should receive the React change event again.\n- option1.click();\n- expect(called1).toBe(2);\n- expect(called2).toBe(1);\n- });\n-\n- it('should deduplicate input value change events', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- let input;\n- ['text', 'number', 'range'].forEach(type => {\n- called = 0;\n- input = ReactDOM.render(, container);\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- setUntrackedValue.call(input, '42');\n- input.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- expect(called).toBe(1);\n- ReactDOM.unmountComponentAtNode(container);\n-\n- called = 0;\n- input = ReactDOM.render(, container);\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- setUntrackedValue.call(input, '42');\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- expect(called).toBe(1);\n- ReactDOM.unmountComponentAtNode(container);\n-\n- called = 0;\n- input = ReactDOM.render(, container);\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- setUntrackedValue.call(input, '42');\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Should be ignored (no change):\n- input.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- expect(called).toBe(1);\n- ReactDOM.unmountComponentAtNode(container);\n- });\n- });\n-\n- it('should listen for both change and input events when supported', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- setUntrackedValue.call(input, 10);\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n-\n- setUntrackedValue.call(input, 20);\n- input.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));\n-\n- expect(called).toBe(2);\n- });\n-\n- it('should only fire events when the value changes for range inputs', () => {\n- let called = 0;\n-\n- function cb(e) {\n- called++;\n- expect(e.type).toBe('change');\n- }\n-\n- const input = ReactDOM.render(\n- ,\n- container,\n- );\n- setUntrackedValue.call(input, '40');\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- input.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));\n-\n- setUntrackedValue.call(input, 'foo');\n- input.dispatchEvent(new Event('input', {bubbles: true, cancelable: true}));\n- input.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));\n-\n- expect(called).toBe(2);\n- });\n-\n- it('does not crash for nodes with custom value property', () => {\n- let originalCreateElement;\n- \/\/ https:\/\/github.com\/facebook\/react\/issues\/10196\n- try {\n- originalCreateElement = document.createElement;\n- document.createElement = function() {\n- const node = originalCreateElement.apply(this, arguments);\n- Object.defineProperty(node, 'value', {\n- get() {},\n- set() {},\n- });\n- return node;\n- };\n- const div = document.createElement('div');\n- \/\/ Mount\n- const node = ReactDOM.render(, div);\n- \/\/ Update\n- ReactDOM.render(, div);\n- \/\/ Change\n- node.dispatchEvent(\n- new Event('change', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Unmount\n- ReactDOM.unmountComponentAtNode(div);\n- } finally {\n- document.createElement = originalCreateElement;\n- }\n- });\n-\n- describe('concurrent mode', () => {\n- beforeEach(() => {\n- jest.resetModules();\n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n-\n- React = require('react');\n- ReactDOM = require('react-dom');\n- TestUtils = require('react-dom\/test-utils');\n- Scheduler = require('scheduler');\n- });\n-\n- \/\/ @gate experimental\n- it('text input', () => {\n- const root = ReactDOM.unstable_createRoot(container);\n- let input;\n-\n- class ControlledInput extends React.Component {\n- state = {value: 'initial'};\n- onChange = event => this.setState({value: event.target.value});\n- render() {\n- Scheduler.unstable_yieldValue(`render: ${this.state.value}`);\n- const controlledValue =\n- this.state.value === 'changed' ? 'changed [!]' : this.state.value;\n- return (\n- (input = el)}\n- type=\"text\"\n- value={controlledValue}\n- onChange={this.onChange}\n- \/>\n- );\n- }\n- }\n-\n- \/\/ Initial mount. Test that this is async.\n- root.render();\n- \/\/ Should not have flushed yet.\n- expect(Scheduler).toHaveYielded([]);\n- expect(input).toBe(undefined);\n- \/\/ Flush callbacks.\n- expect(Scheduler).toFlushAndYield(['render: initial']);\n- expect(input.value).toBe('initial');\n-\n- \/\/ Trigger a change event.\n- setUntrackedValue.call(input, 'changed');\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Change should synchronously flush\n- expect(Scheduler).toHaveYielded(['render: changed']);\n- \/\/ Value should be the controlled value, not the original one\n- expect(input.value).toBe('changed [!]');\n- });\n-\n- \/\/ @gate experimental\n- it('checkbox input', () => {\n- const root = ReactDOM.unstable_createRoot(container);\n- let input;\n-\n- class ControlledInput extends React.Component {\n- state = {checked: false};\n- onChange = event => {\n- this.setState({checked: event.target.checked});\n- };\n- render() {\n- Scheduler.unstable_yieldValue(`render: ${this.state.checked}`);\n- const controlledValue = this.props.reverse\n- ? !this.state.checked\n- : this.state.checked;\n- return (\n- (input = el)}\n- type=\"checkbox\"\n- checked={controlledValue}\n- onChange={this.onChange}\n- \/>\n- );\n- }\n- }\n-\n- \/\/ Initial mount. Test that this is async.\n- root.render();\n- \/\/ Should not have flushed yet.\n- expect(Scheduler).toHaveYielded([]);\n- expect(input).toBe(undefined);\n- \/\/ Flush callbacks.\n- expect(Scheduler).toFlushAndYield(['render: false']);\n- expect(input.checked).toBe(false);\n-\n- \/\/ Trigger a change event.\n- input.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Change should synchronously flush\n- expect(Scheduler).toHaveYielded(['render: true']);\n- expect(input.checked).toBe(true);\n-\n- \/\/ Now let's make sure we're using the controlled value.\n- root.render();\n- expect(Scheduler).toFlushAndYield(['render: true']);\n-\n- \/\/ Trigger another change event.\n- input.dispatchEvent(\n- new MouseEvent('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Change should synchronously flush\n- expect(Scheduler).toHaveYielded(['render: true']);\n- expect(input.checked).toBe(false);\n- });\n-\n- \/\/ @gate experimental\n- it('textarea', () => {\n- const root = ReactDOM.unstable_createRoot(container);\n- let textarea;\n-\n- class ControlledTextarea extends React.Component {\n- state = {value: 'initial'};\n- onChange = event => this.setState({value: event.target.value});\n- render() {\n- Scheduler.unstable_yieldValue(`render: ${this.state.value}`);\n- const controlledValue =\n- this.state.value === 'changed' ? 'changed [!]' : this.state.value;\n- return (\n- (textarea = el)}\n- type=\"text\"\n- value={controlledValue}\n- onChange={this.onChange}\n- \/>\n- );\n- }\n- }\n-\n- \/\/ Initial mount. Test that this is async.\n- root.render();\n- \/\/ Should not have flushed yet.\n- expect(Scheduler).toHaveYielded([]);\n- expect(textarea).toBe(undefined);\n- \/\/ Flush callbacks.\n- expect(Scheduler).toFlushAndYield(['render: initial']);\n- expect(textarea.value).toBe('initial');\n-\n- \/\/ Trigger a change event.\n- setUntrackedTextareaValue.call(textarea, 'changed');\n- textarea.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Change should synchronously flush\n- expect(Scheduler).toHaveYielded(['render: changed']);\n- \/\/ Value should be the controlled value, not the original one\n- expect(textarea.value).toBe('changed [!]');\n- });\n-\n- \/\/ @gate experimental\n- it('parent of input', () => {\n- const root = ReactDOM.unstable_createRoot(container);\n- let input;\n-\n- class ControlledInput extends React.Component {\n- state = {value: 'initial'};\n- onChange = event => this.setState({value: event.target.value});\n- render() {\n- Scheduler.unstable_yieldValue(`render: ${this.state.value}`);\n- const controlledValue =\n- this.state.value === 'changed' ? 'changed [!]' : this.state.value;\n- return (\n-

\n- (input = el)}\n- type=\"text\"\n- value={controlledValue}\n- onChange={() => {\n- \/\/ Does nothing. Parent handler is responsible for updating.\n- }}\n- \/>\n- <\/div>\n- );\n- }\n- }\n-\n- \/\/ Initial mount. Test that this is async.\n- root.render();\n- \/\/ Should not have flushed yet.\n- expect(Scheduler).toHaveYielded([]);\n- expect(input).toBe(undefined);\n- \/\/ Flush callbacks.\n- expect(Scheduler).toFlushAndYield(['render: initial']);\n- expect(input.value).toBe('initial');\n-\n- \/\/ Trigger a change event.\n- setUntrackedValue.call(input, 'changed');\n- input.dispatchEvent(\n- new Event('input', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Change should synchronously flush\n- expect(Scheduler).toHaveYielded(['render: changed']);\n- \/\/ Value should be the controlled value, not the original one\n- expect(input.value).toBe('changed [!]');\n- });\n-\n- \/\/ @gate experimental\n- it('is async for non-input events', () => {\n- const root = ReactDOM.unstable_createRoot(container);\n- let input;\n-\n- class ControlledInput extends React.Component {\n- state = {value: 'initial'};\n- onChange = event => this.setState({value: event.target.value});\n- reset = () => {\n- this.setState({value: ''});\n- };\n- render() {\n- Scheduler.unstable_yieldValue(`render: ${this.state.value}`);\n- const controlledValue =\n- this.state.value === 'changed' ? 'changed [!]' : this.state.value;\n- return (\n- (input = el)}\n- type=\"text\"\n- value={controlledValue}\n- onChange={this.onChange}\n- onClick={this.reset}\n- \/>\n- );\n- }\n- }\n-\n- \/\/ Initial mount. Test that this is async.\n- root.render();\n- \/\/ Should not have flushed yet.\n- expect(Scheduler).toHaveYielded([]);\n- expect(input).toBe(undefined);\n- \/\/ Flush callbacks.\n- expect(Scheduler).toFlushAndYield(['render: initial']);\n- expect(input.value).toBe('initial');\n-\n- \/\/ Trigger a click event\n- input.dispatchEvent(\n- new Event('click', {bubbles: true, cancelable: true}),\n- );\n- \/\/ Nothing should have changed\n- expect(Scheduler).toHaveYielded([]);\n- expect(input.value).toBe('initial');\n-\n- \/\/ Flush callbacks.\n- \/\/ Now the click update has flushed.\n- expect(Scheduler).toFlushAndYield(['render: ']);\n- expect(input.value).toBe('');\n- });\n-\n- \/\/ @gate experimental\n- it('mouse enter\/leave should be user-blocking but not discrete', async () => {\n- \/\/ This is currently behind a feature flag\n- jest.resetModules();\n- React = require('react');\n- ReactDOM = require('react-dom');\n- TestUtils = require('react-dom\/test-utils');\n- Scheduler = require('scheduler');\n-\n- const {act} = TestUtils;\n- const {useState} = React;\n-\n- const root = ReactDOM.unstable_createRoot(container);\n-\n- const target = React.createRef(null);\n- function Foo() {\n- const [isHover, setHover] = useState(false);\n- return (\n- setHover(true)}\n- onMouseLeave={() => setHover(false)}>\n- {isHover ? 'hovered' : 'not hovered'}\n- <\/div>\n- );\n- }\n-\n- await act(async () => {\n- root.render();\n- });\n- expect(container.textContent).toEqual('not hovered');\n-\n- await act(async () => {\n- const mouseOverEvent = document.createEvent('MouseEvents');\n- mouseOverEvent.initEvent('mouseover', true, true);\n- target.current.dispatchEvent(mouseOverEvent);\n-\n- \/\/ 3s should be enough to expire the updates\n- Scheduler.unstable_advanceTime(3000);\n- expect(Scheduler).toFlushExpired([]);\n- expect(container.textContent).toEqual('hovered');\n- });\n- });\n- });\n-});\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyEnterLeaveEventPlugin-test.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyEnterLeaveEventPlugin-test.js\ndeleted file mode 100644\nindex b7dcab6142..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyEnterLeaveEventPlugin-test.js\n+++ \/dev\/null\n@@ -1,239 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @emails react-core\n- *\/\n-\n-'use strict';\n-\n-let React;\n-let ReactDOM;\n-\n-describe('EnterLeaveEventPlugin', () => {\n- let container;\n-\n- beforeEach(() => {\n- jest.resetModules();\n-\n- React = require('react');\n- ReactDOM = require('react-dom');\n-\n- \/\/ The container has to be attached for events to fire.\n- container = document.createElement('div');\n- document.body.appendChild(container);\n- });\n-\n- afterEach(() => {\n- document.body.removeChild(container);\n- container = null;\n- });\n-\n- it('should set onMouseLeave relatedTarget properly in iframe', () => {\n- const iframe = document.createElement('iframe');\n- container.appendChild(iframe);\n- const iframeDocument = iframe.contentDocument;\n- iframeDocument.write(\n- '<\/head>

<\/div><\/body><\/html>',\n- );\n- iframeDocument.close();\n-\n- const leaveEvents = [];\n- const node = ReactDOM.render(\n- {\n- e.persist();\n- leaveEvents.push(e);\n- }}\n- \/>,\n- iframeDocument.body.getElementsByTagName('div')[0],\n- );\n-\n- node.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: iframe.contentWindow,\n- }),\n- );\n-\n- expect(leaveEvents.length).toBe(1);\n- expect(leaveEvents[0].target).toBe(node);\n- expect(leaveEvents[0].relatedTarget).toBe(iframe.contentWindow);\n- });\n-\n- it('should set onMouseEnter relatedTarget properly in iframe', () => {\n- const iframe = document.createElement('iframe');\n- container.appendChild(iframe);\n- const iframeDocument = iframe.contentDocument;\n- iframeDocument.write(\n- '<\/head>

<\/div><\/body><\/html>',\n- );\n- iframeDocument.close();\n-\n- const enterEvents = [];\n- const node = ReactDOM.render(\n- {\n- e.persist();\n- enterEvents.push(e);\n- }}\n- \/>,\n- iframeDocument.body.getElementsByTagName('div')[0],\n- );\n-\n- node.dispatchEvent(\n- new MouseEvent('mouseover', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: null,\n- }),\n- );\n-\n- expect(enterEvents.length).toBe(1);\n- expect(enterEvents[0].target).toBe(node);\n- expect(enterEvents[0].relatedTarget).toBe(iframe.contentWindow);\n- });\n-\n- \/\/ Regression test for https:\/\/github.com\/facebook\/react\/issues\/10906.\n- it('should find the common parent after updates', () => {\n- let parentEnterCalls = 0;\n- let childEnterCalls = 0;\n- let parent = null;\n-\n- class Parent extends React.Component {\n- render() {\n- return (\n- parentEnterCalls++}\n- ref={node => (parent = node)}>\n- {this.props.showChild && (\n-

childEnterCalls++} \/>\n- )}\n- <\/div>\n- );\n- }\n- }\n-\n- ReactDOM.render(, container);\n- \/\/ The issue only reproduced on insertion during the first update.\n- ReactDOM.render(, container);\n-\n- \/\/ Enter from parent into the child.\n- parent.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: parent.firstChild,\n- }),\n- );\n-\n- \/\/ Entering a child should fire on the child, not on the parent.\n- expect(childEnterCalls).toBe(1);\n- expect(parentEnterCalls).toBe(0);\n- });\n-\n- \/\/ Test for https:\/\/github.com\/facebook\/react\/issues\/16763.\n- it('should call mouseEnter once from sibling rendered inside a rendered component', done => {\n- const mockFn = jest.fn();\n-\n- class Parent extends React.Component {\n- constructor(props) {\n- super(props);\n- this.parentEl = React.createRef();\n- }\n-\n- componentDidMount() {\n- ReactDOM.render(, this.parentEl.current);\n- }\n-\n- render() {\n- return

;\n- }\n- }\n-\n- class MouseEnterDetect extends React.Component {\n- constructor(props) {\n- super(props);\n- this.firstEl = React.createRef();\n- this.siblingEl = React.createRef();\n- }\n-\n- componentDidMount() {\n- this.siblingEl.current.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: this.firstEl.current,\n- }),\n- );\n- expect(mockFn.mock.calls.length).toBe(1);\n- done();\n- }\n-\n- render() {\n- return (\n- \n-

\n-

\n- <\/React.Fragment>\n- );\n- }\n- }\n-\n- ReactDOM.render(, container);\n- });\n-\n- it('should call mouseEnter when pressing a non tracked React node', done => {\n- const mockFn = jest.fn();\n-\n- class Parent extends React.Component {\n- constructor(props) {\n- super(props);\n- this.parentEl = React.createRef();\n- }\n-\n- componentDidMount() {\n- ReactDOM.render(, this.parentEl.current);\n- }\n-\n- render() {\n- return

;\n- }\n- }\n-\n- class MouseEnterDetect extends React.Component {\n- constructor(props) {\n- super(props);\n- this.divRef = React.createRef();\n- this.siblingEl = React.createRef();\n- }\n-\n- componentDidMount() {\n- const attachedNode = document.createElement('div');\n- this.divRef.current.appendChild(attachedNode);\n- attachedNode.dispatchEvent(\n- new MouseEvent('mouseout', {\n- bubbles: true,\n- cancelable: true,\n- relatedTarget: this.siblingEl.current,\n- }),\n- );\n- expect(mockFn.mock.calls.length).toBe(1);\n- done();\n- }\n-\n- render() {\n- return (\n-

\n-

\n- <\/div>\n- );\n- }\n- }\n-\n- ReactDOM.render(, container);\n- });\n-});\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernBeforeInputEventPlugin-test.internal.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernBeforeInputEventPlugin-test.internal.js\ndeleted file mode 100644\nindex 4d361ae7b3..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernBeforeInputEventPlugin-test.internal.js\n+++ \/dev\/null\n@@ -1,831 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @emails react-core\n- *\/\n-\n-'use strict';\n-\n-let React;\n-let ReactDOM;\n-let ReactFeatureFlags;\n-\n-describe('BeforeInputEventPlugin', () => {\n- let container;\n-\n- function loadReactDOM(envSimulator) {\n- jest.resetModules();\n- if (envSimulator) {\n- envSimulator();\n- }\n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n- return require('react-dom');\n- }\n-\n- function simulateIE11() {\n- document.documentMode = 11;\n- window.CompositionEvent = {};\n- }\n-\n- function simulateWebkit() {\n- window.CompositionEvent = {};\n- window.TextEvent = {};\n- }\n-\n- function simulateComposition() {\n- window.CompositionEvent = {};\n- }\n-\n- function simulateNoComposition() {\n- \/\/ no composition event in Window - will use fallback\n- }\n-\n- function simulateEvent(elem, type, data) {\n- const event = new Event(type, {bubbles: true});\n- Object.assign(event, data);\n- elem.dispatchEvent(event);\n- }\n-\n- function simulateKeyboardEvent(elem, type, data) {\n- const {char, value, ...rest} = data;\n- const event = new KeyboardEvent(type, {\n- bubbles: true,\n- ...rest,\n- });\n- if (char) {\n- event.char = char;\n- }\n- if (value) {\n- elem.value = value;\n- }\n- elem.dispatchEvent(event);\n- }\n-\n- function simulatePaste(elem) {\n- const pasteEvent = new Event('paste', {\n- bubbles: true,\n- });\n- pasteEvent.clipboardData = {\n- dropEffect: null,\n- effectAllowed: null,\n- files: null,\n- items: null,\n- types: null,\n- };\n- elem.dispatchEvent(pasteEvent);\n- }\n-\n- beforeEach(() => {\n- React = require('react');\n- container = document.createElement('div');\n- document.body.appendChild(container);\n- });\n-\n- afterEach(() => {\n- delete document.documentMode;\n- delete window.CompositionEvent;\n- delete window.TextEvent;\n- delete window.opera;\n- document.body.removeChild(container);\n- container = null;\n- });\n-\n- function keyCode(char) {\n- return char.charCodeAt(0);\n- }\n-\n- const scenarios = [\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: [\n- 'compositionstart',\n- {detail: {data: 'test'}, data: 'test'},\n- ],\n- },\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: [\n- 'compositionupdate',\n- {detail: {data: 'test string'}, data: 'test string'},\n- ],\n- },\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: [\n- 'compositionend',\n- {detail: {data: 'test string 3'}, data: 'test string 3'},\n- ],\n- },\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: ['textInput', {data: 'abcß'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keypress', {which: keyCode('a')}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keypress', {which: keyCode(' ')}, ' '],\n- },\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: ['textInput', {data: ' '}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keypress', {which: keyCode('a'), ctrlKey: true}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keypress', {which: keyCode('b'), altKey: true}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: [\n- 'keypress',\n- {which: keyCode('c'), altKey: true, ctrlKey: true},\n- ],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: [\n- 'keypress',\n- {which: keyCode('X'), char: '\\uD83D\\uDE0A'},\n- ],\n- },\n- {\n- eventSimulator: simulateEvent,\n- eventSimulatorArgs: ['textInput', {data: '\\uD83D\\uDE0A'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keydown', {keyCode: 229, value: 'foo'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keydown', {keyCode: 9, value: 'foobar'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keydown', {keyCode: 229, value: 'foofoo'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keyup', {keyCode: 9, value: 'fooBARfoo'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keydown', {keyCode: 229, value: 'foofoo'}],\n- },\n- {\n- eventSimulator: simulateKeyboardEvent,\n- eventSimulatorArgs: ['keypress', {keyCode: 60, value: 'Barfoofoo'}],\n- },\n- {\n- eventSimulator: simulatePaste,\n- eventSimulatorArgs: [],\n- },\n- ];\n-\n- const environments = [\n- {\n- emulator: simulateWebkit,\n- assertions: [\n- {\n- run: ({\n- beforeInputEvent,\n- compositionStartEvent,\n- spyOnBeforeInput,\n- spyOnCompositionStart,\n- }) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- expect(spyOnCompositionStart).toHaveBeenCalledTimes(1);\n- expect(compositionStartEvent.type).toBe('compositionstart');\n- expect(compositionStartEvent.data).toBe('test');\n- },\n- },\n- {\n- run: ({\n- beforeInputEvent,\n- compositionUpdateEvent,\n- spyOnBeforeInput,\n- spyOnCompositionUpdate,\n- }) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- expect(spyOnCompositionUpdate).toHaveBeenCalledTimes(1);\n- expect(compositionUpdateEvent.type).toBe('compositionupdate');\n- expect(compositionUpdateEvent.data).toBe('test string');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('compositionend');\n- expect(beforeInputEvent.data).toBe('test string 3');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('textInput');\n- expect(beforeInputEvent.data).toBe('abcß');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe(' ');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('textInput');\n- expect(beforeInputEvent.data).toBe('\\uD83D\\uDE0A');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- ],\n- },\n- {\n- emulator: simulateIE11,\n- assertions: [\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('a');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe(' ');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('c');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('\\uD83D\\uDE0A');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- ],\n- },\n- {\n- emulator: simulateNoComposition,\n- assertions: [\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('a');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe(' ');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('c');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('\\uD83D\\uDE0A');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keydown');\n- expect(beforeInputEvent.data).toBe('bar');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keyup');\n- expect(beforeInputEvent.data).toBe('BAR');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('Bar');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- ],\n- },\n- {\n- emulator: simulateComposition,\n- assertions: [\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('compositionend');\n- expect(beforeInputEvent.data).toBe('test string 3');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('a');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe(' ');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('c');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(1);\n- expect(beforeInputEvent.type).toBe('keypress');\n- expect(beforeInputEvent.data).toBe('\\uD83D\\uDE0A');\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- {\n- run: ({beforeInputEvent, spyOnBeforeInput}) => {\n- expect(spyOnBeforeInput).toHaveBeenCalledTimes(0);\n- expect(beforeInputEvent).toBeNull();\n- },\n- },\n- ],\n- },\n- ];\n-\n- const testInputComponent = (env, scenes) => {\n- let beforeInputEvent;\n- let compositionStartEvent;\n- let compositionUpdateEvent;\n- let spyOnBeforeInput;\n- let spyOnCompositionStart;\n- let spyOnCompositionUpdate;\n- ReactDOM = loadReactDOM(env.emulator);\n- const node = ReactDOM.render(\n- {\n- spyOnBeforeInput();\n- beforeInputEvent = {type, data};\n- }}\n- onCompositionStart={({type, data}) => {\n- spyOnCompositionStart();\n- compositionStartEvent = {type, data};\n- }}\n- onCompositionUpdate={({type, data}) => {\n- spyOnCompositionUpdate();\n- compositionUpdateEvent = {type, data};\n- }}\n- \/>,\n- container,\n- );\n-\n- scenes.forEach((s, id) => {\n- beforeInputEvent = null;\n- compositionStartEvent = null;\n- compositionUpdateEvent = null;\n- spyOnBeforeInput = jest.fn();\n- spyOnCompositionStart = jest.fn();\n- spyOnCompositionUpdate = jest.fn();\n- s.eventSimulator.apply(null, [node, ...s.eventSimulatorArgs]);\n- env.assertions[id].run({\n- beforeInputEvent,\n- compositionStartEvent,\n- compositionUpdateEvent,\n- spyOnBeforeInput,\n- spyOnCompositionStart,\n- spyOnCompositionUpdate,\n- });\n- });\n- };\n-\n- const testContentEditableComponent = (env, scenes) => {\n- let beforeInputEvent;\n- let compositionStartEvent;\n- let compositionUpdateEvent;\n- let spyOnBeforeInput;\n- let spyOnCompositionStart;\n- let spyOnCompositionUpdate;\n- ReactDOM = loadReactDOM(env.emulator);\n- const node = ReactDOM.render(\n- {\n- spyOnBeforeInput();\n- beforeInputEvent = {type, data};\n- }}\n- onCompositionStart={({type, data}) => {\n- spyOnCompositionStart();\n- compositionStartEvent = {type, data};\n- }}\n- onCompositionUpdate={({type, data}) => {\n- spyOnCompositionUpdate();\n- compositionUpdateEvent = {type, data};\n- }}\n- \/>,\n- container,\n- );\n-\n- scenes.forEach((s, id) => {\n- beforeInputEvent = null;\n- compositionStartEvent = null;\n- compositionUpdateEvent = null;\n- spyOnBeforeInput = jest.fn();\n- spyOnCompositionStart = jest.fn();\n- spyOnCompositionUpdate = jest.fn();\n- s.eventSimulator.apply(null, [node, ...s.eventSimulatorArgs]);\n- env.assertions[id].run({\n- beforeInputEvent,\n- compositionStartEvent,\n- compositionUpdateEvent,\n- spyOnBeforeInput,\n- spyOnCompositionStart,\n- spyOnCompositionUpdate,\n- });\n- });\n- };\n-\n- it('should extract onBeforeInput when simulating in Webkit on input[type=text]', () => {\n- testInputComponent(environments[0], scenarios);\n- });\n- it('should extract onBeforeInput when simulating in Webkit on contenteditable', () => {\n- testContentEditableComponent(environments[0], scenarios);\n- });\n-\n- it('should extract onBeforeInput when simulating in IE11 on input[type=text]', () => {\n- testInputComponent(environments[1], scenarios);\n- });\n- it('should extract onBeforeInput when simulating in IE11 on contenteditable', () => {\n- testContentEditableComponent(environments[1], scenarios);\n- });\n-\n- it('should extract onBeforeInput when simulating in env with no CompositionEvent on input[type=text]', () => {\n- testInputComponent(environments[2], scenarios);\n- });\n-\n- \/\/ in an environment using composition fallback onBeforeInput will not work\n- \/\/ as expected on a contenteditable as keydown and keyup events are translated\n- \/\/ to keypress events\n-\n- it('should extract onBeforeInput when simulating in env with only CompositionEvent on input[type=text]', () => {\n- testInputComponent(environments[3], scenarios);\n- });\n-\n- it('should extract onBeforeInput when simulating in env with only CompositionEvent on contenteditable', () => {\n- testContentEditableComponent(environments[3], scenarios);\n- });\n-});\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyBeforeInputEventPlugin-test.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernBeforeInputEventPlugin-test.js\nsimilarity index 100%\nrename from packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacyBeforeInputEventPlugin-test.js\nrename to packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernBeforeInputEventPlugin-test.js\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.internal.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.js\nsimilarity index 99%\nrename from packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.internal.js\nrename to packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.js\nindex b099d9e696..71a30e7e5d 100644\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.internal.js\n+++ b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernChangeEventPlugin-test.js\n@@ -54,7 +54,6 @@ describe('ChangeEventPlugin', () => {\n postMessageCallback(postMessageEvent);\n }\n };\n- ReactFeatureFlags.enableModernEventSystem = true;\n React = require('react');\n ReactDOM = require('react-dom');\n TestUtils = require('react-dom\/test-utils');\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.internal.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.js\nsimilarity index 98%\nrename from packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.internal.js\nrename to packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.js\nindex 4e1b8c2322..7433aacca4 100644\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.internal.js\n+++ b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernEnterLeaveEventPlugin-test.js\n@@ -11,7 +11,6 @@\n \n let React;\n let ReactDOM;\n-let ReactFeatureFlags;\n \n describe('EnterLeaveEventPlugin', () => {\n let container;\n@@ -19,8 +18,6 @@ describe('EnterLeaveEventPlugin', () => {\n beforeEach(() => {\n jest.resetModules();\n \n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n React = require('react');\n ReactDOM = require('react-dom');\n \ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSelectEventPlugin-test.internal.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSelectEventPlugin-test.internal.js\ndeleted file mode 100644\nindex be36732959..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSelectEventPlugin-test.internal.js\n+++ \/dev\/null\n@@ -1,167 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @emails react-core\n- *\/\n-\n-'use strict';\n-\n-let React;\n-let ReactDOM;\n-let ReactFeatureFlags;\n-\n-describe('SelectEventPlugin', () => {\n- let container;\n-\n- beforeEach(() => {\n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n- React = require('react');\n- ReactDOM = require('react-dom');\n-\n- container = document.createElement('div');\n- document.body.appendChild(container);\n- });\n-\n- afterEach(() => {\n- document.body.removeChild(container);\n- container = null;\n- });\n-\n- \/\/ See https:\/\/github.com\/facebook\/react\/pull\/3639 for details.\n- it('does not get confused when dependent events are registered independently', () => {\n- const select = jest.fn();\n- const onSelect = event => {\n- expect(typeof event).toBe('object');\n- expect(event.type).toBe('select');\n- expect(event.target).toBe(node);\n- select(event.currentTarget);\n- };\n-\n- \/\/ Pass `onMouseDown` so React registers a top-level listener.\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n-\n- \/\/ Trigger `mousedown` and `mouseup`. Note that\n- \/\/ React is not currently listening to `mouseup`.\n- node.dispatchEvent(\n- new MouseEvent('mousedown', {\n- bubbles: true,\n- cancelable: true,\n- }),\n- );\n- node.dispatchEvent(\n- new MouseEvent('mouseup', {\n- bubbles: true,\n- cancelable: true,\n- }),\n- );\n-\n- \/\/ Now subscribe to `onSelect`.\n- ReactDOM.render(, container);\n- node.focus();\n-\n- \/\/ This triggers a `select` event in our polyfill.\n- node.dispatchEvent(\n- new KeyboardEvent('keydown', {bubbles: true, cancelable: true}),\n- );\n-\n- \/\/ Verify that it doesn't get \"stuck\" waiting for\n- \/\/ a `mouseup` event that it has \"missed\" because\n- \/\/ a top-level listener didn't exist yet.\n- expect(select).toHaveBeenCalledTimes(1);\n- });\n-\n- it('should fire `onSelect` when a listener is present', () => {\n- const select = jest.fn();\n- const onSelect = event => {\n- expect(typeof event).toBe('object');\n- expect(event.type).toBe('select');\n- expect(event.target).toBe(node);\n- select(event.currentTarget);\n- };\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n- node.focus();\n-\n- let nativeEvent = new MouseEvent('focus', {\n- bubbles: true,\n- cancelable: true,\n- });\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(0);\n-\n- nativeEvent = new MouseEvent('mousedown', {\n- bubbles: true,\n- cancelable: true,\n- });\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(0);\n-\n- nativeEvent = new MouseEvent('mouseup', {bubbles: true, cancelable: true});\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(1);\n- });\n-\n- \/\/ Regression test for https:\/\/github.com\/facebook\/react\/issues\/11379\n- it('should not wait for `mouseup` after receiving `dragend`', () => {\n- const select = jest.fn();\n- const onSelect = event => {\n- expect(typeof event).toBe('object');\n- expect(event.type).toBe('select');\n- expect(event.target).toBe(node);\n- select(event.currentTarget);\n- };\n-\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n- node.focus();\n-\n- let nativeEvent = new MouseEvent('focus', {\n- bubbles: true,\n- cancelable: true,\n- });\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(0);\n-\n- nativeEvent = new MouseEvent('mousedown', {\n- bubbles: true,\n- cancelable: true,\n- });\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(0);\n-\n- nativeEvent = new MouseEvent('dragend', {bubbles: true, cancelable: true});\n- node.dispatchEvent(nativeEvent);\n- expect(select).toHaveBeenCalledTimes(1);\n- });\n-\n- it('should handle selectionchange events', function() {\n- const onSelect = jest.fn();\n- const node = ReactDOM.render(\n- ,\n- container,\n- );\n- node.focus();\n-\n- \/\/ Make sure the event was not called before we emit the selection change event\n- expect(onSelect).toHaveBeenCalledTimes(0);\n-\n- \/\/ This is dispatched e.g. when using CMD+a on macOS\n- document.dispatchEvent(\n- new Event('selectionchange', {bubbles: false, cancelable: false}),\n- );\n-\n- expect(onSelect).toHaveBeenCalledTimes(1);\n- });\n-});\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacySelectEventPlugin-test.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSelectEventPlugin-test.js\nsimilarity index 100%\nrename from packages\/react-dom\/src\/events\/plugins\/__tests__\/LegacySelectEventPlugin-test.js\nrename to packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSelectEventPlugin-test.js\ndiff --git a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSimpleEventPlugin-test.internal.js b\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSimpleEventPlugin-test.internal.js\ndeleted file mode 100644\nindex a8c02c96ce..0000000000\n--- a\/packages\/react-dom\/src\/events\/plugins\/__tests__\/ModernSimpleEventPlugin-test.internal.js\n+++ \/dev\/null\n@@ -1,493 +0,0 @@\n-\/**\n- * Copyright (c) Facebook, Inc. and its affiliates.\n- *\n- * This source code is licensed under the MIT license found in the\n- * LICENSE file in the root directory of this source tree.\n- *\n- * @emails react-core\n- *\/\n-\n-'use strict';\n-\n-describe('SimpleEventPlugin', function() {\n- let React;\n- let ReactDOM;\n- let Scheduler;\n- let ReactFeatureFlags;\n-\n- let onClick;\n- let container;\n-\n- function expectClickThru(element) {\n- element.click();\n- expect(onClick).toHaveBeenCalledTimes(1);\n- }\n-\n- function expectNoClickThru(element) {\n- element.click();\n- expect(onClick).toHaveBeenCalledTimes(0);\n- }\n-\n- function mounted(element) {\n- container = document.createElement('div');\n- document.body.appendChild(container);\n- element = ReactDOM.render(element, container);\n- return element;\n- }\n-\n- beforeEach(function() {\n- jest.resetModules();\n- ReactFeatureFlags = require('shared\/ReactFeatureFlags');\n- ReactFeatureFlags.enableModernEventSystem = true;\n- React = require('react');\n- ReactDOM = require('react-dom');\n- Scheduler = require('scheduler');\n-\n- onClick = jest.fn();\n- });\n-\n- afterEach(() => {\n- if (container && document.body.contains(container)) {\n- document.body.removeChild(container);\n- container = null;\n- }\n- });\n-\n- it('A non-interactive tags click when disabled', function() {\n- const element =

;\n- expectClickThru(mounted(element));\n- });\n-\n- it('A non-interactive tags clicks bubble when disabled', function() {\n- const element = mounted(\n-

\n-

\n- <\/div>,\n- );\n- const child = element.firstChild;\n- child.click();\n- expect(onClick).toHaveBeenCalledTimes(1);\n- });\n-\n- it('does not register a click when clicking a child of a disabled element', function() {\n- const element = mounted(\n-

dillon1000/react

Files changed