Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Faster Smarter JavaScript Debugging in Firefox DevTools

hacks.mozilla.org

Post reply on HN
Print view View original

41–50 of 74 posts

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#41

Post by chupasaurus »

hcs wrote: post #31
dlbucci wrote: post #18

You know, I've been using Firefox Dev Edition since it was Firefox Aurora (or Beta, I guess?), and it's great to hear that they are improving the dev tools! But I have to ask this in the nicest way possible: does anyone else think the tools just don't work a lot of the time? It's something I noticed especially when they switched to React. A few examples I frequently experience: 1) Stepping through TS frequently switc…

Bug reports are welcome, it may very well be something about your setup that hasn't been reported yet: https://bugzilla.mozilla.org/enter_bug.cgi?product=DevTools&... (I'm a Mozilla dev but not involved with Devtools, though I know a few folks, happy to provide pointers if you need 'em)

They are handling bugs through Github issues too, everything is under DevTools org (https://github.com/firefox-devtools)

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#42

Post by tty2300 »

kaycebasques wrote: post #27
0xDEEPFAC wrote: post #25

Earlier quoted context omitted.

Really? I generally see the opposite these days with everything moving to chromium (Opera, Chrome, Safari, and even Edge now all use it). Its kind of like a creepy consolidation. I would say though Firefox does remain a strong (if the last) holdout.

FF and Safari are both shipping some great stuff that we don't have in Chrome DevTools. Canvas debugger: https://webkit.org/blog/8452/canvas-debugging/ Flexbox inspector: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto... Fonts tab: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto...

When will safari provide a VM image so developers can actually test things on it?

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#43

Post by rehemiau »

Does hiting F2 in Firefox freeze the browser side of things (mouse position, mouse click state, css animations state, select dropdown openness state), basically everything? Or are there other tools for that? I have more problems with "debugging" CSS than javascript

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#44

Post by 5350-uiop-1130 »

A few years ago, while working at an agency, I was using the Firefox Developer Edition to build the front-end for a website. I was presented with a very weird UI bug from the client that I could not reproduce whatsoever. It was driving me mad.

After an hour or so of frustration I realised that the bug did not occur on Chrome or Firefox "Standard" Editions and was only occuring on Firefox Developer Edition.

Now I know its not fair to make a judgement based on a single bug, too many variables at play etc but the lesson I learnt as a stressed out, time-pressured developer is not to ever ever ever use a browser that wasn't the standard version of a browser for development, the one most likely to be used by the client or end-user.

I can't recall exactly but I'm pretty sure I had a similar experience with Chrome Canary vs regular Chrome too. Although I think Canary is presented as a somewhat unreliable beta-ish version of Chrome whereas I had believed that FF Dev edition would have the same rendering engine as the equivalent FF standard, so long as they where the same version number.

In any case If I had some feedback for the team working on FF dev tools it would be to implement expand to unminifed line number on minified css and js. When I inspect an element and want to jump to a particular rule in the CSS it always expands to the first line of the file only and not whatever line that rule would be on in the uminified version of the file. Chrome does this and I find it so useful it prevents me from using FF.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#45

Post by newsbinator »

5350-uiop-1130 wrote: post #44

A few years ago, while working at an agency, I was using the Firefox Developer Edition to build the front-end for a website. I was presented with a very weird UI bug from the client that I could not reproduce whatsoever. It was driving me mad. After an hour or so of frustration I realised that the bug did not occur on Chrome or Firefox "Standard" Editions and was only occuring on Firefox Developer Edition. Now I know…

To be fair, when figuring out bugs like that, if it doesn't appear in your dev environment, you'd definitely start by replicating the client's environment as closely as possible, especially their browser version (and possibly their OS for obscure stuff).

It's safe (and wise) to develop in Dev editions of browsers, so long as you're ready to debug in mainstream editions when the time comes.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#46

Post by zachwood »

kaycebasques wrote: post #27
0xDEEPFAC wrote: post #25

Earlier quoted context omitted.

Really? I generally see the opposite these days with everything moving to chromium (Opera, Chrome, Safari, and even Edge now all use it). Its kind of like a creepy consolidation. I would say though Firefox does remain a strong (if the last) holdout.

FF and Safari are both shipping some great stuff that we don't have in Chrome DevTools. Canvas debugger: https://webkit.org/blog/8452/canvas-debugging/ Flexbox inspector: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto... Fonts tab: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto...

That's got nothing to do with Chromium becoming ubiquitous as far as market share goes. Which is bad for everyone.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#47

Post by omnimus »

5350-uiop-1130 wrote: post #44

A few years ago, while working at an agency, I was using the Firefox Developer Edition to build the front-end for a website. I was presented with a very weird UI bug from the client that I could not reproduce whatsoever. It was driving me mad. After an hour or so of frustration I realised that the bug did not occur on Chrome or Firefox "Standard" Editions and was only occuring on Firefox Developer Edition. Now I know…

Af far as understand Canarys eqvivalent is Firefox Nightly. Firefox Development Edition is not beta it is just different flavour of FF.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#49

Post by pwdisswordfish2 »

tty2300 wrote: post #42
kaycebasques wrote: post #27

Earlier quoted context omitted.

FF and Safari are both shipping some great stuff that we don't have in Chrome DevTools. Canvas debugger: https://webkit.org/blog/8452/canvas-debugging/ Flexbox inspector: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto... Fonts tab: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto...

When will safari provide a VM image so developers can actually test things on it?

Why would you need to? Just test things on another WebKit browser, it will work just as well on Safari.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#50

Post by vanderZwan »

newsbinator wrote: post #45
5350-uiop-1130 wrote: post #44

A few years ago, while working at an agency, I was using the Firefox Developer Edition to build the front-end for a website. I was presented with a very weird UI bug from the client that I could not reproduce whatsoever. It was driving me mad. After an hour or so of frustration I realised that the bug did not occur on Chrome or Firefox "Standard" Editions and was only occuring on Firefox Developer Edition. Now I know…

To be fair, when figuring out bugs like that, if it doesn't appear in your dev environment, you'd definitely start by replicating the client's environment as closely as possible, especially their browser version (and possibly their OS for obscure stuff). It's safe (and wise) to develop in Dev editions of browsers, so long as you're ready to debug in mainstream editions when the time comes.

Trying to reproduce across browsers is good policy too, IMO
Post reply on HN