{"body":"","files":[{"status":"M","path":"packages\/react-dom\/src\/client\/ReactDOMHostConfig.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\/FocusScope.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__\/Drag-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/__tests__\/Focus-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/__tests__\/FocusScope-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/__tests__\/Hover-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/__tests__\/Press-test.internal.js"},{"status":"M","path":"packages\/react-events\/src\/utils.js"},{"status":"M","path":"packages\/shared\/ReactTypes.js"}],"parents":["c530639dd21543ab8d7d9e83d53197cda234b26b"],"patch":"diff --git a\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js b\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\nindex ee76c116e6..97369483d2 100644\n--- a\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\n+++ b\/packages\/react-dom\/src\/client\/ReactDOMHostConfig.js\n@@ -896,8 +896,8 @@ export function mountEventComponent(\n eventComponentInstance: ReactEventComponentInstance,\n ): void {\n if (enableEventAPI) {\n- mountEventResponder(eventComponentInstance);\n updateEventComponent(eventComponentInstance);\n+ mountEventResponder(eventComponentInstance);\n }\n }\n \ndiff --git a\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js b\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\nindex 9aed034d03..40c4c703d3 100644\n--- a\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\n+++ b\/packages\/react-dom\/src\/events\/DOMEventResponderSystem.js\n@@ -84,10 +84,13 @@ const eventListeners:\n ($Shape) => void,\n > = new PossiblyWeakMap();\n \n-let alreadyDispatching = false;\n+const responderOwners: Map<\n+ ReactEventResponder,\n+ ReactEventComponentInstance,\n+> = new Map();\n+let globalOwner = null;\n \n let currentTimers = new Map();\n-let currentOwner = null;\n let currentInstance: null | ReactEventComponentInstance = null;\n let currentEventQueue: null | EventQueue = null;\n \n@@ -131,8 +134,9 @@ const eventResponderContext: ReactResponderContext = {\n eventListeners.set(eventObject, listener);\n eventQueue.events.push(eventObject);\n },\n- isPositionWithinTouchHitTarget(doc: Document, x: number, y: number): boolean {\n+ isPositionWithinTouchHitTarget(x: number, y: number): boolean {\n validateResponderContext();\n+ const doc = getActiveDocument();\n \/\/ This isn't available in some environments (JSDOM)\n if (typeof doc.elementFromPoint !== 'function') {\n return false;\n@@ -188,6 +192,27 @@ const eventResponderContext: ReactResponderContext = {\n }\n return false;\n },\n+ isTargetWithinEventResponderScope(target: Element | Document): boolean {\n+ validateResponderContext();\n+ const responder = ((currentInstance: any): ReactEventComponentInstance)\n+ .responder;\n+ if (target != null) {\n+ let fiber = getClosestInstanceFromNode(target);\n+ while (fiber !== null) {\n+ if (fiber.stateNode === currentInstance) {\n+ return true;\n+ }\n+ if (\n+ fiber.tag === EventComponent &&\n+ fiber.stateNode.responder === responder\n+ ) {\n+ return false;\n+ }\n+ fiber = fiber.return;\n+ }\n+ }\n+ return false;\n+ },\n isTargetWithinElement(\n childTarget: Element | Document,\n parentTarget: Element | Document,\n@@ -204,12 +229,10 @@ const eventResponderContext: ReactResponderContext = {\n }\n return false;\n },\n- addRootEventTypes(\n- doc: Document,\n- rootEventTypes: Array,\n- ): void {\n+ addRootEventTypes(rootEventTypes: Array): void {\n validateResponderContext();\n- listenToResponderEventTypesImpl(rootEventTypes, doc);\n+ const activeDocument = getActiveDocument();\n+ listenToResponderEventTypesImpl(rootEventTypes, activeDocument);\n for (let i = 0; i < rootEventTypes.length; i++) {\n const rootEventType = rootEventTypes[i];\n const topLevelEventType =\n@@ -265,25 +288,38 @@ const eventResponderContext: ReactResponderContext = {\n },\n hasOwnership(): boolean {\n validateResponderContext();\n- return currentOwner === currentInstance;\n+ const responder = ((currentInstance: any): ReactEventComponentInstance)\n+ .responder;\n+ return (\n+ globalOwner === currentInstance ||\n+ responderOwners.get(responder) === currentInstance\n+ );\n },\n- requestOwnership(): boolean {\n+ requestGlobalOwnership(): boolean {\n validateResponderContext();\n- if (currentOwner !== null) {\n+ if (globalOwner !== null) {\n return false;\n }\n- currentOwner = currentInstance;\n- triggerOwnershipListeners();\n+ globalOwner = currentInstance;\n+ triggerOwnershipListeners(null);\n return true;\n },\n- releaseOwnership(): boolean {\n+ requestResponderOwnership(): boolean {\n validateResponderContext();\n- if (currentOwner !== currentInstance) {\n+ const eventComponentInstance = ((currentInstance: any): ReactEventComponentInstance);\n+ const responder = eventComponentInstance.responder;\n+ if (responderOwners.has(responder)) {\n return false;\n }\n- currentOwner = null;\n- triggerOwnershipListeners();\n- return false;\n+ responderOwners.set(responder, eventComponentInstance);\n+ triggerOwnershipListeners(responder);\n+ return true;\n+ },\n+ releaseOwnership(): boolean {\n+ validateResponderContext();\n+ return releaseOwnershipForEventComponentInstance(\n+ ((currentInstance: any): ReactEventComponentInstance),\n+ );\n },\n setTimeout(func: () => void, delay): Symbol {\n validateResponderContext();\n@@ -330,9 +366,6 @@ const eventResponderContext: ReactResponderContext = {\n let node = ((eventComponentInstance.currentFiber: any): Fiber).child;\n \n while (node !== null) {\n- if (node.stateNode === currentInstance) {\n- break;\n- }\n if (isFiberHostComponentFocusable(node)) {\n focusableElements.push(node.stateNode);\n } else {\n@@ -353,13 +386,44 @@ const eventResponderContext: ReactResponderContext = {\n if (parent === null) {\n break;\n }\n+ if (parent.stateNode === currentInstance) {\n+ break;\n+ }\n node = parent.sibling;\n }\n \n return focusableElements;\n },\n+ getActiveDocument,\n };\n \n+function getActiveDocument(): Document {\n+ const eventComponentInstance = ((currentInstance: any): ReactEventComponentInstance);\n+ const rootElement = ((eventComponentInstance.rootInstance: any): Element);\n+ return rootElement.ownerDocument;\n+}\n+\n+function releaseOwnershipForEventComponentInstance(\n+ eventComponentInstance: ReactEventComponentInstance,\n+): boolean {\n+ const responder = eventComponentInstance.responder;\n+ let triggerOwnershipListenersWith;\n+ if (responderOwners.get(responder) === eventComponentInstance) {\n+ responderOwners.delete(responder);\n+ triggerOwnershipListenersWith = responder;\n+ }\n+ if (globalOwner === eventComponentInstance) {\n+ globalOwner = null;\n+ triggerOwnershipListenersWith = null;\n+ }\n+ if (triggerOwnershipListenersWith !== undefined) {\n+ triggerOwnershipListeners(triggerOwnershipListenersWith);\n+ return true;\n+ } else {\n+ return false;\n+ }\n+}\n+\n function isFiberHostComponentFocusable(fiber: Fiber): boolean {\n if (fiber.tag !== HostComponent) {\n return false;\n@@ -368,18 +432,22 @@ function isFiberHostComponentFocusable(fiber: Fiber): boolean {\n if (memoizedProps.tabIndex === -1 || memoizedProps.disabled) {\n return false;\n }\n- if (memoizedProps.tabIndex === 0) {\n+ if (memoizedProps.tabIndex === 0 || memoizedProps.contentEditable === true) {\n return true;\n }\n if (type === 'a' || type === 'area') {\n- return !!memoizedProps.href;\n+ return !!memoizedProps.href && memoizedProps.rel !== 'ignore';\n+ }\n+ if (type === 'input') {\n+ return memoizedProps.type !== 'hidden' && memoizedProps.type !== 'file';\n }\n return (\n type === 'button' ||\n type === 'textarea' ||\n- type === 'input' ||\n type === 'object' ||\n- type === 'select'\n+ type === 'select' ||\n+ type === 'iframe' ||\n+ type === 'embed'\n );\n }\n \n@@ -487,15 +555,13 @@ function getTargetEventResponderInstances(\n \/\/ Traverse up the fiber tree till we find event component fibers.\n if (node.tag === EventComponent) {\n const eventComponentInstance = node.stateNode;\n- if (currentOwner === null || currentOwner === eventComponentInstance) {\n- const responder = eventComponentInstance.responder;\n- const targetEventTypes = responder.targetEventTypes;\n- \/\/ Validate the target event type exists on the responder\n- if (targetEventTypes !== undefined) {\n- const targetEventTypesSet = getTargetEventTypesSet(targetEventTypes);\n- if (targetEventTypesSet.has(topLevelType)) {\n- eventResponderInstances.push(eventComponentInstance);\n- }\n+ const responder = eventComponentInstance.responder;\n+ const targetEventTypes = responder.targetEventTypes;\n+ \/\/ Validate the target event type exists on the responder\n+ if (targetEventTypes !== undefined) {\n+ const targetEventTypesSet = getTargetEventTypesSet(targetEventTypes);\n+ if (targetEventTypesSet.has(topLevelType)) {\n+ eventResponderInstances.push(eventComponentInstance);\n }\n }\n }\n@@ -516,18 +582,35 @@ function getRootEventResponderInstances(\n \n for (let i = 0; i < rootEventComponentInstances.length; i++) {\n const rootEventComponentInstance = rootEventComponentInstances[i];\n-\n- if (\n- currentOwner === null ||\n- currentOwner === rootEventComponentInstance\n- ) {\n- eventResponderInstances.push(rootEventComponentInstance);\n- }\n+ eventResponderInstances.push(rootEventComponentInstance);\n }\n }\n return eventResponderInstances;\n }\n \n+function shouldSkipEventComponent(\n+ eventResponderInstance: ReactEventComponentInstance,\n+ propagatedEventResponders: null | Set,\n+): boolean {\n+ const responder = eventResponderInstance.responder;\n+ if (propagatedEventResponders !== null && responder.stopLocalPropagation) {\n+ if (propagatedEventResponders.has(responder)) {\n+ return true;\n+ }\n+ propagatedEventResponders.add(responder);\n+ }\n+ if (globalOwner && globalOwner !== eventResponderInstance) {\n+ return true;\n+ }\n+ if (\n+ responderOwners.has(responder) &&\n+ responderOwners.get(responder) !== eventResponderInstance\n+ ) {\n+ return true;\n+ }\n+ return false;\n+}\n+\n function traverseAndHandleEventResponderInstances(\n topLevelType: DOMTopLevelEventType,\n targetFiber: null | Fiber,\n@@ -564,14 +647,16 @@ function traverseAndHandleEventResponderInstances(\n for (i = length; i-- > 0; ) {\n const targetEventResponderInstance = targetEventResponderInstances[i];\n const {responder, props, state} = targetEventResponderInstance;\n- if (responder.stopLocalPropagation) {\n- if (propagatedEventResponders.has(responder)) {\n- continue;\n- }\n- propagatedEventResponders.add(responder);\n- }\n const eventListener = responder.onEventCapture;\n if (eventListener !== undefined) {\n+ if (\n+ shouldSkipEventComponent(\n+ targetEventResponderInstance,\n+ propagatedEventResponders,\n+ )\n+ ) {\n+ continue;\n+ }\n currentInstance = targetEventResponderInstance;\n eventListener(responderEvent, eventResponderContext, props, state);\n }\n@@ -582,14 +667,16 @@ function traverseAndHandleEventResponderInstances(\n for (i = 0; i < length; i++) {\n const targetEventResponderInstance = targetEventResponderInstances[i];\n const {responder, props, state} = targetEventResponderInstance;\n- if (responder.stopLocalPropagation) {\n- if (propagatedEventResponders.has(responder)) {\n- continue;\n- }\n- propagatedEventResponders.add(responder);\n- }\n const eventListener = responder.onEvent;\n if (eventListener !== undefined) {\n+ if (\n+ shouldSkipEventComponent(\n+ targetEventResponderInstance,\n+ propagatedEventResponders,\n+ )\n+ ) {\n+ continue;\n+ }\n currentInstance = targetEventResponderInstance;\n eventListener(responderEvent, eventResponderContext, props, state);\n }\n@@ -606,6 +693,9 @@ function traverseAndHandleEventResponderInstances(\n const {responder, props, state} = rootEventResponderInstance;\n const eventListener = responder.onRootEvent;\n if (eventListener !== undefined) {\n+ if (shouldSkipEventComponent(rootEventResponderInstance, null)) {\n+ continue;\n+ }\n currentInstance = rootEventResponderInstance;\n eventListener(responderEvent, eventResponderContext, props, state);\n }\n@@ -613,13 +703,18 @@ function traverseAndHandleEventResponderInstances(\n }\n }\n \n-function triggerOwnershipListeners(): void {\n+function triggerOwnershipListeners(\n+ limitByResponder: null | ReactEventResponder,\n+): void {\n const listeningInstances = Array.from(ownershipChangeListeners);\n const previousInstance = currentInstance;\n try {\n for (let i = 0; i < listeningInstances.length; i++) {\n const instance = listeningInstances[i];\n const {props, responder, state} = instance;\n+ if (limitByResponder !== null && limitByResponder !== responder) {\n+ continue;\n+ }\n currentInstance = instance;\n const onOwnershipChange = responder.onOwnershipChange;\n if (onOwnershipChange !== undefined) {\n@@ -670,9 +765,12 @@ export function unmountEventResponder(\n currentTimers = null;\n }\n }\n- if (currentOwner === eventComponentInstance) {\n- currentOwner = null;\n- triggerOwnershipListeners();\n+ try {\n+ currentEventQueue = createEventQueue();\n+ releaseOwnershipForEventComponentInstance(eventComponentInstance);\n+ processEventQueue();\n+ } finally {\n+ currentEventQueue = null;\n }\n if (responder.onOwnershipChange !== undefined) {\n ownershipChangeListeners.delete(eventComponentInstance);\n@@ -709,10 +807,10 @@ export function dispatchEventForResponderEventSystem(\n eventSystemFlags: EventSystemFlags,\n ): void {\n if (enableEventAPI) {\n- if (alreadyDispatching) {\n- return;\n- }\n- alreadyDispatching = true;\n+ const previousEventQueue = currentEventQueue;\n+ const previousInstance = currentInstance;\n+ const previousTimers = currentTimers;\n+ currentTimers = null;\n currentEventQueue = createEventQueue();\n try {\n traverseAndHandleEventResponderInstances(\n@@ -724,10 +822,9 @@ export function dispatchEventForResponderEventSystem(\n );\n processEventQueue();\n } finally {\n- currentTimers = null;\n- currentInstance = null;\n- currentEventQueue = null;\n- alreadyDispatching = false;\n+ currentTimers = previousTimers;\n+ currentInstance = previousInstance;\n+ currentEventQueue = previousEventQueue;\n }\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 dfb20db7a0..36aeb91d63 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@@ -638,7 +638,7 @@ describe('DOMEventResponderSystem', () => {\n undefined,\n undefined,\n (event, context, props, state) => {\n- ownershipGained = context.requestOwnership();\n+ ownershipGained = context.requestGlobalOwnership();\n },\n undefined,\n undefined,\ndiff --git a\/packages\/react-events\/src\/Drag.js b\/packages\/react-events\/src\/Drag.js\nindex 606102eb29..c6c8633476 100644\n--- a\/packages\/react-events\/src\/Drag.js\n+++ b\/packages\/react-events\/src\/Drag.js\n@@ -129,7 +129,7 @@ const DragResponder = {\n );\n }\n \n- context.addRootEventTypes(target.ownerDocument, rootEventTypes);\n+ context.addRootEventTypes(rootEventTypes);\n }\n break;\n }\n@@ -166,7 +166,7 @@ const DragResponder = {\n props.onShouldClaimOwnership &&\n props.onShouldClaimOwnership()\n ) {\n- shouldEnableDragging = context.requestOwnership();\n+ shouldEnableDragging = context.requestGlobalOwnership();\n }\n if (shouldEnableDragging) {\n state.isDragging = true;\ndiff --git a\/packages\/react-events\/src\/FocusScope.js b\/packages\/react-events\/src\/FocusScope.js\nindex e5b05cb1bc..ba1747cfdc 100644\n--- a\/packages\/react-events\/src\/FocusScope.js\n+++ b\/packages\/react-events\/src\/FocusScope.js\n@@ -24,10 +24,8 @@ type FocusScopeState = {\n currentFocusedNode: null | HTMLElement,\n };\n \n-const rootEventTypes = [\n- {name: 'focus', passive: true, capture: true},\n- {name: 'keydown', passive: false},\n-];\n+const targetEventTypes = [{name: 'keydown', passive: false}];\n+const rootEventTypes = [{name: 'focus', passive: true, capture: true}];\n \n function focusFirstChildEventTarget(\n context: ReactResponderContext,\n@@ -37,24 +35,11 @@ function focusFirstChildEventTarget(\n if (elements.length > 0) {\n const firstElement = elements[0];\n firstElement.focus();\n- state.currentFocusedNode = firstElement;\n- }\n-}\n-\n-function focusLastChildEventTarget(\n- context: ReactResponderContext,\n- state: FocusScopeState,\n-): void {\n- const elements = context.getFocusableElementsInScope();\n- const length = elements.length;\n- if (elements.length > 0) {\n- const lastElement = elements[length - 1];\n- lastElement.focus();\n- state.currentFocusedNode = lastElement;\n }\n }\n \n const FocusScopeResponder = {\n+ targetEventTypes,\n rootEventTypes,\n createInitialState(): FocusScopeState {\n return {\n@@ -62,70 +47,100 @@ const FocusScopeResponder = {\n currentFocusedNode: null,\n };\n },\n- onRootEvent(\n+ onEvent(\n event: ReactResponderEvent,\n context: ReactResponderContext,\n props: FocusScopeProps,\n state: FocusScopeState,\n ) {\n- const {type, target, nativeEvent} = event;\n+ const {type, nativeEvent} = event;\n+ const hasOwnership =\n+ context.hasOwnership() || context.requestResponderOwnership();\n \n- if (type === 'focus') {\n- if (context.isTargetWithinEventComponent(target)) {\n- state.currentFocusedNode = ((target: any): HTMLElement);\n- } else if (props.trap) {\n- if (state.currentFocusedNode !== null) {\n- state.currentFocusedNode.focus();\n- } else {\n- focusFirstChildEventTarget(context, state);\n- }\n- }\n- } else if (type === 'keydown' && nativeEvent.key === 'Tab') {\n- const currentFocusedNode = state.currentFocusedNode;\n- if (currentFocusedNode !== null) {\n+ if (!hasOwnership) {\n+ return;\n+ }\n+ if (type === 'keydown' && nativeEvent.key === 'Tab') {\n+ const focusedElement = context.getActiveDocument().activeElement;\n+ if (\n+ focusedElement !== null &&\n+ context.isTargetWithinEventComponent(focusedElement)\n+ ) {\n const {altkey, ctrlKey, metaKey, shiftKey} = (nativeEvent: any);\n \/\/ Skip if any of these keys are being pressed\n if (altkey || ctrlKey || metaKey) {\n return;\n }\n const elements = context.getFocusableElementsInScope();\n- const position = elements.indexOf(currentFocusedNode);\n+ const position = elements.indexOf(focusedElement);\n+ const lastPosition = elements.length - 1;\n+ let nextElement = null;\n+\n if (shiftKey) {\n if (position === 0) {\n if (props.trap) {\n- focusLastChildEventTarget(context, state);\n+ nextElement = elements[lastPosition];\n } else {\n+ \/\/ Out of bounds\n+ context.releaseOwnership();\n return;\n }\n } else {\n- const previousElement = elements[position - 1];\n- previousElement.focus();\n- state.currentFocusedNode = previousElement;\n+ nextElement = elements[position - 1];\n }\n } else {\n- if (position === elements.length - 1) {\n+ if (position === lastPosition) {\n if (props.trap) {\n- focusFirstChildEventTarget(context, state);\n+ nextElement = elements[0];\n } else {\n+ \/\/ Out of bounds\n+ context.releaseOwnership();\n return;\n }\n } else {\n- const nextElement = elements[position + 1];\n- nextElement.focus();\n- state.currentFocusedNode = nextElement;\n+ nextElement = elements[position + 1];\n+ }\n+ }\n+ \/\/ If this element is possibly inside the scope of another\n+ \/\/ FocusScope responder or is out of bounds, then we release ownership.\n+ if (nextElement !== null) {\n+ if (!context.isTargetWithinEventResponderScope(nextElement)) {\n+ context.releaseOwnership();\n }\n+ nextElement.focus();\n+ state.currentFocusedNode = nextElement;\n+ ((nativeEvent: any): KeyboardEvent).preventDefault();\n }\n- ((nativeEvent: any): KeyboardEvent).preventDefault();\n }\n }\n },\n- onMount(\n+ onRootEvent(\n+ event: ReactResponderEvent,\n context: ReactResponderContext,\n props: FocusScopeProps,\n state: FocusScopeState,\n ) {\n+ const {target} = event;\n+\n+ \/\/ Handle global trapping\n+ if (props.trap) {\n+ if (!context.isTargetWithinEventComponent(target)) {\n+ const currentFocusedNode = state.currentFocusedNode;\n+ if (currentFocusedNode !== null) {\n+ currentFocusedNode.focus();\n+ } else if (props.autoFocus) {\n+ focusFirstChildEventTarget(context, state);\n+ }\n+ }\n+ }\n+ },\n+ onMount(\n+ context: ReactResponderContext,\n+ props: FocusScopeProps,\n+ state: FocusScopeState,\n+ ): void {\n if (props.restoreFocus) {\n- state.nodeToRestore = document.activeElement;\n+ state.nodeToRestore = context.getActiveDocument().activeElement;\n }\n if (props.autoFocus) {\n focusFirstChildEventTarget(context, state);\n@@ -135,8 +150,12 @@ const FocusScopeResponder = {\n context: ReactResponderContext,\n props: FocusScopeProps,\n state: FocusScopeState,\n- ) {\n- if (props.restoreFocus && state.nodeToRestore !== null) {\n+ ): void {\n+ if (\n+ props.restoreFocus &&\n+ state.nodeToRestore !== null &&\n+ context.hasOwnership()\n+ ) {\n state.nodeToRestore.focus();\n }\n },\n@@ -144,8 +163,10 @@ const FocusScopeResponder = {\n context: ReactResponderContext,\n props: FocusScopeProps,\n state: FocusScopeState,\n- ) {\n- \/\/ unmountResponder(context, props, state);\n+ ): void {\n+ if (!context.hasOwnership()) {\n+ state.currentFocusedNode = null;\n+ }\n },\n };\n \ndiff --git a\/packages\/react-events\/src\/Press.js b\/packages\/react-events\/src\/Press.js\nindex 4b5dfcd623..c96c1aae03 100644\n--- a\/packages\/react-events\/src\/Press.js\n+++ b\/packages\/react-events\/src\/Press.js\n@@ -472,7 +472,7 @@ const PressResponder = {\n state.pressTarget = target;\n state.isPressWithinResponderRegion = true;\n dispatchPressStartEvents(context, props, state);\n- context.addRootEventTypes(target.ownerDocument, rootEventTypes);\n+ context.addRootEventTypes(rootEventTypes);\n } else {\n \/\/ Prevent spacebar press from scrolling the window\n if (isValidKeyPress(nativeEvent.key) && nativeEvent.key === ' ') {\ndiff --git a\/packages\/react-events\/src\/Swipe.js b\/packages\/react-events\/src\/Swipe.js\nindex 404a92f162..a44b70efc9 100644\n--- a\/packages\/react-events\/src\/Swipe.js\n+++ b\/packages\/react-events\/src\/Swipe.js\n@@ -120,7 +120,7 @@ const SwipeResponder = {\n let shouldEnableSwiping = true;\n \n if (props.onShouldClaimOwnership && props.onShouldClaimOwnership()) {\n- shouldEnableSwiping = context.requestOwnership();\n+ shouldEnableSwiping = context.requestGlobalOwnership();\n }\n if (shouldEnableSwiping) {\n state.isSwiping = true;\n@@ -129,7 +129,7 @@ const SwipeResponder = {\n state.x = x;\n state.y = y;\n state.swipeTarget = target;\n- context.addRootEventTypes(target.ownerDocument, rootEventTypes);\n+ context.addRootEventTypes(rootEventTypes);\n } else {\n state.touchId = null;\n }\ndiff --git a\/packages\/react-events\/src\/__tests__\/Drag-test.internal.js b\/packages\/react-events\/src\/__tests__\/Drag-test.internal.js\nindex 96196242c8..e65a564018 100644\n--- a\/packages\/react-events\/src\/__tests__\/Drag-test.internal.js\n+++ b\/packages\/react-events\/src\/__tests__\/Drag-test.internal.js\n@@ -29,6 +29,7 @@ describe('Drag event responder', () => {\n });\n \n afterEach(() => {\n+ ReactDOM.render(null, container);\n document.body.removeChild(container);\n container = null;\n });\ndiff --git a\/packages\/react-events\/src\/__tests__\/Focus-test.internal.js b\/packages\/react-events\/src\/__tests__\/Focus-test.internal.js\nindex 821cbc1acd..5c8f678947 100644\n--- a\/packages\/react-events\/src\/__tests__\/Focus-test.internal.js\n+++ b\/packages\/react-events\/src\/__tests__\/Focus-test.internal.js\n@@ -36,6 +36,7 @@ describe('Focus event responder', () => {\n });\n \n afterEach(() => {\n+ ReactDOM.render(null, container);\n document.body.removeChild(container);\n container = null;\n });\ndiff --git a\/packages\/react-events\/src\/__tests__\/FocusScope-test.internal.js b\/packages\/react-events\/src\/__tests__\/FocusScope-test.internal.js\nindex 665cd11c3f..673246269a 100644\n--- a\/packages\/react-events\/src\/__tests__\/FocusScope-test.internal.js\n+++ b\/packages\/react-events\/src\/__tests__\/FocusScope-test.internal.js\n@@ -49,11 +49,12 @@ describe('FocusScope event responder', () => {\n });\n \n afterEach(() => {\n+ ReactDOM.render(null, container);\n document.body.removeChild(container);\n container = null;\n });\n \n- it('when using a simple focus scope with autofocus', () => {\n+ it('should work as expected with autofocus', () => {\n const inputRef = React.createRef();\n const input2Ref = React.createRef();\n const buttonRef = React.createRef();\n@@ -74,17 +75,17 @@ describe('FocusScope event responder', () => {\n \n ReactDOM.render(, container);\n expect(document.activeElement).toBe(inputRef.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(buttonRef.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(divRef.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(butto2nRef.current);\n- document.dispatchEvent(createTabBackward());\n+ document.activeElement.dispatchEvent(createTabBackward());\n expect(document.activeElement).toBe(divRef.current);\n });\n \n- it('when using a simple focus scope with autofocus and trapping', () => {\n+ it('should work as expected with autofocus and trapping', () => {\n const inputRef = React.createRef();\n const input2Ref = React.createRef();\n const buttonRef = React.createRef();\n@@ -103,15 +104,91 @@ describe('FocusScope event responder', () => {\n \n ReactDOM.render(, container);\n expect(document.activeElement).toBe(buttonRef.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(button2Ref.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(buttonRef.current);\n- document.dispatchEvent(createTabForward());\n+ document.activeElement.dispatchEvent(createTabForward());\n expect(document.activeElement).toBe(button2Ref.current);\n- document.dispatchEvent(createTabBackward());\n+ document.activeElement.dispatchEvent(createTabBackward());\n expect(document.activeElement).toBe(buttonRef.current);\n- document.dispatchEvent(createTabBackward());\n+ document.activeElement.dispatchEvent(createTabBackward());\n+ expect(document.activeElement).toBe(button2Ref.current);\n+ });\n+\n+ it('should work as expected when nested', () => {\n+ const inputRef = React.createRef();\n+ const input2Ref = React.createRef();\n+ const buttonRef = React.createRef();\n+ const button2Ref = React.createRef();\n+ const button3Ref = React.createRef();\n+ const button4Ref = React.createRef();\n+\n+ const SimpleFocusScope = () => (\n+

\n+ \n+ \n+

dillon1000/react

Files changed