[DevTools Bug]: React Devtools not working neither on vite or cra project

[prashantmgk]

Website or app

[https://github.com/prashantmgk/portfoliowebsite](i was trying to use it while creating my portfolio site)

Repro steps

I was trying to use React Devtools but i was not able to use it as you can see it in pictures. I thought it was cause i was using vite to create my react project, but i didnt work either in cra app. I saw the error when i navigated to the sources tab as you can see in second picture which is as follows:

Could not load content for webpack:///react-devtools-shared/src/backend/console.js (Fetch through target failed: Unsupported URL scheme; Fallback: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME)

How often does this bug happen?

Every time

DevTools package (automated)

No response

DevTools version (automated)

5.2.0 (5/8/2024)

Error message (automated)

• Could not load content for webpack:///react-devtools-shared/src/backend/console.js (Fetch through target failed: Unsupported URL scheme; Fallback: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME)
• Could not load content for webpack:///react-devtools-shared/src/backend/DevToolsConsolePatching.js (Fetch through target failed: Unsupported URL scheme; Fallback: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME)

Error call stack (automated)

No response

Error component stack (automated)

No response

GitHub query string (automated)

No response

[github-actions]

@prashantmgk: We're sorry you've seen this error. ❤️

Unfortunately the URL you provided ("localhost") is not publicly accessible. (This means that we will not be able to reproduce the problem you're reporting.)

Please help us by providing a link to a CodeSandbox (https://codesandbox.io/s/new), a repository on GitHub, or a minimal code example that reproduces the problem. (Screenshots or videos can also be helpful if they help provide context on how to repro the bug.)

Here are some tips for providing a minimal example: https://stackoverflow.com/help/mcve

Issues without repros are automatically closed but we will re-open if you update with repro info.

[github-actions]

Thank you for providing repro steps! Re-opening issue now for triage.

[hoxyq]

@prashantmgk Can you please double-check that React DevTools panels are not hidden under the "More tabs" button?

[prashantmgk]

@hoxyq ohh yeah i can see the compiler and profiler tab. great!

do you know why i was getting those errors?

you can close the issue if that is the fix btw

[hoxyq]

@hoxyq ohh yeah i can see the compiler and profiler tab. great!

do you know why i was getting those errors?

you can close the issue if that is the fix btw

This is related to unsuccessful load of source maps by Chrome DevTools for React DevTools' sources. This will be fixed in 5.3.0.