How do I debug a “[object ErrorEvent] thrown” erro

Question

I have several failing tests that only output [object ErrorEvent] thrown. I don't see anything in the console that helps me pinpoint the offending code. Is there something I need to do to track these down?

[EDIT]: I'm running Karma v1.70, Jasmine v2.7.0

Answer 1

TL;DR: It may be related to testing routing.

I'm getting [object ErrorEvent] thrown too. An hour later, traced it to one line of code.

this.username = this.userService.getUser(this.route.snapshot.paramMap.get('id'))[0];

The problem lies with the test environment attempting to evaluate this.route.snapshot.paramMap.get('id').

If I replace it with 0, [object ErrorEvent] thrown goes away.

My userService has a user like so:

public users = [ ["admin", "First name", "Surname", etc... ] ].

So 0 just gets this user, at index 0.

Otherwise when normally running my app, this.route.snapshot.paramMap.get('id') is evaluated when the user selects a user to edit from my table of users.

So in my HTML, *ngFor="let user of users; index as i" loops to display all the users then routerLink="/edit/{{i}}" so you can click on edit buttons for each user, which when clicked go to e.g. http://localhost:4200/edit/0 to edit the aforementioned admin user's details.

Answer 2

To fix that you have to run your tests without sourcemaps as a workaround:

CLI v6.0.8 and above
--source-map=false

CLI v6.0.x early versions
--sourceMap=false

CLI v1.x
--sourcemaps=false

Shortcut ng test -sm=false might also work

There is an open issue on that https://github.com/angular/angular-cli/issues/7296

UPDATE: I had that issue as well, so I just migrated to the latest cli and make sure that all packages are updated in package.json also I fully reinstalled the node_modules so now the issue has gone.

Answer 3

What can help is, if you have the Chrome window open for your Karma test runner, to open the developer tools and check the console there. For me, this helped me to find out that the app could not use the Array.findIndex method on an undefined array (because the data structure was organized by a date string, such as data[2018][3][28], and I happened to be pointing to the wrong date), but yet instead of just stopping at the error, the test kept running.

Answer 4

I had the same problem. One way this error happens is when you try to access anything null or undefined in template. Make sure you have safety checking on those variable.

For example this will throw [object: ErrorEvent] when config is undefined on component load.

template.html

<div *ngIf="config.options">
   .....
   ......
</div>

Do this instead

<div *ngIf="config?.options">
   .....
   ......
</div>

Answer 5

It appeared to be an async problem, because after I added enough its in one of my component specs, I was able to get a usable error message which pointed to a file and line within that file (it was related to paramMap.

In the spec that tested ParamMap, I just added:

  describe('this test', () => {
    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });
  });

Answer 6

For me the issue was that I had a test where I was accidentally using the auth0-lock library.