facebook/react · error · Error
Hooks not supported by this renderer
Error message
Hooks not supported by this renderer
What it means
Thrown by the DevTools backend's legacy (stack) renderer adapter when the frontend asks it to delete a value inside a component's hooks. React 15 and earlier used the stack reconciler, which has no hooks concept, so this adapter only implements edits for props, state, and context. The error means a hook-edit command was routed to a pre-fiber renderer that cannot store hook state.
Source
Thrown at packages/react-devtools-shared/src/backend/legacy/renderer.js:1099
}
function deletePath(
type: 'context' | 'hooks' | 'props' | 'state',
id: number,
hookID: ?number,
path: Array<string | number>,
): void {
const internalInstance = idToInternalInstanceMap.get(id);
if (internalInstance != null) {
const publicInstance = internalInstance._instance;
if (publicInstance != null) {
switch (type) {
case 'context':
deletePathInObject(publicInstance.context, path);
forceUpdate(publicInstance);
break;
case 'hooks':
throw new Error('Hooks not supported by this renderer');
case 'props':
const element = internalInstance._currentElement;
internalInstance._currentElement = {
...element,
props: copyWithDelete(element.props, path),
};
forceUpdate(publicInstance);
break;
case 'state':
deletePathInObject(publicInstance.state, path);
forceUpdate(publicInstance);
break;
}
}
}
}
function renamePath(View on GitHub (pinned to eafeac097b)
Solutions
- If the inspected app is on React 15, accept that hooks cannot exist there — edit state or props instead of hook values.
- Upgrade the inspected app to React 16.8+ (fiber) if you need hook inspection and editing.
- Align DevTools versions (update the browser extension / standalone / react-devtools package) so the frontend stops offering hook edits on legacy roots.
- For custom embeds, only send type:'hooks' edit commands when the inspected element's hooks list is non-null.
Example fix
// before
bridge.send('deletePath', {id, type: 'hooks', hookID, path, rendererID});
// after — only send hook edits when the element actually has hooks
if (inspectedElement.hooks != null) {
bridge.send('deletePath', {id, type: 'hooks', hookID, path, rendererID});
} Defensive patterns
Strategy: type-guard
Validate before calling
const isFiberRenderer = renderer =>
typeof renderer.findFiberByHostInstance === 'function';
if (!isFiberRenderer(renderer)) {
// stack renderer (v15): no hook state exists, only props/state/context
} Type guard
function supportsHookEdits(inspectedElement) {
return inspectedElement.hooks != null && inspectedElement.hooks.length > 0;
} Try / catch
try {
deletePath('hooks', id, hookID, path);
} catch (error) {
if (/Hooks not supported by this renderer/.test(error.message)) return; // legacy root, nothing to edit
throw error;
} Prevention
- Only render hooks-edit UI when the inspected element exposes a hooks list.
- Gate renderer-level commands on the fiber capability check (findFiberByHostInstance).
- Keep DevTools frontend and backend versions aligned when embedding.
When it happens
Trigger: The backend receives deletePath('hooks', id, hookID, path) — emitted by the DevTools Inspector when you right-click a hook entry and choose 'Delete value' — while the attached renderer was wrapped by packages/react-devtools-shared/src/backend/legacy/renderer.js (React <= 15 or a custom stack renderer).
Common situations: App (or one subtree) runs React 15 while the DevTools frontend is a newer build that still shows a hooks editor; multi-root pages mixing v15 and v16 where ids get crossed; version skew between the DevTools extension/standalone build and an embedded React Native backend.
Related errors
- getProfilingData not supported by this renderer
- handleCommitFiberRoot not supported by this renderer
- handleCommitFiberUnmount not supported by this renderer
- An unsupported type was passed to use(): ${String(usable)}
- Unknown Fiber. Needs to be a function component to inspect h
AI-assisted analysis of facebook/react@eafeac097b (2026-08-21).
Data as JSON: /api/errors/7442e5659290995f.
Report an issue: GitHub.