Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Chrome has the best Javascript debugging tools.

However when it comes to CSS and HTML, its lagging behind Firebug.

That said, now adays I find myself in Chrome far more than Firefox simply because Javascript debugging in Chrome is fast, never crashes, and is pretty necessary if you're building an extensive rich interface app.



I don't think I agree, as a heavy JavaScript developer. I use FireBug specifically for JavaScript debugging, here are the reasons:

1. The console is a lot better. You aren't limited to the one line interpreter that Chrome provides.

2. Using console.log, and console.dir I get a colored DOM/JSON output. I can click the DOM element and it'll get me to the DOM/HTML tab. This is not available in Chrome. I can move the mouse over the DOM element and it'll be highlighted in the browser.

3. Add-ons: I use the jQuery and Cookies add-ons and they add a lot to the console. I can include jQuery with a click and it highlights the jQuery objects for me in the console. I can watch cookies changes from the console directly.

4. For the debugging tools, they are equal. For syntax coloring the JavaScript code, there is a Firebug add-on for that.


Regarding #1, you can do multiline if you paste, or option-return.


Chrome can do #1 and #2.


2 only partially: it does not link to the DOM tab.


How do you do #2?


Recent versions of the Webkit dev tools do syntax coloration and highlighting on hover.

They don't link to the Elements tab though.


I agree that Chrome's dev tools are faster and crash less. I also find them more visually appealing. I wouldn't say they are better than Firebug, though... there are a few kinks they need to work out.

One of them is console.log():

  (function(){
	var obj = {};
	console.log(obj);
	obj.new_value = "hello";
	console.log(obj);
  })();
In Chrome, this logs an object {new_value: "hello"} twice, as opposed to the expected: an empty object, and then the aforementioned object.

More details here: http://techblog.appnexus.com/2011/webkit-chrome-safari-conso...

It's not something I encounter often, but when I do, it's really obnoxious to have to work around it. I mean, it's console.log() ffs.


Yeah that one's a complete pain in the ass, it makes debugging much harder in mutation loops as you always get the wrong value displayed in the console and then smash your head in the desk as a test which should be hit is not.


I am a long time firebug and chrome developer tools user and i was with you on chrome having the "best Javascript debugging tools". Unfortunately, it still crashes when doing some tricky debugging things, and it has plenty of bugs (e.g. after a while debugging, the console stops outputting complex objects (objects, arrays) leaving spaces instead, so a collection of elements looks like [, , , ]).

I switched to OSX 4 years ago and i hate to say it, but I found IE9 and IE10 debuggers (even ran in virtual machine) the be the most stable debugging tools. I encourage you to give it a try. It turns out, that we're living rather a miserable life trying to find tools that don't crash, and there are good tools out there. Too bad they are on the "alternative" operating system MS Windows is.


Want to know the value of a global variable using the IE dev tools? Well you'll have to put in a break point, because the watch window isn't even available unless execution is paused.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: