React Dev Tools doesn't work about react

[ajpinto]

I am also having this issue. On the latest stable chrome build 118.0.5993.70. I've followed all troubleshooting steps above, I've removed and reinstalled, restarted chrome, allowed access to file URLs. Nothing works.

[elinadzhelilovasfcc]

Can you please share a code sandbox where this can be reproduced? You can also try following the tips suggested above.

Here are some steps you can try to troubleshoot this issue:

1. Make Sure You Have a React Project: Ensure that you indeed have a React application running on localhost. React DevTools only work on applications that use React.
2. Update React DevTools: Make sure you have updated React DevTools to the latest version. Go to the Chrome Web Store, search for "React Developer Tools," and update the extension if necessary.
3. Update Chrome: Ensure that you are running the latest version of Google Chrome. Go to "chrome://settings/help" to check for updates and install them if available.
4. Disable Other Extensions: Some Chrome extensions can interfere with React DevTools and cause issues. Disable other extensions you have to see if the problem persists.
5. Try Incognito Mode: Try running your application in Chrome's incognito mode. Sometimes, unusual extensions or settings can cause issues.
6. Disable Cache: Open DevTools by right-clicking and selecting "Inspect" on your application in Chrome. Then, open the "Network" tab and check the "Disable cache" option. Refresh the page and see if React DevTools start working.
7. Check Console for Errors: Open Chrome DevTools (Ctrl + Shift + J or Cmd + Option + J on Mac), then check the "Console" tab to see if there are any errors related to React DevTools.
8. Check for Variable Name Conflicts: Ensure you are not using variables or names that clash with those used by React DevTools in your code, as this can cause conflicts.
9. Clear Cache and Cookies: Try clearing the cache and cookies for your localhost website and refresh the page.
10. Reinstall React DevTools: If none of the above steps work, you may need to try uninstalling and reinstalling React DevTools.

I tried all of them. Also, I tried Firefox and the same result, it doesn't work

[ajpinto]

Same here, Chrome Version 118.0.5993.88 (Official Build) (arm64), React Developer Extension is not working, I need the profiler, Please help. please....

i’ve been able to get the extension to work in incognito. you have to activate it in the advanced extension settings, then it shows up. it’s not a fix but it’s a workaround until we can get the issue solved.

[gur22-09]

faced a similar issue where the react dev tools were not functioning.

Fix 👇
Try to update Chrome on the latest stable version and re-launch Chrome, it worked for me
My Chrome version - Version 116.0.5845.179 (Official Build) (arm64)

[shubhankarval]

@gur22-09 is right, i also went through this before, it was very frustrating. Usually the answer in these cases is to upgrade the browser version, or make sure that the version of React DevTools is compatible with your React version.

[rizfanradya]

Here are some steps you can try to troubleshoot this issue:

1. Make Sure You Have a React Project: Ensure that you indeed have a React application running on localhost. React DevTools only work on applications that use React.

2. Update React DevTools: Make sure you have updated React DevTools to the latest version. Go to the Chrome Web Store, search for "React Developer Tools," and update the extension if necessary.

3. Update Chrome: Ensure that you are running the latest version of Google Chrome. Go to "chrome://settings/help" to check for updates and install them if available.

4. Disable Other Extensions: Some Chrome extensions can interfere with React DevTools and cause issues. Disable other extensions you have to see if the problem persists.

5. Try Incognito Mode: Try running your application in Chrome's incognito mode. Sometimes, unusual extensions or settings can cause issues.

6. Disable Cache: Open DevTools by right-clicking and selecting "Inspect" on your application in Chrome. Then, open the "Network" tab and check the "Disable cache" option. Refresh the page and see if React DevTools start working.

7. Check Console for Errors: Open Chrome DevTools (Ctrl + Shift + J or Cmd + Option + J on Mac), then check the "Console" tab to see if there are any errors related to React DevTools.

8. Check for Variable Name Conflicts: Ensure you are not using variables or names that clash with those used by React DevTools in your code, as this can cause conflicts.

9. Clear Cache and Cookies: Try clearing the cache and cookies for your localhost website and refresh the page.

10. Reinstall React DevTools: If none of the above steps work, you may need to try uninstalling and reinstalling React DevTools.

[hoxyq]

Can you please share a code sandbox where this can be reproduced? You can also try following the tips suggested above.

[hoxyq]

Can you please share a code sandbox where this can be reproduced? You can also try following the tips suggested above.

Here are some steps you can try to troubleshoot this issue:

1. Make Sure You Have a React Project: Ensure that you indeed have a React application running on localhost. React DevTools only work on applications that use React.
2. Update React DevTools: Make sure you have updated React DevTools to the latest version. Go to the Chrome Web Store, search for "React Developer Tools," and update the extension if necessary.
3. Update Chrome: Ensure that you are running the latest version of Google Chrome. Go to "chrome://settings/help" to check for updates and install them if available.
4. Disable Other Extensions: Some Chrome extensions can interfere with React DevTools and cause issues. Disable other extensions you have to see if the problem persists.
5. Try Incognito Mode: Try running your application in Chrome's incognito mode. Sometimes, unusual extensions or settings can cause issues.
6. Disable Cache: Open DevTools by right-clicking and selecting "Inspect" on your application in Chrome. Then, open the "Network" tab and check the "Disable cache" option. Refresh the page and see if React DevTools start working.
7. Check Console for Errors: Open Chrome DevTools (Ctrl + Shift + J or Cmd + Option + J on Mac), then check the "Console" tab to see if there are any errors related to React DevTools.
8. Check for Variable Name Conflicts: Ensure you are not using variables or names that clash with those used by React DevTools in your code, as this can cause conflicts.
9. Clear Cache and Cookies: Try clearing the cache and cookies for your localhost website and refresh the page.
10. Reinstall React DevTools: If none of the above steps work, you may need to try uninstalling and reinstalling React DevTools.

I tried all of them. Also, I tried Firefox and the same result, it doesn't work

Unfortunately, this is not enough to understand what is causing the problem.
Can you please share some reproducible example or describe how is the application loading React?

[escaper01]

what worked for me :

• update your browser
• disable all extensions except react dev tool and close your browser
• once you will open it again you find that it's working properly
• enable all the previous extensions
  and voila

[hoxyq]

Please reopen once you have something that will help reproduce this problem.

[hocktoh89]

Same here, Chrome Version 118.0.5993.88 (Official Build) (arm64), React Developer Extension is not working, I need the profiler, Please help. please....

[hocktoh89]

Same here, Chrome Version 118.0.5993.88 (Official Build) (arm64), React Developer Extension is not working, I need the profiler, Please help. please....

i’ve been able to get the extension to work in incognito. you have to activate it in the advanced extension settings, then it shows up. it’s not a fix but it’s a workaround until we can get the issue solved.

Thanks @ajpinto , it works in Incognito.