Page loading issue with Angular 2

[brian428]

I've got an Angular 2 app (based on https://github.com/mgechev/angular2-seed). Testing in the latest Chrome release. Everything is working fine until I include the jszip (or jszip.min) script. When I load the page with jszip included, rendering of the whole app just stops. If I take jszip back out, everything works again. I'm not even doing anything with JSZip yet. Simply loading the library triggers this.

Unfortunately, there are no errors thrown, so I really have no idea what the problem is. So I don't have a lot of information to provide on this, but I thought I'd add an issue in case this rings any bells with the folks running the project. I'm not sure why jszip (which I would assume has no UI interaction built into it all) would cause a problem (and a "silent" problem at that) with application loading. If anyone has any ideas, I'm all ears.

If I can, I'll try to replicate it in a more basic app.

[brian428]

I think I got things working by changing the timing of the script load. Loading it earlier (before some of the other scripts) seems to help. Still not sure why that would matter, but for now I'll go ahead and close this. Thanks.

[dduponchel]

That shouldn't happen. Did you reproduce this issue with a basic app ?

[natcohen]

Got the same problem, this issue should be re-opened.

It seems that the page loading problem appears when JSZip script is called after script(type='text/javascript' src="node_modules/zone.js/dist/zone.js")

[moritz-h]

Please reopen. I have the same problem. If i include JSZip before zone.js it works, if i include it after zone.js angular stops working.

I tried to figure out where the problem is and guess perhaps it has something to do with promises.
To test i started with the angular quickstart and tutorial and tested step by step when this error starts.
Look here: https://angular.io/docs/ts/latest/tutorial/

Until Step 4. "Multiple Components" everything is fine.
After Step 5. "Services" you can see the error if JSZip is included after zone.js.
I changed the return of the service to directly return the data instead of a promise and there is no error.
So i think this error has anything to do with promises.

[brian428]

Careful though. Zone does a lot of crazy stuff, so it's certainly possible that the issue is with Zone and not JSZip. However, Zone is being used/beaten on/tested by a lot of people, so one would hope that a problem like this would be noticed if it were indeed with Zone.

[moritz-h]

I was thinking of a conflict between zone and jszip, so the error could be on both sides. I was thinking of zone and jszip perhaps defining different things to the name "Promise". (I'm far from an javascript expert so i don't know if this thought is helpful)

But i played a little with the jszip source and changed 2 lines here:
https://github.com/Stuk/jszip/blob/master/dist/jszip.js#L289-L296

comment out line 298:
//var ES6Promise = require("es6-promise").Promise;

change line 295:
Promise: ES6Promise
to
Promise: Promise

so i assume Promise must be defined global or before, but with this changes the error is gone, at least for me.
(I know this not looks like a bugfix, but perhaps it can help finding where the bug comes from)

[dduponchel]

but perhaps it can help finding where the bug comes from

@moritz-h you're right !

Zone.js overwrites the global Promise with a ZoneAwarePromise. Then, JSZip calls es6-promise which replace (sometimes) the global Promise (bug #304), breaking everything.

[dduponchel]

Fixed in v3.1.0.