[internal] add feature flag to fix event handle API in Activity

packages/react-reconciler/src/ReactFiberCommitWork.js

@@ -47,6 +47,7 @@ import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
 import {
   alwaysThrottleRetries,
   enableCreateEventHandleAPI,
+  enableEventAPIActivityFix,
   enableHiddenSubtreeInsertionEffectCleanup,
   enableProfilerTimer,
   enableProfilerCommitHooks,
@@ -482,7 +483,6 @@ function commitBeforeMutationEffectsOnFiber(
     if (!shouldFireAfterActiveInstanceBlur && focusedInstanceHandle !== null) {
       // Check to see if the focused element was inside of a hidden (Suspense) subtree.
       // TODO: Move this out of the hot path using a dedicated effect tag.
-      // TODO: This should consider Offscreen in general and not just SuspenseComponent.
       if (
         finishedWork.tag === SuspenseComponent &&
         isSuspenseBoundaryBeingHidden(current, finishedWork) &&
@@ -492,6 +492,21 @@ function commitBeforeMutationEffectsOnFiber(
         shouldFireAfterActiveInstanceBlur = true;
         beforeActiveInstanceBlur(finishedWork);
       }
+
+      // Check if an OffscreenComponent (Activity) is being hidden with focus inside.
+      if (enableEventAPIActivityFix) {
+        if (
+          finishedWork.tag === OffscreenComponent &&
+          current !== null &&
+          current.memoizedState === null && // was visible
+          finishedWork.memoizedState !== null && // now hidden
+          // $FlowFixMe[incompatible-call] found when upgrading Flow
+          doesFiberContain(finishedWork, focusedInstanceHandle)
+        ) {
+          shouldFireAfterActiveInstanceBlur = true;
+          beforeActiveInstanceBlur(finishedWork);
+        }
+      }
     }
   }
 

packages/shared/ReactFeatureFlags.js

@@ -57,6 +57,9 @@ export const enableScopeAPI: boolean = false;
 // Experimental Create Event Handle API.
 export const enableCreateEventHandleAPI: boolean = false;
 
+// Fix for Activity blur events in the Event Handle API.
+export const enableEventAPIActivityFix: boolean = false;
+
 // Support legacy Primer support on internal FB www
 export const enableLegacyFBSupport: boolean = false;
 

packages/shared/forks/ReactFeatureFlags.native-fb.js

@@ -43,6 +43,7 @@ export const enableAsyncDebugInfo: boolean = false;
 export const enableAsyncIterableChildren: boolean = false;
 export const enableCPUSuspense: boolean = true;
 export const enableCreateEventHandleAPI: boolean = false;
+export const enableEventAPIActivityFix: boolean = false;
 export const enableMoveBefore: boolean = true;
 export const enableFizzExternalRuntime: boolean = true;
 export const enableHalt: boolean = true;

packages/shared/forks/ReactFeatureFlags.native-oss.js

@@ -28,6 +28,7 @@ export const enableAsyncDebugInfo: boolean = false;
 export const enableAsyncIterableChildren: boolean = false;
 export const enableCPUSuspense: boolean = false;
 export const enableCreateEventHandleAPI: boolean = false;
+export const enableEventAPIActivityFix: boolean = false;
 export const enableMoveBefore: boolean = true;
 export const enableFizzExternalRuntime: boolean = true;
 export const enableHalt: boolean = true;

packages/shared/forks/ReactFeatureFlags.test-renderer.js

@@ -26,6 +26,7 @@ export const disableCommentsAsDOMContainers: boolean = true;
 export const disableInputAttributeSyncing: boolean = false;
 export const enableScopeAPI: boolean = false;
 export const enableCreateEventHandleAPI: boolean = false;
+export const enableEventAPIActivityFix: boolean = false;
 export const enableSuspenseCallback: boolean = false;
 export const enableTrustedTypesIntegration: boolean = false;
 export const disableTextareaChildren: boolean = false;

packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js

@@ -23,6 +23,7 @@ export const enableAsyncDebugInfo = false;
 export const enableAsyncIterableChildren = false;
 export const enableCPUSuspense = true;
 export const enableCreateEventHandleAPI = false;
+export const enableEventAPIActivityFix = false;
 export const enableMoveBefore = false;
 export const enableFizzExternalRuntime = true;
 export const enableHalt = true;

packages/shared/forks/ReactFeatureFlags.test-renderer.www.js

@@ -26,6 +26,7 @@ export const disableCommentsAsDOMContainers: boolean = true;
 export const disableInputAttributeSyncing: boolean = false;
 export const enableScopeAPI: boolean = true;
 export const enableCreateEventHandleAPI: boolean = false;
+export const enableEventAPIActivityFix: boolean = false;
 export const enableSuspenseCallback: boolean = true;
 export const disableLegacyContext: boolean = false;
 export const disableLegacyContextForFunctionComponents: boolean = false;

packages/shared/forks/ReactFeatureFlags.www-dynamic.js

@@ -39,6 +39,7 @@ export const enableFragmentRefsScrollIntoView: boolean = __VARIANT__;
 export const enableAsyncDebugInfo: boolean = __VARIANT__;
 
 export const enableInternalInstanceMap: boolean = __VARIANT__;
+export const enableEventAPIActivityFix: boolean = __VARIANT__;
 
 // TODO: These flags are hard-coded to the default values used in open source.
 // Update the tests so that they pass in either mode, then set these

packages/shared/forks/ReactFeatureFlags.www.js

@@ -18,6 +18,7 @@ export const {
   alwaysThrottleRetries,
   disableLegacyContextForFunctionComponents,
   disableSchedulerTimeoutInWorkLoop,
+  enableEventAPIActivityFix,
   enableHiddenSubtreeInsertionEffectCleanup,
   enableInfiniteRenderLoopDetection,
   enableNoCloningMemoCache,