add visibility change perf metrics event

facebookexperimental · May 29, 2024 · 18379f4 · 18379f4
1 parent bf5ec69
commit 18379f4
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 1 deletion.
diff --git a/front_end/core/host/RNPerfMetrics.ts b/front_end/core/host/RNPerfMetrics.ts
@@ -83,6 +83,15 @@ class RNPerfMetrics {
     });
   }
 
+  browserVisibilityChanged(visibilityState: BrowserVisibilityChangeEvent['params']['visibilityState']): void {
+    this.sendEvent({
+      eventName: 'Browser.VisibilityChange',
+      params: {
+        visibilityState,
+      }
+    });
+  }
+
   #decorateEvent(event: ReactNativeChromeDevToolsEvent): Readonly<DecoratedReactNativeChromeDevToolsEvent> {
     const commonFields: CommonEventFields = {
       timestamp: getPerfTimestamp(),
@@ -121,7 +130,14 @@ export type DebuggerReadyEvent = Readonly<{
   eventName: 'Debugger.IsReadyToPause',
 }>;
 
+export type BrowserVisibilityChangeEvent = Readonly<{
+  eventName: 'Browser.VisibilityChange',
+  params: Readonly<{
+    visibilityState: 'hidden' | 'visible',
+  }>,
+}>;
+
 export type ReactNativeChromeDevToolsEvent =
-    EntrypointLoadingStartedEvent|EntrypointLoadingFinishedEvent|DebuggerReadyEvent;
+    EntrypointLoadingStartedEvent|EntrypointLoadingFinishedEvent|DebuggerReadyEvent|BrowserVisibilityChangeEvent;
 
 export type DecoratedReactNativeChromeDevToolsEvent = CommonEventFields&ReactNativeChromeDevToolsEvent;
diff --git a/front_end/entrypoints/rn_fusebox/rn_fusebox.ts b/front_end/entrypoints/rn_fusebox/rn_fusebox.ts
@@ -74,6 +74,10 @@ RNExperiments.RNExperimentsImpl.Instance.enableExperimentsByDefault([
   Root.Runtime.ExperimentName.REACT_NATIVE_SPECIFIC_UI,
 ]);
 
+document.addEventListener('visibilitychange', () => {
+  Host.rnPerfMetrics.browserVisibilityChanged(document.visibilityState);
+});
+
 class FuseboxClientMetadataModel extends SDK.SDKModel.SDKModel<void> {
   constructor(target: SDK.Target.Target) {
     super(target);