facebook/react

[DevTools Bug] Minified React error #310; visit https://react.dev/errors/310 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

ayush11-ap opened this issue · 2 comments

Website or app

http://localhost:1234/restaurants/323532

Repro steps

i'm not able to open components features and use it properly

How often does this bug happen?

Every time

DevTools package (automated)

react-devtools-extensions

DevTools version (automated)

6.0.1-c7c68ef842

Error message (automated)

Minified React error #310; visit https://react.dev/errors/310 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

Error call stack (automated)

at updateWorkInProgressHook (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:53845)
    at Object.updateCallback [as useCallback] (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:63009)
    at t.useCallback (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:222673)
    at InspectedElementContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1329500)
    at renderWithHooks (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:52283)
    at updateFunctionComponent (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:81757)
    at beginWork (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:95976)
    at performUnitOfWork (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:154382)
    at workLoopSync (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:154250)
    at renderRootSync (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:153981)

Error component stack (automated)

at InspectedElementContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1328724)
    at da (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1315454)
    at div (<anonymous>)
    at InspectedElementErrorBoundaryWrapper (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1321764)
    at NativeStyleContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1354133)
    at div (<anonymous>)
    at div (<anonymous>)
    at OwnersListContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1268367)
    at SettingsModalContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1297652)
    at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1393839
    at da (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1315454)
    at div (<anonymous>)
    at div (<anonymous>)
    at ThemeProvider (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318165)
    at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318362
    at div (<anonymous>)
    at div (<anonymous>)
    at div (<anonymous>)
    at ThemeProvider (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318165)
    at TimelineContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1395852)
    at ProfilerContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1387571)
    at TreeContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1209877)
    at SettingsContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1238028)
    at ModalDialogContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1375269)
    at DevTools_DevTools (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1544258)

GitHub query string (automated)

https://api.github.com/search/issues?q=Minified React error #310; visit https://react.dev/errors/310 for the full message or use the non-minified dev environment for full errors and additional helpful warnings. in:title is:issue is:open is:public label:"Component: Developer Tools" repo:facebook/react
ac3030 commented

at InspectedElementContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1328724)
at da (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1315454)
at div ()
at InspectedElementErrorBoundaryWrapper (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1321764)
at NativeStyleContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1354133)
at div ()
at div ()
at OwnersListContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1268367)
at SettingsModalContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1297652)
at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1393839
at da (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1315454)
at div ()
at div ()
at ThemeProvider (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318165)
at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318362
at div ()
at div ()
at div ()
at ThemeProvider (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1318165)
at TimelineContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1395852)
at ProfilerContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1387571)
at TreeContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1209877)
at SettingsContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1238028)
at ModalDialogContextController (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1375269)
at DevTools_DevTools (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1544258)

By the sound of the error, you are probably conditionally calling hooks somewhere in your code. Hooks need to remain in the same order each time they are rendered, and when you conditionally remove/add a hook (even if temporarily), it messes with how React calls these hooks. They have to be called in the same order each render.

If you could look through your code and find any occurrences of conditional hook calls, and maybe shared it if you still can't figure it out, and if that's possible, that would be nice.