CODEWITHSUNDEEP
angularexceptionpromiseangular5
Asoub
Asoub

Reputation: 2371

Angular Promise not logging uncaught exception

I am currently using Angular 5.2.4. I've recently realised that exceptions/errors thrown inside a promise disappeared when they are not catched.

I remembered that this used to be the normal behavior of Promise on previous version of angular, but now it should display something like:

Unhandled Promise rejection: exception message, etc.

Now, if I use this code (as component):

import { Component, OnInit } from "@angular/core";

@Component({
  selector: "o-test-component",
  template: "<button (click)='test()'>test button</button>",
  styles: [""]
})
export class TestComponentComponent implements OnInit {
  constructor() {}

  ngOnInit() {}

  test() {
    console.log("testing ...");
    const a = new Promise((resolve, reject) => {
      reject("rejecting a");
    });
    a.then(() => console.log("test"));
    console.log("test2");
    const m = new Promise((resolve, reject) => {
      throw new Error("throwing b");
    });
    console.log("end test");
  }
}

I get:

testing ...

test2

end test

No such "uncaught exception" is ever logged when I click the button.

If I copy the test() method content directly in chrome console, I get these:

Unhandled Promise rejection: throwing b ; Zone: <root> ; Task: null ; Value: Error: throwing b
at Promise (<anonymous>:8:13)
at new ZoneAwarePromise (zone.js:875)
at <anonymous>:7:15 Error: throwing b
at Promise (<anonymous>:8:13)
at new ZoneAwarePromise (webpack-internal:///../../../../zone.js/dist/zone.js:875:29)
at <anonymous>:7:15

And

Unhandled Promise rejection: rejecting a ; Zone: <root> ; Task: Promise.then ; Value: rejecting a undefined

Any idea on why there are no logs in component? Is this normal ? Or maybe there is something in my project that prevents logging of uncaught exception thrown in promise ?

I've heard that the bluebird library can solve this problem, but that now it shouldn't be used for this as logging should be default behavior (now that Promise is native)

Upvotes: 3

Views: 1404

Answers (1)

Asoub
Asoub

Reputation: 2371

Short answer

Well, for some reason, the file where errors were logged (core.js) was filtered by the browsers. I saw it later, but there was a little "23 hidden" in the right corner. The left pane also displays all files where logs are created.

To solve this: in Chrome console, right click -> filter -> uncheck files that are filtered.

Other clues

If you're stuck on the problem and this is not your solution, you can read the comments of the question and check these:

-Check with multiple browsers.

-Check if you're using pollyfills for Promise. Default class for angular 5 are "ZoneAwarePromise"; use console.log(Promise) to display your.

-Check if they're displays when you use this stackblitz: stackblitz.com/edit/angular-kf8qdq

-Check if you don't have a custom error handler: something that catches "PromiseRejectionEvent"

-If you're using ZoneAwarePromise you can add debug breakpoints in zone.js and check in resolvePromise() where REJECTED_NO_CATCH code is being used if the error is adde in _uncaughtPromiseErrors array.

-Also check that api.showUncaughtError() returns true (even though the api.onUnhandledError() doesn't seem to be called)

Upvotes: 3

Related Questions