Firefox React developer tools stopped working - reactjs

I've been using the React developer tools extension in Firefox for some time, they're great. But yesterday the tools stopped working. The Components tab is available, but it doesn't show any content - my React component tree is simply missing, the pane is blank.
I've tried uninstalling the extension, closing Firefox, and reinstalling the extension.
I've tried rebooting my machine.
I've checked the Components tab settings, everything looks OK.
I've tried reverting to an old version of my project, back when the Developer tools definitely worked.
Has anybody got any ideas? There's no error, and I can't think of any way to investigate what's causing the problem. I haven't found anything by web searching.
And I can't switch to Chrome, because the tools won't install on Chrome under Linux!
OS: Linux mint Cinnamon
Firefox version: 63.0.3 (64 bit)

Phew, got it working again! I'm posting what worked for me in case it helps anybody else.
I completely uninstalled Firefox and reinstalled it following these instructions:
https://www.fosslinux.com/13881/how-to-clean-uninstall-and-reinstall-firefox-in-ubuntu.htm
Then re-added the Developer Tools extension, and it is now working. Firefox is now at version 69.0.

Related

This page doesn’t appear to be using React. If this seems wrong, follow the troubleshooting instructions on Microsoft Edge

I created the build of a MERN Stack application using the npm run build command, then I ran this built application on my default browser (Microsoft Edge) using the npm start command. I then installed the react devtools extension for Edge from Chrome. But when I enable react devtools on my react app, it does not activate and I get the message This page doesn’t appear to be using React.
If this seems wrong, follow the troubleshooting instructions. I don't understand why I get this error because my application is entirely designed in react on the frontend side. I don't know if it's because I got the wrong server start command .
You can try the following solution.
In Edge, right click on React devtools, go to Manage extensions, and select "Allow access to file URLs".
Also, it has been reported that a re-installation of react devtools and a restart of browser may help. By the way, react devtools is available in Microsoft Edge Add-ons, so you can just install it in Edge (since you said you installed it from Chrome).
Updating Chrome to last version worked for me.
Chrome version: 109.0.5414.119 (Official Build) (64-bit)
System version: Ubuntu 20.04.2 LTS

VS Code React app closes/crashes using Chrome debugger

I am troubleshooting an issue I am having debugging a React application using VS Code with the Chrome debugger extension. I am using Windows 10 x64.
When I try to log into the application from the app's login page, the debug browser closes without any error (see screenshot below of break-point in code where the browser closes/crashes). I've tried debugging with both Chrome and Edge and I see the same issue with both browsers.
I do not have the same issue running the application without debugger from npm start. Nor do I see the issue when running the application from Chrome debugger on a different computer. Also my friend who is working on the same code does not see the issue on his computer when debugging or running the code.
I cloned an extra copy of the application code onto a different directory on my computer and that did not fix the issue.
I see a file is created \src\debug.log which seems like it could be related to the issue, but not sure what this is used for. The log file just shows the below error over and over.
ERROR:crash_report_database_win.cc(469)] failed to stat report
Any ideas on how I can fix this or what might be happening here?
I faced with the same issue in the Chrome version 85, I've updated to version 86.0.4240.75 and now is working for me
Here you'll find the Chrome Bug Report: https://bugs.chromium.org/p/chromium/issues/detail?id=1123329
The solution for now is to disable the new Javascript Debugger
"debug.javascript.usePreview": false

pgadmin4 not displaying properly

I've installed PostgreSql, pgadmin4 came along with it first. It didn't work so I installed the latest version of pgadmin4 v4 again but still its the same. It was showing a fatal error message earlier which said "Failed to open the system default web browser. Is one installed?." After that, it somehow worked & it started in my IE when I set it as my default browser. I tried opening it in Firefox too setting it as default browser but the result was same.
It shows the following screen rather than the expected normal screen that should appear as soon as we start it.
To resolve the issue, use the Windows Registry Editor to reset the value of
HKEY_CLASSES_ROOT.css\Content Type
to
text/css
and then restart pgAdmin4.
Ref: https://www.pgadmin.org/faq/#6
Note: Use Chrome or Firefox latest version with pgAdmin4, IE11 does not support many latest HTML technologies, for example with IE11 you will not able to download the graphical explain plan.

Chrome breakpoint system randomly fails, until reboot

I can debug just fine using Chrome devtools for a while, but at some point my breakpoints stop working. They are still enabled (darker blue in the gutter). "debugger;" statements still break. Quitting and restarting Chrome does not solve the problem, but completely rebooting my machine does.
Does this ring bells for anyone? I have not tried uninstalling and reinstalling chrome.
Chrome is current as of today: Version 74.0.3729.169 (Official Build) (64-bit)
Using create-react-app, VSCode, can supply version #s but doubt they are relevant.
Any help appreciated! Thanks

Chrome Netbeans Plugin only shows blank page

I'm learning AngularJS at the moment and thought I would install netbeans as it supports debugging in chrome via a plugin. Or claims to at least...
I have followed the user guides and tutorials that I've found and always seem to falter at the same point:
Install Netbeans
Install chrome plugin
Create a simple sample project
Set the default web browser to Chrome with Plugin
Click run
At this point I always see a blank page loaded in Chrome. I suspect that this is a bug as all of the resources online seem sure that I should be able to see the default index.hmtl page in my browser...
I'm running on a MAC:
And my plugin version is:
My Netbeans version:
My Default Browser in Netbeans:
Does anyone know of any issues with running this configuration? No matter what I do I just see a blank page with a mangled URL like so when I hit run:
http://file:///private/var/folders/4l/3gq9477n6_952q1ztvz5ngdckcdyx4/T/blank2587611836421039861.html
When I open this file in VI I see one line in it:
<html :netbeans_temporary="true"></html>
This seemed to work as a workaround for me:
Open the project configuration and change the browser from Chrome with netbeans connector to Chrome
Run the project (the correct page should come up in Chrome)
Click on the Netbeans Connector in the upper right corner of the Chrome window
Select "Debug in Netbeans" (You should get the yellow information notice across the top of the window)
Go back to Netbeans and click on the 'debug main project' button.
My configuration is os/x High Sierra, Netbeans 8.2

Resources