CODEWITHSUNDEEP
javascriptasp.netfirefoxfirebug
ghanshyam.mirani
ghanshyam.mirani

Reputation: 3101

How to debug JavaScript in Firebug in Firefox

i have web application in asp.net 2.0

i have following image in firebug

enter image description here

when i debug javascript using F10 whole line no 67 gets executed in one go, when i press F10 again line 68 gets executed

so in line no 67 there are more than one statements and they are executed in one go.

so how to debug statement by statement in firebug ??

thanks.

Upvotes: 1

Views: 415

Answers (2)

Spudley
Spudley

Reputation: 168655

This is a common problem when debugging minified javascript code.

Ideally you should be debugging with non-minified javascript. If this is your site, you should swap out the JS code for the dev versions while you're testing.

If it's a library, a lot of third party tools provide a .min.js version and a plain .js version, so swap out the .min.js and use the .js` instead for now. If it's your own code, you should have the original code to hand anyway.

Having said that, if it's library code, the odds are you don't need to debug it anyway; the problem is likely to be in your own code, not in the library. Set the break point in your own code, and step over any library calls.

If you must test your site using minified code, then you need to use a technology called "Source Maps" to help you.

A Source Map keeps a set of links betweeen the original un-minified JS code and the minified version that is being run. This allows you to debug your site using the minified code, but to see the original un-minified code in the debugger.

This is relatively new technology. I know it's definitely available in the Chrome. I'm not sure whether it's available in Firebug yet though. You might want to investigate a bit further. If it isn't available yet, it will be very soon. (maybe take a look at the beta version or the nightlies)

Of course even if it is available, in order to actually use it you need to have the original source code and the source map so the debugger can do the mapping. Again, third party libs should provide these for you. For your own code, you'll need to generate the map as part of the minifying process.

Further reading about source maps: http://net.tutsplus.com/tutorials/tools-and-tips/source-maps-101/

Hope that helps.

Upvotes: 1

Deblaton Jean-Philippe
Deblaton Jean-Philippe

Reputation: 11388

F10 and F11 to step into and to step over

Upvotes: 0

Related Questions