Showing JavaScript exception message in Chrome dev tools

Question

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?

trumank · Accepted Answer · 2012-10-13 18:19:24Z

6

+100

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

answered Oct 13, 2012 at 18:19

trumank

2,7943 gold badges23 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

PM5544 · Accepted Answer · 2012-10-13 23:36:59Z

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.

Alexander Pavlov · Accepted Answer · 2012-10-04 07:31:52Z

1

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

answered Oct 4, 2012 at 7:31

Alexander Pavlov

32.4k5 gold badges71 silver badges95 bronze badges

1 Comment

Lajos Nagy Over a year ago

That's correct ... if you're in the 'Not to pause on exceptions' mode! My question is about the other modes, when the useful red bubble does not show up.

tomdemuyt · Accepted Answer · 2012-10-16 15:35:58Z

0

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

answered Oct 16, 2012 at 15:35

tomdemuyt

4,5922 gold badges35 silver badges62 bronze badges

Comments

Carlos Martinez T · Accepted Answer · 2012-10-16 15:53:22Z

0

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.

answered Oct 16, 2012 at 15:53

Carlos Martinez T

6,5481 gold badge36 silver badges40 bronze badges

Collectives™ on Stack Overflow

Showing JavaScript exception message in Chrome dev tools

5 Answers 5

Comments

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related