Hacker Read top | best | new | newcomments | leaders | about | bookmarklet login

Are you sure it's not just a habit? I've been using FF devtools for few years without issues. There are even some things chromium devtools dont have. Only time i use chromium devtools nowdays is for testing/audit (lighthouse).


view as:

My experience is that Chrome's JS dev tools are generally better (and faster) but CSS and the network inspector are better in FF.

The other day a junior teammate requested my help with something he couldn't understand: a file upload feature stopped working in his machine for no apparent reason.

It did not make any sense: the backend was receiving the file but somehow identifying it as zero-length (and hence rejecting it as an invalid file). Chrome said everything was just fine, with the network inspector showing the request but claiming it was CORS-blocked. When I tried copying the request (right-click -> copy -> as curl) and running that, the response was seemingly normal (and included the proper CORS directives).

After some time fiddling with this I decided to try with Firefox. First try, Firefox correctly displayed the request erroring with a "413 Request Entity too Large" code. This immediately prompted me to check nginx's configuration. Of course, the dev had updated his nginx container and it turned out the latest version only allows 1Mb max body size by default.

Tracing back our steps, I realized that for some fucked up reason Chrome was identifying the error properly, but not showing it in the inspector tools. Instead, it showed a made up request with an empty body payload (and that's what it copied for me to run/inspect through curl). I'm guessing it is not intentional that it works this way, but seriously: how hard is it to show the actual request the browser is making instead of a made-up one in the inspector tools? Why on earth would you show something different there?


Legal | privacy