Inject early on when reloading-and-profiling

src/backend/agent.js

@@ -1,7 +1,7 @@
 // @flow
 
 import EventEmitter from 'events';
-import { __DEBUG__ } from '../constants';
+import { RELOAD_AND_PROFILE_KEY, __DEBUG__ } from '../constants';
 import { hideOverlay, showOverlay } from './views/Highlighter';
 
 import type { RendererID, RendererInterface } from './types';
@@ -38,8 +38,6 @@ type SetInParams = {|
   value: any,
 |};
 
-const RELOAD_AND_PROFILE_KEY = 'React::DevTools::reloadAndProfile';
-
 export default class Agent extends EventEmitter {
   _bridge: Bridge = ((null: any): Bridge);
   _isProfiling: boolean = false;

src/backend/index.js

@@ -33,8 +33,16 @@ export function initBackend(
   ];
 
   const attachRenderer = (id: number, renderer: ReactRenderer) => {
-    const rendererInterface = attach(hook, id, renderer, global);
-    hook.rendererInterfaces.set(id, rendererInterface);
+    let rendererInterface = hook.rendererInterfaces.get(id);
+
+    // Inject any not-yet-injected renderers (if we didn't reload-and-profile)
+    if (!rendererInterface) {
+      rendererInterface = attach(hook, id, renderer, global);
+
+      hook.rendererInterfaces.set(id, rendererInterface);
+    }
+
+    // Notify the DevTools frontend about any renderers that were attached early.
     hook.emit('renderer-attached', {
       id,
       renderer,

src/backend/renderer.js

@@ -1595,6 +1595,10 @@ export function attach(
   }
 
   function startProfiling() {
+    if (isProfiling) {
+      return;
+    }
+
     // Capture initial values as of the time profiling starts.
     // It's important we snapshot both the durations and the id-to-root map,
     // since either of these may change during the profiling session
@@ -1611,6 +1615,11 @@ export function attach(
     isProfiling = false;
   }
 
+  // Automatically start profiling so that we don't miss timing info from initial "mount".
+  if (localStorage.getItem('React::DevTools::reloadAndProfile') === 'true') {
+    startProfiling();
+  }
+
   return {
     cleanup,
     getCommitDetails,

src/constants.js

@@ -5,4 +5,6 @@ export const TREE_OPERATION_REMOVE = 2;
 export const TREE_OPERATION_RESET_CHILDREN = 3;
 export const TREE_OPERATION_UPDATE_TREE_BASE_DURATION = 4;
 
+export const RELOAD_AND_PROFILE_KEY = 'React::DevTools::reloadAndProfile';
+
 export const __DEBUG__ = false;

src/hook.js

@@ -79,6 +79,20 @@ export function installHook(target: any): DevToolsHook | null {
 
     hook.emit('renderer', { id, renderer, reactBuildType });
 
+    // If we have just reloaded to profile, we need to inject the renderer interface before the app loads.
+    // Otherwise the renderer won't yet exist and we can skip this step.
+    const attach = target.__REACT_DEVTOOLS_ATTACH__;
+    if (typeof attach === 'function') {
+      const rendererInterface = attach(hook, id, renderer, target);
+      hook.rendererInterfaces.set(id, rendererInterface);
+
+      /*hook.emit('renderer-attached', {
+        id,
+        renderer,
+        rendererInterface,
+      });*/
+    }
+
     return id;
   }