Sentry-javascript: raven-js doesn't work with a standard angular-cli app

[esistgut]

As soon as raven-js is called the angular app no longer works but only start some kind of infinite loop:

Uncaught RangeError: Maximum call stack size exceeded at http://localhost:4200/polyfills.bundle.js:5303:31 at XMLHttpRequest.proto.(anonymous function) (http://localhost:4200/polyfills.bundle.js:3819:24) at XMLHttpRequest.open (http://localhost:4200/vendor.bundle.js:4636:37) at Raven._makeRequest (http://localhost:4200/vendor.bundle.js:5317:17) at Raven._sendProcessedPayload (http://localhost:4200/vendor.bundle.js:5241:56) at Raven._send (http://localhost:4200/vendor.bundle.js:5183:22) at Raven._processException (http://localhost:4200/vendor.bundle.js:4957:14) at Raven._handleStackInfo (http://localhost:4200/vendor.bundle.js:4863:14) at Raven.captureException (http://localhost:4200/vendor.bundle.js:4001:18) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3937:22) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29) at XMLHttpRequest.wrapFn (http://localhost:4200/polyfills.bundle.js:3620:39) at XMLHttpRequest.wrapped [as __zone_symbol__ON_PROPERTYreadystatechange] (http://localhost:4200/vendor.bundle.js:3934:29)

Start a new angular-cli app using ng new, add the npm raven-js dependency, import and call it from the app.module.ts,
This is a minimal repository containing only an empty angular-cli app, the raven-js dep and just the initializing code (Raven.config().install() is enough to trigger the problem): https://github.com/esistgut/raventest

[colthreepv]

we tracked back the cause to [email protected], with the previous minor release, 0.8.16 everything still works

[tlaverdure]

I am experiencing this as well.

[LukasKlement]

Same issue here with angluar-cli 1.4.0 and zone.js 0.8.16.

The following console errors are thrown:
Firefox: InternalError: too much recursion
Other browsers: RangeError: Maximum call stack size exceeded

[rtm]

Is it likely that this problem can be solved in a future version of Raven? I would prefer not to have to lock down my version of zone.js for this kind of compatibility issue.

[mkoczorowski]

+1

[kamilogorek]

@LukasKlement @rtm @mkoczorowski, this issue is not on Raven.js implementation side, but rather on Zone.js. Thankfully they already patched it 5 days ago, and things are working correctly now.
It just has to be released as a patched version to npm. Please see 2 recent commits from Sep 6th – https://github.com/angular/zone.js/commits/master

You can test it yourself locally by changing your zone.js in your package.json to [email protected]:angular/zone.js.git#d4e5ae8f6e72f0b4ef8e816e369530b72e582ba7, eg.

"zone.js": "[email protected]:angular/zone.js.git#d4e5ae8f6e72f0b4ef8e816e369530b72e582ba7"

[kamilogorek]

To be more specific (as there are still plenty of reports of this issue), this is the commit that'll fix it – https://github.com/angular/zone.js/commit/d4e5ae8f6e72f0b4ef8e816e369530b72e582ba7

[kblestarge]

Ride on!
Upgrading zone.js to 0.8.18 worked for my Angular v.4+ app.

[mxman06]

@kblestarge

Are you sure ? I just upgraded zone.js to 0.8.18 and still have the loop error :(

[LukasKlement]

@mxman06 it works for me with zone.js 0.8.18 - perhaps there is another culprit?