How to manage "uncaught exceptions" in JavaScript in order to show the error message in the user interface?

Question

When a Uncaught Exception is thrown in some website or web application, an error appears in the Develper tools in each browser

uncaught_exception

In Electron for instance, if an uncaught exception, the developer can set a listener and do whatever I want with the error message:

process.on('uncaughtException', function (error) {
    // Handle the error
}

So, I wonder if there is an easy way to do the same in JavaScript. This could be useful in order to record and store common errors when the users are working, or in order to show what's happening to the user, who can send feedback to the developers.

Something like this could be shown instead

modal_exception

Sometimes, if an error occurs the app become in a unstable state where everything is frozen, and the user do not know why. I think informing about the error is important.

I found this Error JavaScript object. It can be manually thrown, but that can be used only when try and catch are used, and not for the uncaught exceptions, where the developer made some mistakes.

ChesuCR · Accepted Answer · 2020-06-19 23:42:31Z

17

You can handle it as an event listener on window object.

window.onunhandledrejection = event => {
  console.warn(`UNHANDLED PROMISE REJECTION: ${event.reason}`);
};

window.onerror = function(message, source, lineNumber, colno, error) {
  console.warn(`UNHANDLED ERROR: ${error.stack}`);
};

Or also like this:

 window.addEventListener('error', function(event) { ... })

You can read more about the unhandledrejection event on the MDN web docs here and the onerror event on the docs here

edited Jun 19, 2020 at 23:42

ChesuCR

9,7526 gold badges58 silver badges121 bronze badges

answered Jun 19, 2020 at 17:51

Erin

5,8853 gold badges22 silver badges37 bronze badges

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

3 Comments

ChesuCR Over a year ago

Thanks !! That was what I was looking for :)

ChesuCR Over a year ago

By chance do you know if it is possible to get the stack trace from the event object? because I am only able to get the "reason"

ChesuCR Over a year ago

I found how to do it, I just added all the possible arguments to onerror

Antariksh Gosain · Accepted Answer · 2020-06-19 17:38:31Z

-3

try {
  // YOUR CODE GOES HERE
} catch (e) {
 if ( e instanceof CustomExceptionError ) {
    // ...
  } else if ( e instanceof OtherExceptionError ) {
    // ...
  } else {
    // ...
  }
 //OR CALL THE ALERT BOX OR ANY OTHER UI CHANGE
}

answered Jun 19, 2020 at 17:38

Antariksh Gosain

113 bronze badges

5 Comments

ChesuCR Over a year ago

Thanks for answering. But please, read the whole question, I am looking something for uncaught exceptions. I comment your solution in the last paragraph

Donald Duck is with Ukraine Over a year ago

While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value.

ozanmuyes Over a year ago

I was going to give you a -1 but you only have 1 HP...

gre_gor Mar 1 at 6:34

@ozanmuyes You are supposed to vote on the answer, not the user.

ozanmuyes Mar 1 at 13:57

@gre_gor You are definitely right yet the answer has already necessary enough minus points. So didn't bother :shrug:

Collectives™ on Stack Overflow

How to manage "uncaught exceptions" in JavaScript in order to show the error message in the user interface?

2 Answers 2

3 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related