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

31–40 of 74 posts

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#31

Post by hcs »

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)

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#32

Post by philliphaydon »

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…

I much prefer Firefox dev tools over chrome. The only time I use chrome is web socket stuff. Debugging css grids in Firefox (which I learned this year) is amazing.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#33

Post by kaycebasques »

starik36 wrote: post #28
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…

I've experienced the same. Sometimes inexplicable things occur in the debugger and I have to switch to Chrome. The superior layout of the tools + handy way to quickly locate events keep me coming back. Hopefully, the tools improve in v67.

> superior layout of the tools

Which bits?

> handy way to quickly locate events

Are you referring to how FF shows `event` next to DOM nodes?

(I am reconnoitering for Chrome DevTools so don’t answer if you view us as the storm troopers)

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#34

Post by kaycebasques »

sgruetter wrote: post #17
matthewvincent wrote: post #14

Firefox dev edition has been my go to lately, highly recommended if you do a lot of markup / css debugging. Being able to see outlines around elements as I hover / scan through the DOM easily doubles my speed.

I agree. Whenever I have something strange going on with CSS Grid or Flexbox layouts, the issue is usually easier to find with Firefox than Chrome. Let's see how the new JS debugger feels.

Grid Inspector: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto...

Flexbox Inspector: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspecto...

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#35

Post by jpangs88 »

0xDEEPFAC wrote: post #25
afturner wrote: post #6

I'm really liking this recent uptick in Google/Mozilla/Opera development/rivalry lately. It's good for consumers. If only things happened more quickly...

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.

Safari uses Chromium, how so? I thought they were based on the same engine then they split but that was like 6 years ago. I couldn't find anything on it with a simple search.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#36

Post by epse »

jpangs88 wrote: post #35
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.

Safari uses Chromium, how so? I thought they were based on the same engine then they split but that was like 6 years ago. I couldn't find anything on it with a simple search.

Yeah WebKit was developed for safari, which chrome forked into blink. Safari still uses WebKit

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#37

Post by Vinnl »

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…

Your comments echo my sentiments exactly, but I do think this update is mainly about resolving these points. They've done a lot of work in recent years on a revamp of the foundations of the DevTools, and I think they're starting to pay off now.

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#38

Post by Vinnl »

waingake wrote: post #16

Correct me if I'm wrong, but web-socket debugging in FF isn't supported? I ran into this last night, Chrome shows me what requests are going over websockets, FF does not.

They're working on this as part of (ironically) Google Summer of Code. Here's the bug: https://bugzilla.mozilla.org/show_bug.cgi?id=885508

(Yeah, it's overdue.)

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#39

Post by Vinnl »

dblohm7 wrote: post #4
haolez wrote: post #3

Earlier quoted context omitted.

Can it inspect WebSockets frames yet? I'm a Firefox user but I miss that sometimes when developing stuff.

I heard that this was going to be a GSOC project this summer, but I'm not sure if that was approved or not.

It was, here's the bug: https://bugzilla.mozilla.org/show_bug.cgi?id=885508

Re: Faster Smarter JavaScript Debugging in Firefox DevTools

#40

Post by starik36 »

kaycebasques wrote: post #33
starik36 wrote: post #28

Earlier quoted context omitted.

I've experienced the same. Sometimes inexplicable things occur in the debugger and I have to switch to Chrome. The superior layout of the tools + handy way to quickly locate events keep me coming back. Hopefully, the tools improve in v67.

> superior layout of the tools Which bits? > handy way to quickly locate events Are you referring to how FF shows `event` next to DOM nodes? (I am reconnoitering for Chrome DevTools so don’t answer if you view us as the storm troopers)

Note the 3 pane layout vs Chrome's 2 pane. I can see more at a glance and more effective use of the monitor - plus I can see the Box Model (or Flex model) without having to scroll down. https://i.imgur.com/Ts3Ygk5.png

And yes, referring to the event bubble next to the element.

Post reply on HN