Develop Reference

JavaScript Debugging

I am using Visual Studio 2010 Express Developer edition. Developing a Website. I'm using JavaScript in my .aspx pages. How to put breakpoints in Javascript.
Any help is highly appreciated.
Thank You

If you are using Web Developer Express you can do this within Visual Studio - here are the instructions.
If you are using a different Express edition, you will have to use a browser tool for client side debugging - for example Firebug. IE and Chrome have built in developer tools that have this kind of functionality.

You can use your browser's debugger :
For Firefox, you can use Firebug (http://getfirebug.com).
Chrome contains an embedded debugger.

From memory you will need to do the following to get JS debugging in Visual Studio:
Ensure that Internet Explorer has script debugging enabled (somewhere in tools -> options) - this is the bit most people don't know about.
Then go into the .aspx and add a breakpoint by clicking in the left margin of the line of Javascript you want to debug.
Launch the website project in debug mode (F5) and hit the page using IE - your breakpoint should then hit.
As noted by other people you can use a host of other (usually better) tools that come with other browsers.

If you're debugging IE, use the following links:
http://aspnetlive.blogspot.com/2010/02/debugging-java-script-in-visual-studio.html
http://msdn.microsoft.com/en-us/library/7seh8d72.aspx
For Firefox, I recommend Firebug.
http://getfirebug.com/
For Chrome, you can use the Developer's Tools debugger.
Update
Here's a comprehensive list of debugging JavaScript in each browser:
http://siliconforks.com/doc/debugging-javascript/

I like Firebug, plugin for Firefox.

I think the idea is to use the Attach to process option of the Debug menu; but to be honest, I've never had much luck getting VS to do this fluidly (though I remember it working at times, success is spasmodic at best), maybe tabbed browsing has made this an issue - I'm unsure.
One thing I can recommend, however, and we might get a few hecklers, are the Developer Tools of IE9. If nothing else, IE9 has become an invaluable tool for me recently simply because of its Javascript debugging capabilities. Here's an MSDN article to get you started with this.

Using FireBug & Internet Explorer Debuging tool let you debug and put breakpoint on your javascript files

What tools should I have as my core set for developing javascript?

I have been developing ASP.Net applications for quite a few years, and I have always avoided learning JavaScript. Now I have been diving in and trying to learn as much as possible.
As a .Net developer I rely on Visual Studio heavily. What I am wondering is what tools, as a JavaScript developer, do you guys rely on heavily to develop JavaScript? I have just discovered FireBug which is awesome. What other tools out there am I missing that are a must have?
Thanks!

Yes, Firebug is awesome. Be sure that you are aware of the profiling capabilities in there. Also, there is a new testing framework called FireUnit that works with Firebug as well.
I like Textmate for Javascript editing on my Mac. Aptana Studio (stand-alone or as an Eclipse plug-in) is really good too.
I've been meaning to try test-driven-development in Javascript with the YUI test library. It promises to be like NUnit/JUnit for Javascript, which would be great.
Check out JS lint.
If you're interested in Aspect-oriented Programming, look at AOP in Javascript from Dojo.
Lastly, for some good information about the current state of Javascript engines (cool stuff like TraceMonkey) and future directions, check out this episode of HanselMinutes.
Enjoy!

Firebug is pretty much the best. You'll need some solutions for IE too.
See this link: Debugging JavaScript in IE7

Visual Studio 2008 - has JavaScript
intellisense and integrated Js
debugging capability
FireBug - a
must have for any web developer
FireBug Lite - "The solution is
Firebug Lite, a JavaScript file you
can insert into your pages to
simulate some Firebug features in
browsers that are not named
"Firefox"."
JsLint - gotta make
sure what you're writing is of
decent quality, and JsLint will help
you do that

Other useful tools:
packer really good JavaScript compressor.
Web Developer extension for Firefox
JsUnit unit testing framework.
SeleniumIDE feature, user interface and acceptance testing.

Lately, Visual Studio itself has improved considerably in its JavaScript support. For example, IntelliSense is now available for JavaScript in VS2008, including for third-party libraries such as jQuery.

Why not continue to use the Visual Studio for convenience and download jQuery with intellisense support.
Scott Guthrie has a post on how to do it
http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx
http://weblogs.asp.net/scottgu/archive/2008/09/28/jquery-and-microsoft.aspx

HTML/JS Debugger

We are searching for an HTML/JS debugger specifically suited for IE that can handle popup windows as well. We tested Firebug Lite which is good but it has its restrictions when compared to Firebug. We also tried IE Companion but there are some problems when it comes to in-place editing and popups.
Do you recommend a good debugger?

Internet Explorer Developer Toolbar. It is best for IE as of i know so far :)
alt text http://upload.wikimedia.org/wikipedia/en/d/d1/Devtoolbar.PNG

IE8 has one built in, it can run as IE7 also. Hit f12

Is this what you are looking for? It's called the Internet Explorer Developer Toolbar, it's like FireBug... but it's not that good :D

If (like me) you can make do with logging as a debugging tool, log4javascript works well.

Cross-browser JavaScript debugging

I have a few scripts on a site I recently started maintaining. I get those Object Not Found errors in IE6 (which Firefox fails to report in its Error Console?). What's the best way to debug these- any good cross-browser-compatible IDEs, or javascript debugging libraries of some sort?

There's no cross-browser JS debugger that I know of (because most browsers use different JS engines).
For firefox, I'd definitely recommend firebug (http://www.getfirebug.com)
For IE, the best I've found is Microsoft Script Debugger (http://www.microsoft.com/downloads/details.aspx?familyid=2f465be0-94fd-4569-b3c4-dffdf19ccd99&displaylang=en). If you have Office installed, you may also have Microsoft Script Editor installed. To use either of these, you need to turn on script debugging in IE. (uncheck Tools -> Internet Options -> Advanced -> Disable Script debugging).

You could also use Firebug Lite - which will work in IE & Opera. It's an external lib that will help you track down problems. It's sometimes more convenient than dealing with the MS Script Debugger.

Firebug
It's only for firefox but it should let you figure out what's happening on IE especially once you have the script line numbers.

You can use Visual Studio and enable debugging in browser
You can install FireBug plugin for Firefox, it's really good!
You can try to install IE8 beta 2 and use it in compatibility mode with built-in debugger.
Also in any line of your JS code you can write
debugger;
and this will be threated as breakpoint for any of the debug tools you use.
Cheers!

Aptana Studio provides JavaScript debugging for Firefox and IE

Firebug is the best all around client-side debugger. I frequently use it to debug CSS code as well as javascript. It allows you to easily find offending areas of code. I especially like the ability to modify tag attributes in the firebug pane and see the effects immediately before committing. Very useful for anyone designing websites.

You could use this tool apparently - Microsoft Script Debugger
Personally I try to go through the code and figure out what's going on - it gives you the line number where it goes wrong right?

To make the Microsoft Script Debugger more user friendly (and to add javascript error messages that actually are helpful to IE), I highly recommend Companion.JS.

Firebug seems to be the most useful so far. When a page is running on firebug, it can be very handy to log messages into firebug via javascript calls to console.log('your log message'); but don't execute that code in IE since the console object is only in scope when firebug is running.
For IE, other folks have mentioned the Script Debugger. Although it is not primarily for javascript debugging, it can be useful to also add the IE developer toolbar, which allows you to easily and dynamically inspect the style and other properties of your page's DOM.

In response to mopoke, for IE6 you definitely want to use Visual Studio for debugging if you can get it. For all intents and purposes, the MS script debugger is useless. You're better off using some form of tracing (not alerts) than using the MS script debugger. Dojo Toolkit, for instance, provides a debug console for tracing, but you can write your own by dumping messages to a secondary window or div.
The script debugger needlessly prompts you on each error in IE6 and even then doesn't give you enough state context to make it useful in a sufficiently complex JS app. Visual Studio is more tightly integrated and much friendlier. Just my experience.

JavaScript Profiler in IE

Does anyone know a tool for Profiling JavaScript in IE?
List available:
IE8 (Internet Explorer 8 only)
JavaScript Profiler
YUI!

Checkout http://ejohn.org/blog/deep-tracing-of-internet-explorer/ the dynaTrace tool shown here is fantastic and works with IE7.

The Internet Explorer 8 beta (2) has a builtin Javascript profiler (in the developer toolbar). It's worth playing with at least...

JavaScript Profiler is a decent tool.

YUI also provides a profiler.

js-profiler also provide a profiler that is working in any browser and does not depend on any framework.

I don't think debugbar has a profiler.. but it does have a debugger and a console... so you can fake it...

We use Firebugs console.log, console.time and console.timeEnd (I think) a lot.
Firebug also has a built in profiler.