From 9e916c21b530122efe2a4b00c53a70854b5e650f Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Thu, 13 Nov 2025 16:44:39 +0000
Subject: [PATCH 01/19] [DevTools] hotkey to start/stop profiling

---
 .../src/devtools/views/Profiler/Profiler.js   | 36 +++++++++++++++++--
 .../devtools/views/Profiler/RecordToggle.js   |  6 +++-
 2 files changed, 39 insertions(+), 3 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
index 4ac55b46f0e..11875c5335a 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
@@ -8,7 +8,7 @@
  */
 
 import * as React from 'react';
-import {Fragment, useContext} from 'react';
+import {Fragment, useContext, useEffect, useRef} from 'react';
 import {ModalDialog} from '../ModalDialog';
 import {ProfilerContext} from './ProfilerContext';
 import TabBar from '../TabBar';
@@ -38,6 +38,8 @@ import {TimelineContext} from 'react-devtools-timeline/src/TimelineContext';
 import styles from './Profiler.css';
 
 function Profiler(_: {}) {
+  const profilerRef = useRef<HTMLDivElement | null>(null);
+
   const {
     didRecordCommits,
     isProcessingData,
@@ -47,6 +49,8 @@ function Profiler(_: {}) {
     selectedTabID,
     selectTab,
     supportsProfiling,
+    startProfiling,
+    stopProfiling,
   } = useContext(ProfilerContext);
 
   const {file: timelineTraceEventData, searchInputContainerRef} =
@@ -56,6 +60,34 @@ function Profiler(_: {}) {
 
   const isLegacyProfilerSelected = selectedTabID !== 'timeline';
 
+  // Cmd+E to start/stop profiler recording
+  useEffect(() => {
+    const div = profilerRef.current;
+    if (div === null) {
+      return;
+    }
+
+    const ownerWindow = div.ownerDocument.defaultView;
+    const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+    const handleKeyDown = (event: KeyboardEvent) => {
+      const correctModifier = isMac ? event.metaKey : event.ctrlKey;
+      if (correctModifier && event.key === 'e') {
+        if (isProfiling) {
+          stopProfiling();
+        } else {
+          startProfiling();
+        }
+        event.preventDefault();
+        event.stopPropagation();
+      }
+    };
+
+    ownerWindow.addEventListener('keydown', handleKeyDown);
+    return () => {
+      ownerWindow.removeEventListener('keydown', handleKeyDown);
+    };
+  }, [isProfiling, startProfiling, stopProfiling]);
+
   let view = null;
   if (didRecordCommits || selectedTabID === 'timeline') {
     switch (selectedTabID) {
@@ -112,7 +144,7 @@ function Profiler(_: {}) {
 
   return (
     <SettingsModalContextController>
-      <div className={styles.Profiler}>
+      <div ref={profilerRef} className={styles.Profiler}>
         <div className={styles.LeftColumn}>
           <div className={styles.Toolbar}>
             <RecordToggle disabled={!supportsProfiling} />
diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
index 7e79df9e081..48bd2b0d7ae 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
@@ -30,13 +30,17 @@ export default function RecordToggle({disabled}: Props): React.Node {
     className = styles.ActiveRecordToggle;
   }
 
+  const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+  const shortcut = isMac ? '⌘E' : 'Ctrl+E';
+  const title = isProfiling ? `Stop profiling - ${shortcut}` : `Start profiling - ${shortcut}`;
+
   return (
     <Button
       className={className}
       disabled={disabled}
       onClick={isProfiling ? stopProfiling : startProfiling}
       testName="ProfilerToggleButton"
-      title={isProfiling ? 'Stop profiling' : 'Start profiling'}>
+      title={title}>
       <ButtonIcon type="record" />
     </Button>
   );

From 138fb2c1623bb89c4f7e63d457dc0e35796302d7 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Mon, 17 Nov 2025 15:09:40 +0000
Subject: [PATCH 02/19] Fixed linting issue

---
 .../src/devtools/views/Profiler/RecordToggle.js               | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
index 48bd2b0d7ae..f9a63ff301b 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
@@ -32,7 +32,9 @@ export default function RecordToggle({disabled}: Props): React.Node {
 
   const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
   const shortcut = isMac ? '⌘E' : 'Ctrl+E';
-  const title = isProfiling ? `Stop profiling - ${shortcut}` : `Start profiling - ${shortcut}`;
+  const title = isProfiling
+    ? `Stop profiling - ${shortcut}`
+    : `Start profiling - ${shortcut}`;
 
   return (
     <Button

From 144b936687a3753ecc377e05b63b1202239c70fd Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Mon, 17 Nov 2025 17:14:53 +0000
Subject: [PATCH 03/19] use useEffectEvent to avoid unneccessary resubscription

---
 .../src/devtools/views/Profiler/Profiler.js   | 31 +++++++++----------
 .../devtools/views/Profiler/RecordToggle.js   |  4 +--
 2 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
index 11875c5335a..6e11a59e000 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
@@ -39,6 +39,7 @@ import styles from './Profiler.css';
 
 function Profiler(_: {}) {
   const profilerRef = useRef<HTMLDivElement | null>(null);
+  const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
 
   const {
     didRecordCommits,
@@ -61,32 +62,30 @@ function Profiler(_: {}) {
   const isLegacyProfilerSelected = selectedTabID !== 'timeline';
 
   // Cmd+E to start/stop profiler recording
+  const handleKeyDown = useEffectEvent((event: KeyboardEvent) => {
+    const correctModifier = isMac ? event.metaKey : event.ctrlKey;
+    if (correctModifier && event.key === 'e') {
+      if (isProfiling) {
+        stopProfiling();
+      } else {
+        startProfiling();
+      }
+      event.preventDefault();
+      event.stopPropagation();
+    }
+  });
+
   useEffect(() => {
     const div = profilerRef.current;
     if (div === null) {
       return;
     }
-
     const ownerWindow = div.ownerDocument.defaultView;
-    const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
-    const handleKeyDown = (event: KeyboardEvent) => {
-      const correctModifier = isMac ? event.metaKey : event.ctrlKey;
-      if (correctModifier && event.key === 'e') {
-        if (isProfiling) {
-          stopProfiling();
-        } else {
-          startProfiling();
-        }
-        event.preventDefault();
-        event.stopPropagation();
-      }
-    };
-
     ownerWindow.addEventListener('keydown', handleKeyDown);
     return () => {
       ownerWindow.removeEventListener('keydown', handleKeyDown);
     };
-  }, [isProfiling, startProfiling, stopProfiling]);
+  }, []);
 
   let view = null;
   if (didRecordCommits || selectedTabID === 'timeline') {
diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
index f9a63ff301b..887a4b0708d 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
@@ -32,9 +32,7 @@ export default function RecordToggle({disabled}: Props): React.Node {
 
   const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
   const shortcut = isMac ? '⌘E' : 'Ctrl+E';
-  const title = isProfiling
-    ? `Stop profiling - ${shortcut}`
-    : `Start profiling - ${shortcut}`;
+  const title = `${isProfiling ? 'Stop' : 'Start'} profiling - ${shortcut}`;
 
   return (
     <Button

From 344d8a595f4f39f92a67388ce42ba0f0a706a2aa Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Wed, 19 Nov 2025 10:37:18 +0000
Subject: [PATCH 04/19] changed strict equality check to abstract

---
 .../src/devtools/views/Profiler/Profiler.js                     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
index 6e11a59e000..5f403547294 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
@@ -77,7 +77,7 @@ function Profiler(_: {}) {
 
   useEffect(() => {
     const div = profilerRef.current;
-    if (div === null) {
+    if (!div) {
       return;
     }
     const ownerWindow = div.ownerDocument.defaultView;

From a793da8080df7fbb209cb322df34799eca0af73a Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Wed, 19 Nov 2025 11:04:41 +0000
Subject: [PATCH 05/19] add check navigator variable is defined before use

---
 .../src/devtools/views/Profiler/RecordToggle.js               | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
index 887a4b0708d..6aa48a3cefa 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js
@@ -30,7 +30,9 @@ export default function RecordToggle({disabled}: Props): React.Node {
     className = styles.ActiveRecordToggle;
   }
 
-  const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+  const isMac =
+    typeof navigator !== 'undefined' &&
+    navigator.platform.toUpperCase().indexOf('MAC') >= 0;
   const shortcut = isMac ? '⌘E' : 'Ctrl+E';
   const title = `${isProfiling ? 'Stop' : 'Start'} profiling - ${shortcut}`;
 

From fa8526a9852a266939db6d416f7cd952896c4cfb Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Wed, 19 Nov 2025 11:06:58 +0000
Subject: [PATCH 06/19] fixed imports

---
 .../src/devtools/views/Profiler/Profiler.js                     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
index 5f403547294..8761746363a 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
@@ -8,7 +8,7 @@
  */
 
 import * as React from 'react';
-import {Fragment, useContext, useEffect, useRef} from 'react';
+import {Fragment, useContext, useEffect, useRef, useEffectEvent} from 'react';
 import {ModalDialog} from '../ModalDialog';
 import {ProfilerContext} from './ProfilerContext';
 import TabBar from '../TabBar';

From fde4bffbdfaa522554cab5ec4f267c9a82334c25 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Wed, 19 Nov 2025 11:22:47 +0000
Subject: [PATCH 07/19] Check if navigator is defined in profiler

---
 .../src/devtools/views/Profiler/Profiler.js                   | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
index 8761746363a..5e330637fd9 100644
--- a/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
+++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js
@@ -39,7 +39,9 @@ import styles from './Profiler.css';
 
 function Profiler(_: {}) {
   const profilerRef = useRef<HTMLDivElement | null>(null);
-  const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+  const isMac =
+    typeof navigator !== 'undefined' &&
+    navigator.platform.toUpperCase().indexOf('MAC') >= 0;
 
   const {
     didRecordCommits,

From d4f533a8789451de8baf73072e6f5e1b63fdb5c1 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 12:42:46 +0000
Subject: [PATCH 08/19] Test for the hotkey to toggle profiling

---
 .../src/__tests__/profilerContext-test.js     | 89 +++++++++++++++++++
 1 file changed, 89 insertions(+)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index 9a9bb14c0ba..d0fc09b59a4 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -584,4 +584,93 @@ describe('ProfilerContext', () => {
     await utils.actAsync(() => context.selectFiber(childID, 'Child'));
     expect(inspectedElementID).toBe(parentID);
   });
+
+  it('should toggle profiling when the keyboard shortcut is pressed', async () => {
+    // Use real timers for this test to avoid conflicts with Timeline's setInterval
+    jest.useRealTimers();
+
+    // Conetext providers
+    const Profiler = require('react-devtools-shared/src/devtools/views/Profiler/Profiler').default;
+    const {TimelineContextController} = require('react-devtools-timeline/src/TimelineContext');
+    const {SettingsContextController} = require('react-devtools-shared/src/devtools/views/Settings/SettingsContext');
+    const {ModalDialogContextController} = require('react-devtools-shared/src/devtools/views/ModalDialog');
+
+    // need a dom component for profiling to be enabled
+    const Component = () => null;
+    utils.act(() => render(<Component />));
+
+    const profilerContainer = document.createElement('div');
+    document.body.appendChild(profilerContainer);
+
+    // Create a root for the profiler
+    const ReactDOMClient = require('react-dom/client');
+    const profilerRoot = ReactDOMClient.createRoot(profilerContainer);
+
+    try {
+      // Render the profiler - use React.act to ensure render completes
+      React.act(() => {
+        profilerRoot.render(
+          <Contexts>
+            <SettingsContextController browserTheme="light">
+              <ModalDialogContextController>
+                <TimelineContextController>
+                  <Profiler />
+                </TimelineContextController>
+              </ModalDialogContextController>
+            </SettingsContextController>
+          </Contexts>
+        );
+      });
+
+      // Wait for any async effects to complete
+      await new Promise(resolve => setTimeout(resolve, 100));
+
+      // Verify that the profiler is not profiling.
+      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
+
+      // Trigger the keyboard shortcut.
+      const ownerWindow = profilerContainer.ownerDocument.defaultView;
+      const isMac =
+        typeof navigator !== 'undefined' &&
+        navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+
+      const keyEvent = new KeyboardEvent('keydown', {
+        key: 'e',
+        metaKey: isMac,
+        ctrlKey: !isMac,
+        bubbles: true,
+      });
+
+      // Helper to wait for profiling state to change
+      const waitForProfilingState = async (expectedState, timeoutMs = 1000) => {
+        const startTime = Date.now();
+        while (store.profilerStore.isProfilingBasedOnUserInput !== expectedState) {
+          if (Date.now() - startTime > timeoutMs) {
+            throw new Error(
+              `Timeout waiting for profiling to be ${expectedState}. ` +
+              `Current state: ${store.profilerStore.isProfilingBasedOnUserInput}`
+            );
+          }
+          await new Promise(resolve => setTimeout(resolve, 10));
+        }
+      };
+
+      // Dispatch keyboard event to toggle profiling on
+      ownerWindow.dispatchEvent(keyEvent);
+      await waitForProfilingState(true);
+
+      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(true);
+
+      // Dispatch keyboard event to toggle profiling off
+      ownerWindow.dispatchEvent(keyEvent);
+      await waitForProfilingState(false);
+
+      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
+
+      document.body.removeChild(profilerContainer);
+    } finally {
+      // Restore fake timers for other tests
+      jest.useFakeTimers();
+    }
+  });
 });

From 9e756afb5f59c172b1d4b7f5ed6e247c4bf06e58 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 12:46:21 +0000
Subject: [PATCH 09/19] Fix linting issues

---
 .../src/__tests__/profilerContext-test.js     | 23 +++++++++++++------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index d0fc09b59a4..3672800e28b 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -590,10 +590,17 @@ describe('ProfilerContext', () => {
     jest.useRealTimers();
 
     // Conetext providers
-    const Profiler = require('react-devtools-shared/src/devtools/views/Profiler/Profiler').default;
-    const {TimelineContextController} = require('react-devtools-timeline/src/TimelineContext');
-    const {SettingsContextController} = require('react-devtools-shared/src/devtools/views/Settings/SettingsContext');
-    const {ModalDialogContextController} = require('react-devtools-shared/src/devtools/views/ModalDialog');
+    const Profiler =
+      require('react-devtools-shared/src/devtools/views/Profiler/Profiler').default;
+    const {
+      TimelineContextController,
+    } = require('react-devtools-timeline/src/TimelineContext');
+    const {
+      SettingsContextController,
+    } = require('react-devtools-shared/src/devtools/views/Settings/SettingsContext');
+    const {
+      ModalDialogContextController,
+    } = require('react-devtools-shared/src/devtools/views/ModalDialog');
 
     // need a dom component for profiling to be enabled
     const Component = () => null;
@@ -618,7 +625,7 @@ describe('ProfilerContext', () => {
                 </TimelineContextController>
               </ModalDialogContextController>
             </SettingsContextController>
-          </Contexts>
+          </Contexts>,
         );
       });
 
@@ -644,11 +651,13 @@ describe('ProfilerContext', () => {
       // Helper to wait for profiling state to change
       const waitForProfilingState = async (expectedState, timeoutMs = 1000) => {
         const startTime = Date.now();
-        while (store.profilerStore.isProfilingBasedOnUserInput !== expectedState) {
+        while (
+          store.profilerStore.isProfilingBasedOnUserInput !== expectedState
+        ) {
           if (Date.now() - startTime > timeoutMs) {
             throw new Error(
               `Timeout waiting for profiling to be ${expectedState}. ` +
-              `Current state: ${store.profilerStore.isProfilingBasedOnUserInput}`
+                `Current state: ${store.profilerStore.isProfilingBasedOnUserInput}`,
             );
           }
           await new Promise(resolve => setTimeout(resolve, 10));

From 3f397de05ead157f25bbe23c07a8b29d70bbf017 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 12:49:02 +0000
Subject: [PATCH 10/19] Fix linting errors

---
 .../react-devtools-shared/src/__tests__/profilerContext-test.js  | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index 3672800e28b..0d81e66de86 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -610,7 +610,6 @@ describe('ProfilerContext', () => {
     document.body.appendChild(profilerContainer);
 
     // Create a root for the profiler
-    const ReactDOMClient = require('react-dom/client');
     const profilerRoot = ReactDOMClient.createRoot(profilerContainer);
 
     try {

From de7e0c299f97fa189fc7644b218f0adfb4bd6bd2 Mon Sep 17 00:00:00 2001
From: emily8rown <emilybrown02b28@gmail.com>
Date: Fri, 21 Nov 2025 08:09:19 -0500
Subject: [PATCH 11/19] Comment spelling correction

Co-authored-by: Ruslan Lesiutin <28902667+hoxyq@users.noreply.github.com>
---
 .../react-devtools-shared/src/__tests__/profilerContext-test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index 0d81e66de86..f8f490417bf 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -589,7 +589,7 @@ describe('ProfilerContext', () => {
     // Use real timers for this test to avoid conflicts with Timeline's setInterval
     jest.useRealTimers();
 
-    // Conetext providers
+    // Context providers
     const Profiler =
       require('react-devtools-shared/src/devtools/views/Profiler/Profiler').default;
     const {

From 5180a8f5c54b838954e6e0c003408e4e8d6c0f45 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 14:50:32 +0000
Subject: [PATCH 12/19] removed polling for hotkey test

---
 .../src/__tests__/profilerContext-test.js     | 29 +++++--------------
 1 file changed, 7 insertions(+), 22 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index f8f490417bf..5eb216faecb 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -647,32 +647,17 @@ describe('ProfilerContext', () => {
         bubbles: true,
       });
 
-      // Helper to wait for profiling state to change
-      const waitForProfilingState = async (expectedState, timeoutMs = 1000) => {
-        const startTime = Date.now();
-        while (
-          store.profilerStore.isProfilingBasedOnUserInput !== expectedState
-        ) {
-          if (Date.now() - startTime > timeoutMs) {
-            throw new Error(
-              `Timeout waiting for profiling to be ${expectedState}. ` +
-                `Current state: ${store.profilerStore.isProfilingBasedOnUserInput}`,
-            );
-          }
-          await new Promise(resolve => setTimeout(resolve, 10));
-        }
-      };
-
       // Dispatch keyboard event to toggle profiling on
-      ownerWindow.dispatchEvent(keyEvent);
-      await waitForProfilingState(true);
-
+      // Use utils.act() to ensure all state updates complete
+      utils.act(() => {
+        ownerWindow.dispatchEvent(keyEvent);
+      });
       expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(true);
 
       // Dispatch keyboard event to toggle profiling off
-      ownerWindow.dispatchEvent(keyEvent);
-      await waitForProfilingState(false);
-
+      utils.act(() => {
+        ownerWindow.dispatchEvent(keyEvent);
+      });
       expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
 
       document.body.removeChild(profilerContainer);

From b40536429236357fbd19668ee185aac04420b718 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 14:51:51 +0000
Subject: [PATCH 13/19] Removed unecessary comment

---
 .../react-devtools-shared/src/__tests__/profilerContext-test.js  | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index 5eb216faecb..f16ca508cb0 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -648,7 +648,6 @@ describe('ProfilerContext', () => {
       });
 
       // Dispatch keyboard event to toggle profiling on
-      // Use utils.act() to ensure all state updates complete
       utils.act(() => {
         ownerWindow.dispatchEvent(keyEvent);
       });

From 3424b9a0f0fe4005290671f9211e8293adc38d19 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 15:30:31 +0000
Subject: [PATCH 14/19] replaced timout and promise with utils.act

---
 .../src/__tests__/profilerContext-test.js                      | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index f16ca508cb0..c2bb2cdc0aa 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -628,9 +628,6 @@ describe('ProfilerContext', () => {
         );
       });
 
-      // Wait for any async effects to complete
-      await new Promise(resolve => setTimeout(resolve, 100));
-
       // Verify that the profiler is not profiling.
       expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
 

From 6c0d2b70a9e57bdbbaebe99f4fa18d6155e61277 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 15:37:46 +0000
Subject: [PATCH 15/19] Switch test to use fake timers and turn recursively
 flush off

---
 .../src/__tests__/profilerContext-test.js     | 97 +++++++++----------
 1 file changed, 45 insertions(+), 52 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index c2bb2cdc0aa..f650b58c664 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -586,9 +586,6 @@ describe('ProfilerContext', () => {
   });
 
   it('should toggle profiling when the keyboard shortcut is pressed', async () => {
-    // Use real timers for this test to avoid conflicts with Timeline's setInterval
-    jest.useRealTimers();
-
     // Context providers
     const Profiler =
       require('react-devtools-shared/src/devtools/views/Profiler/Profiler').default;
@@ -612,54 +609,50 @@ describe('ProfilerContext', () => {
     // Create a root for the profiler
     const profilerRoot = ReactDOMClient.createRoot(profilerContainer);
 
-    try {
-      // Render the profiler - use React.act to ensure render completes
-      React.act(() => {
-        profilerRoot.render(
-          <Contexts>
-            <SettingsContextController browserTheme="light">
-              <ModalDialogContextController>
-                <TimelineContextController>
-                  <Profiler />
-                </TimelineContextController>
-              </ModalDialogContextController>
-            </SettingsContextController>
-          </Contexts>,
-        );
-      });
-
-      // Verify that the profiler is not profiling.
-      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
-
-      // Trigger the keyboard shortcut.
-      const ownerWindow = profilerContainer.ownerDocument.defaultView;
-      const isMac =
-        typeof navigator !== 'undefined' &&
-        navigator.platform.toUpperCase().indexOf('MAC') >= 0;
-
-      const keyEvent = new KeyboardEvent('keydown', {
-        key: 'e',
-        metaKey: isMac,
-        ctrlKey: !isMac,
-        bubbles: true,
-      });
-
-      // Dispatch keyboard event to toggle profiling on
-      utils.act(() => {
-        ownerWindow.dispatchEvent(keyEvent);
-      });
-      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(true);
-
-      // Dispatch keyboard event to toggle profiling off
-      utils.act(() => {
-        ownerWindow.dispatchEvent(keyEvent);
-      });
-      expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
-
-      document.body.removeChild(profilerContainer);
-    } finally {
-      // Restore fake timers for other tests
-      jest.useFakeTimers();
-    }
+    // Render the profiler - use React.act to ensure render completes
+    React.act(() => {
+      profilerRoot.render(
+        <Contexts>
+          <SettingsContextController browserTheme="light">
+            <ModalDialogContextController>
+              <TimelineContextController>
+                <Profiler />
+              </TimelineContextController>
+            </ModalDialogContextController>
+          </SettingsContextController>
+        </Contexts>,
+      );
+    });
+
+    // Verify that the profiler is not profiling.
+    expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
+
+    // Trigger the keyboard shortcut.
+    const ownerWindow = profilerContainer.ownerDocument.defaultView;
+    const isMac =
+      typeof navigator !== 'undefined' &&
+      navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+
+    const keyEvent = new KeyboardEvent('keydown', {
+      key: 'e',
+      metaKey: isMac,
+      ctrlKey: !isMac,
+      bubbles: true,
+    });
+
+    // Dispatch keyboard event to toggle profiling on
+    // Use recursivelyFlush=false to avoid infinite loop from Bridge timers
+    utils.act(() => {
+      ownerWindow.dispatchEvent(keyEvent);
+    }, false);
+    expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(true);
+
+    // Dispatch keyboard event to toggle profiling off
+    utils.act(() => {
+      ownerWindow.dispatchEvent(keyEvent);
+    }, false);
+    expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);
+
+    document.body.removeChild(profilerContainer);
   });
 });

From daf937c2a599c63170b3051dc9aee7fd1c0c5bcd Mon Sep 17 00:00:00 2001
From: emily8rown <emilybrown02b28@gmail.com>
Date: Fri, 21 Nov 2025 10:41:02 -0500
Subject: [PATCH 16/19] Update comment for profiler hotkey test

---
 .../react-devtools-shared/src/__tests__/profilerContext-test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index f650b58c664..83bcca7362a 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -599,7 +599,7 @@ describe('ProfilerContext', () => {
       ModalDialogContextController,
     } = require('react-devtools-shared/src/devtools/views/ModalDialog');
 
-    // need a dom component for profiling to be enabled
+    // Dom component for profiling to be enabled
     const Component = () => null;
     utils.act(() => render(<Component />));
 

From 3a2759a9ba2740fc35ec523017c71815e030cf31 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 16:07:30 +0000
Subject: [PATCH 17/19] switched to async for dispatching key event in the test

---
 .../src/__tests__/profilerContext-test.js                   | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index f650b58c664..8596c6181d2 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -641,14 +641,14 @@ describe('ProfilerContext', () => {
     });
 
     // Dispatch keyboard event to toggle profiling on
-    // Use recursivelyFlush=false to avoid infinite loop from Bridge timers
-    utils.act(() => {
+    // Try utils.actAsync with recursivelyFlush=false
+    await utils.actAsync(() => {
       ownerWindow.dispatchEvent(keyEvent);
     }, false);
     expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(true);
 
     // Dispatch keyboard event to toggle profiling off
-    utils.act(() => {
+    await utils.actAsync(() => {
       ownerWindow.dispatchEvent(keyEvent);
     }, false);
     expect(store.profilerStore.isProfilingBasedOnUserInput).toBe(false);

From bde0b3042d8d905b45dd52eaf53ca3eb1a86ecbb Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 16:23:44 +0000
Subject: [PATCH 18/19] switch test to utils.act for rendering profiler

---
 .../src/__tests__/profilerContext-test.js                     | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index 8596c6181d2..b9155ed9573 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -609,8 +609,8 @@ describe('ProfilerContext', () => {
     // Create a root for the profiler
     const profilerRoot = ReactDOMClient.createRoot(profilerContainer);
 
-    // Render the profiler - use React.act to ensure render completes
-    React.act(() => {
+    // Render the profiler
+    utils.act(() => {
       profilerRoot.render(
         <Contexts>
           <SettingsContextController browserTheme="light">

From f62931b74f93d884208e6d8aa611a21829945c02 Mon Sep 17 00:00:00 2001
From: Emily Brown <emilypb@meta.com>
Date: Fri, 21 Nov 2025 16:28:28 +0000
Subject: [PATCH 19/19] Corrected comment

---
 .../react-devtools-shared/src/__tests__/profilerContext-test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
index b9155ed9573..2cd2340fb7a 100644
--- a/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
+++ b/packages/react-devtools-shared/src/__tests__/profilerContext-test.js
@@ -599,7 +599,7 @@ describe('ProfilerContext', () => {
       ModalDialogContextController,
     } = require('react-devtools-shared/src/devtools/views/ModalDialog');
 
-    // need a dom component for profiling to be enabled
+    // Dom component for profiling to be enabled
     const Component = () => null;
     utils.act(() => render(<Component />));