From 7f38a162515435977889edba94c0b0d36751970e Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Wed, 4 Dec 2024 17:25:17 -0800
Subject: [PATCH 1/4] Fix Android talkback focus cusor movement when inside
 contain FocusScopes (e.g. Dialogs)

---
 packages/@react-aria/focus/src/FocusScope.tsx              | 5 ++---
 packages/@react-spectrum/dialog/stories/Dialog.stories.tsx | 2 +-
 packages/@react-spectrum/menu/test/MenuTrigger.test.js     | 1 -
 3 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/@react-aria/focus/src/FocusScope.tsx b/packages/@react-aria/focus/src/FocusScope.tsx
index f48af3ff981..e0480fe1943 100644
--- a/packages/@react-aria/focus/src/FocusScope.tsx
+++ b/packages/@react-aria/focus/src/FocusScope.tsx
@@ -376,13 +376,12 @@ function useFocusContainment(scopeRef: RefObject<Element[] | null>, contain?: bo
     };
 
     let onBlur = (e) => {
-      // Firefox doesn't shift focus back to the Dialog properly without this
+      // Use raf to delay long enough that subdialogs will fully unmount and not move focus away from parent menu's hovered item that triggered the close
       if (raf.current) {
         cancelAnimationFrame(raf.current);
       }
       raf.current = requestAnimationFrame(() => {
-        // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
-        if (ownerDocument.activeElement && shouldContainFocus(scopeRef) && !isElementInChildScope(ownerDocument.activeElement, scopeRef)) {
+        if (e.relatedTarget && shouldContainFocus(scopeRef) && !isElementInChildScope(e.relatedTarget, scopeRef)) {
           activeScope = scopeRef;
           if (ownerDocument.body.contains(e.target)) {
             focusedNode.current = e.target;
diff --git a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
index 05fac03bfc5..c7e68815419 100644
--- a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
+++ b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
@@ -171,7 +171,7 @@ function renderIframe({width = 'auto', isDismissable = undefined, ...props}) {
             <Header>The Header</Header>
             <Divider />
             <Content>
-              <iframe width="100%" title="wikipedia" src="https://wikipedia.org/wiki/Main_Page" />
+              <iframe width="100%" tabIndex={-1} title="textfield iframe" src="iframe.html?providerSwitcher-express=false&providerSwitcher-toastPosition=bottom&viewMode=story&id=textfield--default" />
             </Content>
             {!isDismissable &&
               <ButtonGroup>
diff --git a/packages/@react-spectrum/menu/test/MenuTrigger.test.js b/packages/@react-spectrum/menu/test/MenuTrigger.test.js
index c176f504f3a..858c3b6d44d 100644
--- a/packages/@react-spectrum/menu/test/MenuTrigger.test.js
+++ b/packages/@react-spectrum/menu/test/MenuTrigger.test.js
@@ -1123,4 +1123,3 @@ AriaMenuTests({
     )
   }
 });
-

From 9082f1002bcb4e8a94152afe4efb239f8a8b0398 Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Tue, 17 Dec 2024 13:16:07 -0800
Subject: [PATCH 2/4] remove tab index to fix story behavior

---
 packages/@react-spectrum/dialog/stories/Dialog.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
index c7e68815419..f411c8b41e0 100644
--- a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
+++ b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
@@ -171,7 +171,7 @@ function renderIframe({width = 'auto', isDismissable = undefined, ...props}) {
             <Header>The Header</Header>
             <Divider />
             <Content>
-              <iframe width="100%" tabIndex={-1} title="textfield iframe" src="iframe.html?providerSwitcher-express=false&providerSwitcher-toastPosition=bottom&viewMode=story&id=textfield--default" />
+              <iframe width="100%" title="textfield iframe" src="iframe.html?providerSwitcher-express=false&providerSwitcher-toastPosition=bottom&viewMode=story&id=textfield--default" />
             </Content>
             {!isDismissable &&
               <ButtonGroup>

From d4cdc75bed36e7cc762511943113821f3c3188df Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Tue, 17 Dec 2024 13:33:57 -0800
Subject: [PATCH 3/4] go back to wikipedia because it works both inside and
 outside the storybook iframe

---
 packages/@react-spectrum/dialog/stories/Dialog.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
index f411c8b41e0..05fac03bfc5 100644
--- a/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
+++ b/packages/@react-spectrum/dialog/stories/Dialog.stories.tsx
@@ -171,7 +171,7 @@ function renderIframe({width = 'auto', isDismissable = undefined, ...props}) {
             <Header>The Header</Header>
             <Divider />
             <Content>
-              <iframe width="100%" title="textfield iframe" src="iframe.html?providerSwitcher-express=false&providerSwitcher-toastPosition=bottom&viewMode=story&id=textfield--default" />
+              <iframe width="100%" title="wikipedia" src="https://wikipedia.org/wiki/Main_Page" />
             </Content>
             {!isDismissable &&
               <ButtonGroup>

From d86923ad1a97a9ab7e8dd398e64e5349f1657ec9 Mon Sep 17 00:00:00 2001
From: Daniel Lu <dl1644@gmail.com>
Date: Thu, 19 Dec 2024 10:40:07 -0800
Subject: [PATCH 4/4] Temporary patch for Chrome Android

---
 packages/@react-aria/focus/src/FocusScope.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/@react-aria/focus/src/FocusScope.tsx b/packages/@react-aria/focus/src/FocusScope.tsx
index e0480fe1943..f955e9c8995 100644
--- a/packages/@react-aria/focus/src/FocusScope.tsx
+++ b/packages/@react-aria/focus/src/FocusScope.tsx
@@ -12,7 +12,8 @@
 
 import {FocusableElement, RefObject} from '@react-types/shared';
 import {focusSafely} from './focusSafely';
-import {getOwnerDocument, useLayoutEffect} from '@react-aria/utils';
+import {getInteractionModality} from '@react-aria/interactions';
+import {getOwnerDocument, isAndroid, isChrome, useLayoutEffect} from '@react-aria/utils';
 import {isElementVisible} from './isElementVisible';
 import React, {ReactNode, useContext, useEffect, useMemo, useRef} from 'react';
 
@@ -376,12 +377,19 @@ function useFocusContainment(scopeRef: RefObject<Element[] | null>, contain?: bo
     };
 
     let onBlur = (e) => {
-      // Use raf to delay long enough that subdialogs will fully unmount and not move focus away from parent menu's hovered item that triggered the close
+      // Firefox doesn't shift focus back to the Dialog properly without this
       if (raf.current) {
         cancelAnimationFrame(raf.current);
       }
       raf.current = requestAnimationFrame(() => {
-        if (e.relatedTarget && shouldContainFocus(scopeRef) && !isElementInChildScope(e.relatedTarget, scopeRef)) {
+        // Patches infinite focus coersion loop for Android Talkback where the user isn't able to move the virtual cursor
+        // if within a containing focus scope. Bug filed against Chrome: https://issuetracker.google.com/issues/384844019.
+        // Note that this means focus can leave focus containing modals due to this, but it is isolated to Chrome Talkback.
+        let modality = getInteractionModality();
+        let shouldSkipFocusRestore = (modality === 'virtual' || modality === null) && isAndroid() && isChrome();
+
+        // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
+        if (!shouldSkipFocusRestore && ownerDocument.activeElement && shouldContainFocus(scopeRef) && !isElementInChildScope(ownerDocument.activeElement, scopeRef)) {
           activeScope = scopeRef;
           if (ownerDocument.body.contains(e.target)) {
             focusedNode.current = e.target;