CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-devtools
Lajos Nagy
Lajos Nagy

Reputation: 9475

Showing JavaScript exception message in Chrome dev tools

I'm using Chrome development tools to debug my JavaScript. When I tell Chrome "Not to pause on exceptions" and load my script, I get an intelligible description of what went wrong with the correct line highlighted:

var back_buffer = goog.dom.getElement('back_buffer').getContext('2d');
  --> "Uncaught TypeError: Cannot call method 'getContext' of null"

OK, it makes sense: there's a typo in the name of my canvas element so 'getElement' returns null.

Now on to my question: when I tell Chrome to 'pause on uncaught exceptions', it still correctly highlights the offending line in my script, but now the nice, intelligible error descriptions is gone! How come? Even in debug mode I'd like to see the error message because it's very helpful. I poked around but couldn't find it anywhere.

Anybody could help here?

Upvotes: 3

Views: 3027

Answers (5)

Carlos Martinez T
Carlos Martinez T

Reputation: 6528

What if you catch the exception and send it to the log:

try
  {
       var back_buffer = goog.dom.getElement('back_buffer').getContext('2d');
  }
catch(err)
  {
        console.log(err);
  }

Once in the console you can examine the object in more detail.

Upvotes: 0

tomdemuyt
tomdemuyt

Reputation: 4592

Just do one more 'Step' and the red bubble will appear. This is logical as it pauses before the error/bubble behavior happens.

Upvotes: 0

PM5544
PM5544

Reputation: 720

The error is not showing because the execution of that script is paused just before it goes into the exception.

It's pausing right before the error so you can debug some things in the console. What i tend to do in the situation you talk about, and the scope variables are not giving any more info, is add some watch expressions or execute some commands in the console.

In your back_buffer case you could for instance add a watch expression like this goog.dom.getElement('back_buffer') so you could see what it resolves to. If that expression causes an error you will see the error message there like you would after the script error occurred.

It might not be completely obvious to some people that when script execution is halted the execution context is the same as the execution context of the script at the time it paused, so all local variables are accessible in the console to console.log() or console.dir() or anything.

When you have pretty print set to on there will be not that much going on on that one line it paused at so mostly you shouldn't have to search for long to get an idea of what's causing the error and why.

Hope it helps, PM5544.

Upvotes: 3

trumank
trumank

Reputation: 2794

There does not appear to be good way to do this currently. This is the closest you can get: enter image description here

Upvotes: 6

Alexander Pavlov
Alexander Pavlov

Reputation: 32296

You should be able see the same text in a red bubble message just under the offending source line once it executes.

Upvotes: 1

Related Questions