{"body":"* Refactor event object creation for the experimental event API","patch":"diff --git a\/packages\/events\/EventTypes.js b\/packages\/events\/EventTypes.js\nindex a03ef8f740..b48052a6ad 100644\n--- a\/packages\/events\/EventTypes.js\n+++ b\/packages\/events\/EventTypes.js\n@@ -7,29 +7,29 @@\n * @flow\n *\/\n \n-import SyntheticEvent from 'events\/SyntheticEvent';\n import type {AnyNativeEvent} from 'events\/PluginModuleType';\n import type {ReactEventResponderEventType} from 'shared\/ReactTypes';\n \n export type EventResponderContext = {\n event: AnyNativeEvent,\n- eventTarget: EventTarget,\n+ eventTarget: Element | Document,\n eventType: string,\n isPassive: () => boolean,\n isPassiveSupported: () => boolean,\n- dispatchEvent: (\n- name: string,\n- listener: (e: SyntheticEvent) => void | null,\n- pressTarget: EventTarget | null,\n- discrete: boolean,\n- extraProperties?: Object,\n+ dispatchEvent: (\n+ eventObject: E,\n+ {\n+ capture?: boolean,\n+ discrete?: boolean,\n+ stopPropagation?: boolean,\n+ },\n ) => void,\n isTargetWithinElement: (\n- childTarget: EventTarget,\n- parentTarget: EventTarget,\n+ childTarget: Element | Document,\n+ parentTarget: Element | Document,\n ) => boolean,\n- isTargetOwned: EventTarget => boolean,\n- isTargetWithinEventComponent: EventTarget => boolean,\n+ isTargetOwned: (Element | Document) => boolean,\n+ isTargetWithinEventComponent: (Element | Document) => boolean,\n isPositionWithinTouchHitTarget: (x: number, y: number) => boolean,\n addRootEventTypes: (\n rootEventTypes: Array,\n@@ -37,6 +37,6 @@ export type EventResponderContext = {\n removeRootEventTypes: (\n rootEventTypes: Array,\n ) => void,\n- requestOwnership: (target: EventTarget | null) => boolean,\n- releaseOwnership: (target: EventTarget | null) => boolean,\n+ requestOwnership: (target: Element | Document | null) => boolean,\n+ releaseOwnership: (target: Element | Document | null) => boolean,\n };\ndiff --git a\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js b\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\nindex 9c52389654..b4e982142b 100644\n--- a\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\n+++ b\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\n@@ -18,15 +18,13 @@ import type {\n ReactEventResponderEventType,\n } from 'shared\/ReactTypes';\n import type {DOMTopLevelEventType} from 'events\/TopLevelEventTypes';\n-import SyntheticEvent from 'events\/SyntheticEvent';\n-import {runEventsInBatch} from 'events\/EventBatching';\n-import {interactiveUpdates} from 'events\/ReactGenericBatching';\n-import {executeDispatch} from 'events\/EventPluginUtils';\n+import {batchedUpdates, interactiveUpdates} from 'events\/ReactGenericBatching';\n import type {Fiber} from 'react-reconciler\/src\/ReactFiber';\n-\n import {getClosestInstanceFromNode} from '..\/client\/ReactDOMComponentTree';\n \n import {enableEventAPI} from 'shared\/ReactFeatureFlags';\n+import {invokeGuardedCallbackAndCatchFirstError} from 'shared\/ReactErrorUtils';\n+import warning from 'shared\/warning';\n \n let listenToResponderEventTypesImpl;\n \n@@ -36,6 +34,8 @@ export function setListenToResponderEventTypes(\n listenToResponderEventTypesImpl = _listenToResponderEventTypesImpl;\n }\n \n+const PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;\n+\n const rootEventTypesToEventComponents: Map<\n DOMTopLevelEventType | string,\n Set,\n@@ -45,12 +45,76 @@ const targetEventTypeCached: Map<\n Set,\n > = new Map();\n const targetOwnership: Map = new Map();\n+const eventsWithStopPropagation:\n+ | WeakSet\n+ | Set<$Shape> = new PossiblyWeakSet();\n+\n+type PartialEventObject = {\n+ listener: ($Shape) => void,\n+ target: Element | Document,\n+ type: string,\n+};\n+type EventQueue = {\n+ bubble: null | Array<$Shape>,\n+ capture: null | Array<$Shape>,\n+ discrete: boolean,\n+ phase: EventQueuePhase,\n+};\n+type EventQueuePhase = 0 | 1;\n+\n+const DURING_EVENT_PHASE = 0;\n+const AFTER_EVENT_PHASE = 1;\n \n-type EventListener = (event: SyntheticEvent) => void;\n+function createEventQueue(phase: EventQueuePhase): EventQueue {\n+ return {\n+ bubble: null,\n+ capture: null,\n+ discrete: false,\n+ phase,\n+ };\n+}\n+\n+function processEvent(event: $Shape): void {\n+ const type = event.type;\n+ const listener = event.listener;\n+ invokeGuardedCallbackAndCatchFirstError(type, listener, undefined, event);\n+}\n \n-function copyEventProperties(eventData, syntheticEvent) {\n- for (let propName in eventData) {\n- syntheticEvent[propName] = eventData[propName];\n+function processEvents(\n+ bubble: null | Array<$Shape>,\n+ capture: null | Array<$Shape>,\n+): void {\n+ let i, length;\n+\n+ if (capture !== null) {\n+ for (i = capture.length; i-- > 0; ) {\n+ const event = capture[i];\n+ processEvent(capture[i]);\n+ if (eventsWithStopPropagation.has(event)) {\n+ return;\n+ }\n+ }\n+ }\n+ if (bubble !== null) {\n+ for (i = 0, length = bubble.length; i < length; ++i) {\n+ const event = bubble[i];\n+ processEvent(event);\n+ if (eventsWithStopPropagation.has(event)) {\n+ return;\n+ }\n+ }\n+ }\n+}\n+\n+function processEventQueue(eventQueue: EventQueue): void {\n+ const {bubble, capture, discrete} = eventQueue;\n+\n+ if (discrete) {\n+ interactiveUpdates(() => {\n+ processEvents(bubble, capture);\n+ });\n+ } else {\n+ processEvents(bubble, capture);\n }\n }\n \n@@ -70,6 +134,7 @@ function DOMEventResponderContext(\n this._discreteEvents = null;\n this._nonDiscreteEvents = null;\n this._isBatching = true;\n+ this._eventQueue = createEventQueue(DURING_EVENT_PHASE);\n }\n \n DOMEventResponderContext.prototype.isPassive = function(): boolean {\n@@ -81,49 +146,66 @@ DOMEventResponderContext.prototype.isPassiveSupported = function(): boolean {\n };\n \n DOMEventResponderContext.prototype.dispatchEvent = function(\n- eventName: string,\n- eventListener: EventListener,\n- eventTarget: AnyNativeEvent,\n- discrete: boolean,\n- extraProperties?: Object,\n+ possibleEventObject: Object,\n+ {\n+ capture,\n+ discrete,\n+ stopPropagation,\n+ }: {\n+ capture?: boolean,\n+ discrete?: boolean,\n+ stopPropagation?: boolean,\n+ },\n ): void {\n- const eventTargetFiber = getClosestInstanceFromNode(eventTarget);\n- const syntheticEvent = SyntheticEvent.getPooled(\n- null,\n- eventTargetFiber,\n- this.event,\n- eventTarget,\n- );\n- if (extraProperties !== undefined) {\n- copyEventProperties(extraProperties, syntheticEvent);\n+ const eventQueue = this._eventQueue;\n+ const {listener, target, type} = possibleEventObject;\n+\n+ if (listener == null || target == null || type == null) {\n+ throw new Error(\n+ 'context.dispatchEvent: \"listener\", \"target\" and \"type\" fields on event object are required.',\n+ );\n }\n- syntheticEvent.type = eventName;\n- syntheticEvent._dispatchInstances = [eventTargetFiber];\n- syntheticEvent._dispatchListeners = [eventListener];\n-\n- if (this._isBatching) {\n- let events;\n- if (discrete) {\n- events = this._discreteEvents;\n- if (events === null) {\n- events = this._discreteEvents = [];\n- }\n- } else {\n- events = this._nonDiscreteEvents;\n- if (events === null) {\n- events = this._nonDiscreteEvents = [];\n- }\n+ if (__DEV__) {\n+ possibleEventObject.preventDefault = () => {\n+ \/\/ Update this warning when we have a story around dealing with preventDefault\n+ warning(\n+ false,\n+ 'preventDefault() is no longer available on event objects created from event responder modules.',\n+ );\n+ };\n+ possibleEventObject.stopPropagation = () => {\n+ \/\/ Update this warning when we have a story around dealing with stopPropgation\n+ warning(\n+ false,\n+ 'stopPropagation() is no longer available on event objects created from event responder modules.',\n+ );\n+ };\n+ }\n+ const eventObject = ((possibleEventObject: any): $Shape);\n+ let events;\n+\n+ if (capture) {\n+ events = eventQueue.capture;\n+ if (events === null) {\n+ events = eventQueue.capture = [];\n }\n- events.push(syntheticEvent);\n } else {\n- if (discrete) {\n- interactiveUpdates(() => {\n- executeDispatch(syntheticEvent, eventListener, eventTargetFiber);\n- });\n- } else {\n- executeDispatch(syntheticEvent, eventListener, eventTargetFiber);\n+ events = eventQueue.bubble;\n+ if (events === null) {\n+ events = eventQueue.bubble = [];\n }\n }\n+ if (discrete) {\n+ eventQueue.discrete = true;\n+ }\n+ events.push(eventObject);\n+\n+ if (stopPropagation) {\n+ eventsWithStopPropagation.add(eventObject);\n+ }\n+ if (eventQueue.phase === AFTER_EVENT_PHASE) {\n+ batchedUpdates(processEventQueue, eventQueue);\n+ }\n };\n \n DOMEventResponderContext.prototype.isTargetWithinEventComponent = function(\n@@ -318,17 +400,9 @@ export function runResponderEventsInBatch(\n );\n }\n }\n- \/\/ Run batched events\n- const discreteEvents = context._discreteEvents;\n- if (discreteEvents !== null) {\n- interactiveUpdates(() => {\n- runEventsInBatch(discreteEvents);\n- });\n- }\n- const nonDiscreteEvents = context._nonDiscreteEvents;\n- if (nonDiscreteEvents !== null) {\n- runEventsInBatch(nonDiscreteEvents);\n- }\n- context._isBatching = false;\n+ processEventQueue(context._eventQueue);\n+ \/\/ In order to capture and process async events from responder modules\n+ \/\/ we create a new event queue.\n+ context._eventQueue = createEventQueue(AFTER_EVENT_PHASE);\n }\n }\ndiff --git a\/packages\/react-dom\/src\/events\/__tests__\/DOMEventResponderSystem-test.internal.js b\/packages\/react-dom\/src\/events\/__tests__\/DOMEventResponderSystem-test.internal.js\nindex 4af4f210df..b8ef52edf0 100644\n--- a\/packages\/react-dom\/src\/events\/__tests__\/DOMEventResponderSystem-test.internal.js\n+++ b\/packages\/react-dom\/src\/events\/__tests__\/DOMEventResponderSystem-test.internal.js\n@@ -228,12 +228,12 @@ describe('DOMEventResponderSystem', () => {\n ['click'],\n (context, props) => {\n if (props.onMagicClick) {\n- context.dispatchEvent(\n- 'magicclick',\n- props.onMagicClick,\n- context.eventTarget,\n- false,\n- );\n+ const event = {\n+ listener: props.onMagicClick,\n+ target: context.eventTarget,\n+ type: 'magicclick',\n+ };\n+ context.dispatchEvent(event, {discrete: true});\n }\n },\n );\ndiff --git a\/packages\/react-events\/src\/Drag.js b\/packages\/react-events\/src\/Drag.js\nindex 7181b4efa2..cc741e29b5 100644\n--- a\/packages\/react-events\/src\/Drag.js\n+++ b\/packages\/react-events\/src\/Drag.js\n@@ -14,7 +14,7 @@ const targetEventTypes = ['pointerdown', 'pointercancel'];\n const rootEventTypes = ['pointerup', {name: 'pointermove', passive: false}];\n \n type DragState = {\n- dragTarget: null | EventTarget,\n+ dragTarget: null | Element | Document,\n isPointerDown: boolean,\n isDragging: boolean,\n startX: number,\n@@ -33,18 +33,45 @@ if (typeof window !== 'undefined' && window.PointerEvent === undefined) {\n });\n }\n \n+type EventData = {\n+ diffX: number,\n+ diffY: number,\n+};\n+type DragEventType = 'dragend' | 'dragchange' | 'dragmove';\n+\n+type DragEvent = {|\n+ listener: DragEvent => void,\n+ target: Element | Document,\n+ type: DragEventType,\n+ diffX?: number,\n+ diffY?: number,\n+|};\n+\n+function createDragEvent(\n+ type: DragEventType,\n+ target: Element | Document,\n+ listener: DragEvent => void,\n+ eventData?: EventData,\n+): DragEvent {\n+ return {\n+ listener,\n+ target,\n+ type,\n+ ...eventData,\n+ };\n+}\n+\n function dispatchDragEvent(\n context: EventResponderContext,\n- name: string,\n- listener: (e: Object) => void,\n+ name: DragEventType,\n+ listener: DragEvent => void,\n state: DragState,\n discrete: boolean,\n- eventData?: {\n- diffX: number,\n- diffY: number,\n- },\n+ eventData?: EventData,\n ): void {\n- context.dispatchEvent(name, listener, state.dragTarget, discrete, eventData);\n+ const target = ((state.dragTarget: any): Element | Document);\n+ const syntheticEvent = createDragEvent(name, target, listener, eventData);\n+ context.dispatchEvent(syntheticEvent, {discrete});\n }\n \n const DragResponder = {\n@@ -112,10 +139,11 @@ const DragResponder = {\n const dragChangeEventListener = () => {\n props.onDragChange(true);\n };\n- context.dispatchEvent(\n+ dispatchDragEvent(\n+ context,\n 'dragchange',\n dragChangeEventListener,\n- state.dragTarget,\n+ state,\n true,\n );\n }\n@@ -160,10 +188,11 @@ const DragResponder = {\n const dragChangeEventListener = () => {\n props.onDragChange(false);\n };\n- context.dispatchEvent(\n+ dispatchDragEvent(\n+ context,\n 'dragchange',\n dragChangeEventListener,\n- state.dragTarget,\n+ state,\n true,\n );\n }\ndiff --git a\/packages\/react-events\/src\/Focus.js b\/packages\/react-events\/src\/Focus.js\nindex 9c652f69d2..c574f1e3a1 100644\n--- a\/packages\/react-events\/src\/Focus.js\n+++ b\/packages\/react-events\/src\/Focus.js\n@@ -19,24 +19,49 @@ type FocusState = {\n isFocused: boolean,\n };\n \n+type FocusEventType = 'focus' | 'blur' | 'focuschange';\n+\n+type FocusEvent = {|\n+ listener: FocusEvent => void,\n+ target: Element | Document,\n+ type: FocusEventType,\n+|};\n+\n+function createFocusEvent(\n+ type: FocusEventType,\n+ target: Element | Document,\n+ listener: FocusEvent => void,\n+): FocusEvent {\n+ return {\n+ listener,\n+ target,\n+ type,\n+ };\n+}\n+\n function dispatchFocusInEvents(context: EventResponderContext, props: Object) {\n const {event, eventTarget} = context;\n if (context.isTargetWithinEventComponent((event: any).relatedTarget)) {\n return;\n }\n if (props.onFocus) {\n- context.dispatchEvent('focus', props.onFocus, eventTarget, true);\n+ const syntheticEvent = createFocusEvent(\n+ 'focus',\n+ eventTarget,\n+ props.onFocus,\n+ );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n if (props.onFocusChange) {\n const focusChangeEventListener = () => {\n props.onFocusChange(true);\n };\n- context.dispatchEvent(\n+ const syntheticEvent = createFocusEvent(\n 'focuschange',\n- focusChangeEventListener,\n eventTarget,\n- true,\n+ focusChangeEventListener,\n );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n }\n \n@@ -46,18 +71,19 @@ function dispatchFocusOutEvents(context: EventResponderContext, props: Object) {\n return;\n }\n if (props.onBlur) {\n- context.dispatchEvent('blur', props.onBlur, eventTarget, true);\n+ const syntheticEvent = createFocusEvent('blur', eventTarget, props.onBlur);\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n if (props.onFocusChange) {\n const focusChangeEventListener = () => {\n props.onFocusChange(false);\n };\n- context.dispatchEvent(\n+ const syntheticEvent = createFocusEvent(\n 'focuschange',\n- focusChangeEventListener,\n eventTarget,\n- true,\n+ focusChangeEventListener,\n );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n }\n \ndiff --git a\/packages\/react-events\/src\/Hover.js b\/packages\/react-events\/src\/Hover.js\nindex f8585fae8c..75992d246a 100644\n--- a\/packages\/react-events\/src\/Hover.js\n+++ b\/packages\/react-events\/src\/Hover.js\n@@ -23,6 +23,26 @@ type HoverState = {\n isTouched: boolean,\n };\n \n+type HoverEventType = 'hoverstart' | 'hoverend' | 'hoverchange';\n+\n+type HoverEvent = {|\n+ listener: HoverEvent => void,\n+ target: Element | Document,\n+ type: HoverEventType,\n+|};\n+\n+function createHoverEvent(\n+ type: HoverEventType,\n+ target: Element | Document,\n+ listener: HoverEvent => void,\n+): HoverEvent {\n+ return {\n+ listener,\n+ target,\n+ type,\n+ };\n+}\n+\n \/\/ In the case we don't have PointerEvents (Safari), we listen to touch events\n \/\/ too\n if (typeof window !== 'undefined' && window.PointerEvent === undefined) {\n@@ -39,18 +59,23 @@ function dispatchHoverStartEvents(\n return;\n }\n if (props.onHoverStart) {\n- context.dispatchEvent('hoverstart', props.onHoverStart, eventTarget, true);\n+ const syntheticEvent = createHoverEvent(\n+ 'hoverstart',\n+ eventTarget,\n+ props.onHoverStart,\n+ );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n if (props.onHoverChange) {\n const hoverChangeEventListener = () => {\n props.onHoverChange(true);\n };\n- context.dispatchEvent(\n+ const syntheticEvent = createHoverEvent(\n 'hoverchange',\n- hoverChangeEventListener,\n eventTarget,\n- true,\n+ hoverChangeEventListener,\n );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n }\n \n@@ -60,18 +85,23 @@ function dispatchHoverEndEvents(context: EventResponderContext, props: Object) {\n return;\n }\n if (props.onHoverEnd) {\n- context.dispatchEvent('hoverend', props.onHoverEnd, eventTarget, true);\n+ const syntheticEvent = createHoverEvent(\n+ 'hoverend',\n+ eventTarget,\n+ props.onHoverEnd,\n+ );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n if (props.onHoverChange) {\n const hoverChangeEventListener = () => {\n props.onHoverChange(false);\n };\n- context.dispatchEvent(\n+ const syntheticEvent = createHoverEvent(\n 'hoverchange',\n- hoverChangeEventListener,\n eventTarget,\n- true,\n+ hoverChangeEventListener,\n );\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n }\n \ndiff --git a\/packages\/react-events\/src\/Press.js b\/packages\/react-events\/src\/Press.js\nindex d2ea6121c8..3b7498153c 100644\n--- a\/packages\/react-events\/src\/Press.js\n+++ b\/packages\/react-events\/src\/Press.js\n@@ -36,13 +36,13 @@ type PressProps = {\n delayLongPress: number,\n delayPressEnd: number,\n delayPressStart: number,\n- onLongPress: (e: Object) => void,\n+ onLongPress: (e: PressEvent) => void,\n onLongPressChange: boolean => void,\n onLongPressShouldCancelPress: () => boolean,\n- onPress: (e: Object) => void,\n+ onPress: (e: PressEvent) => void,\n onPressChange: boolean => void,\n- onPressEnd: (e: Object) => void,\n- onPressStart: (e: Object) => void,\n+ onPressEnd: (e: PressEvent) => void,\n+ onPressStart: (e: PressEvent) => void,\n pressRententionOffset: Object,\n };\n \n@@ -52,17 +52,45 @@ type PressState = {\n isLongPressed: boolean,\n isPressed: boolean,\n longPressTimeout: null | TimeoutID,\n- pressTarget: null | EventTarget,\n+ pressTarget: null | Element | Document,\n shouldSkipMouseAfterTouch: boolean,\n };\n \n+type PressEventType =\n+ | 'press'\n+ | 'pressstart'\n+ | 'pressend'\n+ | 'presschange'\n+ | 'longpress'\n+ | 'longpresschange';\n+\n+type PressEvent = {|\n+ listener: PressEvent => void,\n+ target: Element | Document,\n+ type: PressEventType,\n+|};\n+\n+function createPressEvent(\n+ type: PressEventType,\n+ target: Element | Document,\n+ listener: PressEvent => void,\n+): PressEvent {\n+ return {\n+ listener,\n+ target,\n+ type,\n+ };\n+}\n+\n function dispatchPressEvent(\n context: EventResponderContext,\n state: PressState,\n- name: string,\n+ name: PressEventType,\n listener: (e: Object) => void,\n ): void {\n- context.dispatchEvent(name, listener, state.pressTarget, true);\n+ const target = ((state.pressTarget: any): Element | Document);\n+ const syntheticEvent = createPressEvent(name, target, listener);\n+ context.dispatchEvent(syntheticEvent, {discrete: true});\n }\n \n function dispatchPressStartEvents(\n@@ -97,9 +125,10 @@ function dispatchPressStartEvents(\n if (props.onLongPress) {\n const longPressEventListener = e => {\n props.onLongPress(e);\n- if (e.nativeEvent.defaultPrevented) {\n- state.defaultPrevented = true;\n- }\n+ \/\/ TODO address this again at some point\n+ \/\/ if (e.nativeEvent.defaultPrevented) {\n+ \/\/ state.defaultPrevented = true;\n+ \/\/ }\n };\n dispatchPressEvent(context, state, 'longpress', longPressEventListener);\n }\n@@ -193,24 +222,7 @@ const PressResponder = {\n ) {\n return;\n }\n- let keyPressEventListener = props.onPress;\n-\n- \/\/ Wrap listener with prevent default behaviour, unless\n- \/\/ we are dealing with an anchor. Anchor tags are special beacuse\n- \/\/ we need to use the \"click\" event, to properly allow browser\n- \/\/ heuristics for cancelling link clicks. Furthermore, iOS and\n- \/\/ Android can show previous of anchor tags that requires working\n- \/\/ with click rather than touch events (and mouse down\/up).\n- if (!isAnchorTagElement(eventTarget)) {\n- keyPressEventListener = e => {\n- if (!e.isDefaultPrevented() && !e.nativeEvent.defaultPrevented) {\n- e.preventDefault();\n- state.defaultPrevented = true;\n- props.onPress(e);\n- }\n- };\n- }\n- dispatchPressEvent(context, state, 'press', keyPressEventListener);\n+ dispatchPressEvent(context, state, 'press', props.onPress);\n break;\n }\n \n@@ -332,9 +344,10 @@ const PressResponder = {\n ) {\n const pressEventListener = e => {\n props.onPress(e);\n- if (e.nativeEvent.defaultPrevented) {\n- state.defaultPrevented = true;\n- }\n+ \/\/ TODO address this again at some point\n+ \/\/ if (e.nativeEvent.defaultPrevented) {\n+ \/\/ state.defaultPrevented = true;\n+ \/\/ }\n };\n dispatchPressEvent(context, state, 'press', pressEventListener);\n }\ndiff --git a\/packages\/react-events\/src\/Swipe.js b\/packages\/react-events\/src\/Swipe.js\nindex f265b24732..c67b502316 100644\n--- a\/packages\/react-events\/src\/Swipe.js\n+++ b\/packages\/react-events\/src\/Swipe.js\n@@ -23,18 +23,45 @@ if (typeof window !== 'undefined' && window.PointerEvent === undefined) {\n });\n }\n \n+type EventData = {\n+ diffX: number,\n+ diffY: number,\n+};\n+type SwipeEventType = 'swipeleft' | 'swiperight' | 'swipeend' | 'swipemove';\n+\n+type SwipeEvent = {|\n+ listener: SwipeEvent => void,\n+ target: Element | Document,\n+ type: SwipeEventType,\n+ diffX?: number,\n+ diffY?: number,\n+|};\n+\n+function createSwipeEvent(\n+ type: SwipeEventType,\n+ target: Element | Document,\n+ listener: SwipeEvent => void,\n+ eventData?: EventData,\n+): SwipeEvent {\n+ return {\n+ listener,\n+ target,\n+ type,\n+ ...eventData,\n+ };\n+}\n+\n function dispatchSwipeEvent(\n context: EventResponderContext,\n- name: string,\n- listener: (e: Object) => void,\n+ name: SwipeEventType,\n+ listener: SwipeEvent => void,\n state: SwipeState,\n discrete: boolean,\n- eventData?: {\n- diffX: number,\n- diffY: number,\n- },\n+ eventData?: EventData,\n ) {\n- context.dispatchEvent(name, listener, state.swipeTarget, discrete, eventData);\n+ const target = ((state.swipeTarget: any): Element | Document);\n+ const syntheticEvent = createSwipeEvent(name, target, listener, eventData);\n+ context.dispatchEvent(syntheticEvent, {discrete});\n }\n \n type SwipeState = {\n@@ -44,7 +71,7 @@ type SwipeState = {\n startX: number,\n startY: number,\n touchId: null | number,\n- swipeTarget: null | EventTarget,\n+ swipeTarget: null | Element | Document,\n x: number,\n y: number,\n };\ndiff --git a\/packages\/react-events\/src\/__tests__\/Press-test.internal.js b\/packages\/react-events\/src\/__tests__\/Press-test.internal.js\nindex 1483e089ec..1505c1f303 100644\n--- a\/packages\/react-events\/src\/__tests__\/Press-test.internal.js\n+++ b\/packages\/react-events\/src\/__tests__\/Press-test.internal.js\n@@ -388,8 +388,10 @@ describe('Event responder: Press', () => {\n \n events = [];\n ref.current.dispatchEvent(createKeyboardEvent('keydown', {key: 'Enter'}));\n- \/\/ Outer press should not occur as inner press will preventDefault\n- expect(events).toEqual(['keydown', 'inner: onPress']);\n+ \/\/ TODO update this test once we have a form of stopPropagation in\n+ \/\/ the responder system again. This test had to be updated because\n+ \/\/ we have removed stopPropagation() from synthetic events.\n+ expect(events).toEqual(['keydown', 'inner: onPress', 'outer: onPress']);\n });\n });\n });\n","parents":["6a1e6b2f78da3a56aa497902951c6e9ce654eafc"],"files":[{"status":"M","path":"packages\/events\/EventTypes.js"},{"status":"M","path":"packages\/react-dom\/src\/events\/DOMEventResponderSystem.js"},{"status":"M","path":"packages\/react-dom\/src\/events\/__tests__\/DOMEventResponderSystem-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/Drag.js"},{"status":"M","path":"packages\/react-events\/src\/Focus.js"},{"status":"M","path":"packages\/react-events\/src\/Hover.js"},{"status":"M","path":"packages\/react-events\/src\/Press.js"},{"status":"M","path":"packages\/react-events\/src\/Swipe.js"},{"status":"M","path":"packages\/react-events\/src\/__tests__\/Press-test.internal.js"}],"commit":{"revision":"9307932fe5b59c2d5ce8d04823b94ec0e48b206e","shortRevision":"9307932fe5","authoredAt":"2019-04-02T20:03:11+01:00","subject":"Refactor event object creation for the experimental event API (#15295)","authorName":"Dominic Gannaway","authorEmail":"trueadm@users.noreply.github.com"}}

dillon1000/react

Files changed