Search code examples
javascriptexceptionfirefox-developer-tools

Inspect an Exception object like a normal object in Firefox dev tools

I'm trying to debug an issue where I have an exception being thrown and caught. When I log it to the console, Firefox displays it completely differently from a normal object:

enter image description here

I can force it to display like a normal object by doing JSON.parse(JSON.stringify(e)), but is there a less clunky way?

Solution

  • When you set a breakpoint within the catch block, you can see the exception's properties using the Scopes panel in the sidebar of the Debugger panel.

    In that panel, all objects of the current stack frame are shown under the Block scope.

    Exception object

    In addition to that, I have now also created an enhancement request asking to add a way to display an exception's properties within the console.

    PS: To log errors, you can use console.error() instead of console.log().