v0.7+ - custom Error classes do not work as expected

[michaelbromley]

Zone.js version: 0.7.2

Setup:

class MyError extends Error {}
let error = new MyError();
console.log(error instanceof MyError);

Expected: logs true
Actual: logs false - error is an instance of Error, rather than MyError when zone.js is loaded in the app.

Demo: https://plnkr.co/edit/kSKVeuhIrMcluK1D9JSl?p=preview
Look in the console to see the erroneous behaviour, and then comment out the script tag including zone.js; and the correct behaviour will be observed in the console.

Replacing the version in the <script> tag with 0.6.26 in the above Plunker demo demonstrates correct behaviour - so this bug was introduced with v0.7+ it seems.

[JiaLiPassion]

The reason is ZoneAwareError override the global Error so the error prototype is NativeError's prototype, I would like to try to fix this one.

[chuckjaz]

Re-opening this bug as the fix was reverted.

This change broke an assumption that calling Error directly is valid and, in particular, broke rxjs. See https://plnkr.co/edit/SYPR2SRi0xayQ693jJAB?p=preview for an example of the break.

[michaelbromley]

Thanks all for the fix. I can see a lot of work and thought has gone into it.

Any idea when this will be available for release? This is the only thing stopping me from updating a project which is stuck on rc.4 to the latest Angular release.

[mhevery]

v0.7.5 has been released just for you. :-)

…

On Wed, Jan 11, 2017 at 1:13 AM, Michael Bromley ***@***.***> wrote: Thanks all for the fix. I can see a lot of work and thought has gone into it. Any idea when this will be available for release? This is the only thing stopping me from updating a project which is stuck on rc.4 to the latest Angular release. — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub <#546 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAG1T4kS-biKLCaiIfOdSPp5kXhTP030ks5rRJ1OgaJpZM4LOMBh> .

[akaztp]

This stopped working correctly using class in a typescript file on zone.js@0.8.10 and up until 0.8.20.
Worked correctly from 0.8.5 to 0.8.9.
Using class in javascript like the plunkr above works correctly on 0.8.20.

https://stackblitz.com/edit/angular-naymwh?embed=1&file=src/main.ts

This is the basic tour of heroes example where I've added the testing code from the plunkr above to the main.ts. Check the console.

[JiaLiPassion]

@akaztp , I don't think it is a zone.js issue, without zone.js and angular, pure typescript will produce the same result, https://codepen.io/JiaLiPassion/pen/eVLRdV?editors=1111

[akaztp]

Thank you for your answer @JiaLiPassion
But then, how come with zone.js before V0.8.10, it works? Maybe it masks the conditions for that misbehaviour in typescript!
I better think of an alternative to that instanceof!

[JiaLiPassion]

@akaztp , in older version of zone.js, it will load a ZoneAwareError which patches global.Error, and in ZoneAwareError, it handles the extends issue, but because ZoneAwareError will have performance impact, so it is not loaded by default. you can add

import `zone.js/dist/zone-error`;

in your src/environments/environment.ts, so it will only impact your dev environment, of course you can also deploy it to product environment, if you want to do that, you don't need to add it to environment.ts, you can just import it in polyfill.ts.

import `zone.js/dist/zone`;
import `zone.js/dist/zone-error`;