{"record":{"id":"b1989edc82d75eee","repo":"vercel-labs/agent-browser","slug":"react-devtools-hook-not-installed-relaunch-with","errorCode":null,"errorMessage":"React DevTools hook not installed - relaunch with --enable react-devtools","messagePattern":"React DevTools hook not installed - relaunch with --enable react-devtools","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"cli/src/native/react/scripts.rs","lineNumber":51,"sourceCode":"    let firstWithRoots = null, firstAny = null;\n    for (const id of ris.keys()) {\n      if (!ris.get(id)) continue;\n      if (firstAny === null) firstAny = id;\n      if (rootsOf(id) > 0) {\n        if (firstWithRoots === null) firstWithRoots = id;\n        if (!isFlight(id)) return id;\n      }\n    }\n    return firstWithRoots !== null ? firstWithRoots : firstAny;\n  }\n\"#;\n\n/// Build a no-argument async IIFE page-eval that returns the component tree as\n/// JSON.\npub const TREE_SNAPSHOT: &str = r#\"\n(async () => {\n  const hook = window.__REACT_DEVTOOLS_GLOBAL_HOOK__;\n  if (!hook) throw new Error(\"React DevTools hook not installed - relaunch with --enable react-devtools\");\n{{PICK_RI}}\n  const __abRiId = __abPickReactRendererId(hook);\n  const ri = (__abRiId != null && hook.rendererInterfaces && hook.rendererInterfaces.get) ? hook.rendererInterfaces.get(__abRiId) : null;\n  if (!ri) throw new Error(\"No React renderer attached - the page has not booted React yet\");\n\n  const batches = await new Promise((resolve) => {\n    const out = [];\n    const origEmit = hook.emit;\n    hook.emit = function (event, payload) {\n      if (event === \"operations\") out.push(Array.from(payload));\n      return origEmit.apply(hook, arguments);\n    };\n    ri.flushInitialOperations();\n    setTimeout(() => {\n      hook.emit = origEmit;\n      resolve(out);\n    }, 50);\n  });","sourceCodeStart":33,"sourceCodeEnd":69,"githubUrl":"https://github.com/vercel-labs/agent-browser/blob/548b159b30eef119ccf6846c8bc807d0eaa3f6f8/cli/src/native/react/scripts.rs#L33-L69","documentation":"'react tree' evaluates TREE_SNAPSHOT, which reads window.__REACT_DEVTOOLS_GLOBAL_HOOK__. That hook only exists when the browser was launched with '--enable react-devtools': the vendored installHook.js is registered via addScriptToEvaluateOnNewDocument so it runs before any page JS. Without the flag no hook is installed and every React-side subcommand fails at this first guard.","triggerScenarios":"Running 'agent-browser react tree' (or any react subcommand) against a session launched without '--enable react-devtools'; enabling the flag mid-session does not inject the hook into already-loaded documents, so documents opened before enabling also fail.","commonSituations":"Forgetting the flag at launch; automation scripts that assume the DevTools hook is always present; opening the page first and adding the flag to later commands (it is a launch-time option, not a per-command one).","solutions":["Close and relaunch the browser with the flag: 'agent-browser close' then 'agent-browser open <url> --enable react-devtools'","Verify the hook landed: 'agent-browser eval \"!!window.__REACT_DEVTOOLS_GLOBAL_HOOK__\"' should print true","Make the flag part of every launch in your scripts/config so React introspection is always available"],"exampleFix":"# before\nagent-browser open https://app\nagent-browser react tree   # hook not installed\n\n# after\nagent-browser close\nagent-browser open https://app --enable react-devtools\nagent-browser react tree","handlingStrategy":"validation","validationCode":"# before any react subcommand:\nagent-browser eval \"!!window.__REACT_DEVTOOLS_GLOBAL_HOOK__\"\n# prints true only when the hook is installed","typeGuard":"function hasDevToolsHook(win: Window): boolean {\n  return typeof (win as any).__REACT_DEVTOOLS_GLOBAL_HOOK__ === \"object\";\n}","tryCatchPattern":null,"preventionTips":["Always launch with 'agent-browser open <url> --enable react-devtools' in sessions that will use react commands","Check the hook with an eval before running react subcommands to fail fast with your own message","Remember the flag is launch-time only: enabling it after load does not affect already-open documents"],"tags":["react","devtools","configuration","cli","launch-flag"],"backgroundTag":null,"analyzedSha":"548b159b30eef119ccf6846c8bc807d0eaa3f6f8","analyzedAt":"2026-08-16T10:12:14.925Z","schemaVersion":2},"datasetVersion":"2026-08-16T13:17:31.715Z"}