diff --git a/packages/react-dom/src/events/DOMEventProperties.js b/packages/react-dom/src/events/DOMEventProperties.js index 05f43b1b1120..a9d56d304e22 100644 --- a/packages/react-dom/src/events/DOMEventProperties.js +++ b/packages/react-dom/src/events/DOMEventProperties.js @@ -36,11 +36,17 @@ export const topLevelEventsToDispatchConfig: Map< const eventPriorities = new Map(); -// We store all the DOMTopLevelEventTypes and their React Types in pairs of two. -// Furthermore, we ignore prettier so we can keep the formatting sane. +// We store most of the events in this module in pairs of two strings so we can re-use +// the code required to apply the same logic for event prioritization and that of the +// SimpleEventPlugin. This complicates things slightly, but the aim is to reduce code +// duplication (for which there would be quite a bit). For the events that are not needed +// for the SimpleEventPlugin (otherDiscreteEvents) we process them separately as an +// array of top level events. + +// Lastly, we ignore prettier so we can keep the formatting sane. // prettier-ignore -const discreteEvents = [ +const discreteEventPairsForSimpleEventPlugin = [ DOMTopLevelEventTypes.TOP_BLUR, 'blur', DOMTopLevelEventTypes.TOP_CANCEL, 'cancel', DOMTopLevelEventTypes.TOP_CLICK, 'click', @@ -77,8 +83,17 @@ const discreteEvents = [ DOMTopLevelEventTypes.TOP_VOLUME_CHANGE, 'volumeChange', ]; +const otherDiscreteEvents = [ + DOMTopLevelEventTypes.TOP_CHANGE, + DOMTopLevelEventTypes.TOP_SELECTION_CHANGE, + DOMTopLevelEventTypes.TOP_TEXT_INPUT, + DOMTopLevelEventTypes.TOP_COMPOSITION_START, + DOMTopLevelEventTypes.TOP_COMPOSITION_END, + DOMTopLevelEventTypes.TOP_COMPOSITION_UPDATE, +]; + // prettier-ignore -const userBlockingEvents = [ +const userBlockingPairsForSimpleEventPlugin = [ DOMTopLevelEventTypes.TOP_DRAG, 'drag', DOMTopLevelEventTypes.TOP_DRAG_ENTER, 'dragEnter', DOMTopLevelEventTypes.TOP_DRAG_EXIT, 'dragExit', @@ -97,7 +112,7 @@ const userBlockingEvents = [ ]; // prettier-ignore -const continuousEvents = [ +const continuousPairsForSimpleEventPlugin = [ DOMTopLevelEventTypes.TOP_ABORT, 'abort', DOMTopLevelEventTypes.TOP_ANIMATION_END, 'animationEnd', DOMTopLevelEventTypes.TOP_ANIMATION_ITERATION, 'animationIteration', @@ -144,7 +159,7 @@ const continuousEvents = [ * ]); */ -function processTopEventTypesByPriority( +function processSimpleEventPluginPairsByPriority( eventTypes: Array, priority: EventPriority, ): void { @@ -174,9 +189,30 @@ function processTopEventTypesByPriority( } } -processTopEventTypesByPriority(discreteEvents, DiscreteEvent); -processTopEventTypesByPriority(userBlockingEvents, UserBlockingEvent); -processTopEventTypesByPriority(continuousEvents, ContinuousEvent); +function processTopEventPairsByPriority( + eventTypes: Array, + priority: EventPriority, +): void { + for (let i = 0; i < eventTypes.length; i++) { + eventPriorities.set(eventTypes[i], priority); + } +} + +// SimpleEventPlugin +processSimpleEventPluginPairsByPriority( + discreteEventPairsForSimpleEventPlugin, + DiscreteEvent, +); +processSimpleEventPluginPairsByPriority( + userBlockingPairsForSimpleEventPlugin, + UserBlockingEvent, +); +processSimpleEventPluginPairsByPriority( + continuousPairsForSimpleEventPlugin, + ContinuousEvent, +); +// Not used by SimpleEventPlugin +processTopEventPairsByPriority(otherDiscreteEvents, DiscreteEvent); export function getEventPriorityForPluginSystem( topLevelType: TopLevelType,