Angular 2 not working with MS Edge

Question

I get script errors when I'm loading my app in MS Edge. However Firefox, Chrome, IE11 all work, except for Edge...

Here's a screenshot of the console:

See here:

HTML1300: Navigation occurred.
localhost:23752
SCRIPT65535: Argument not optional
zone.js (556,13)
SCRIPT257: Could not complete the operation due to error 80020101.
localhost:23752 (1,1)
Unhandled Promise rejection: 'Zone' is undefined ; Zone: <root> ; Task:     Promise.then ; Value: ReferenceError: 'Zone' is undefined ReferenceError: 'Zone' is undefined
at NgZoneImpl (eval code:8749:13)
at NgZone (eval code:8902:13)
at PlatformRef_.prototype._bootstrapModuleFactoryWithZone (eval code:9447:17)
at Anonymous function (eval code:9489:50)
at ZoneDelegate.prototype.invoke (http://localhost:23752/node_modules/zone.js/dist/zone.js:190:13)
at Zone.prototype.run (http://localhost:23752/node_modules/zone.js/dist/zone.js:85:17)
at Anonymous function (http://localhost:23752/node_modules/zone.js/dist/zone.js:451:17)
at ZoneDelegate.prototype.invokeTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:223:17)
at Zone.prototype.runTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:125:21)
at drainMicroTaskQueue (http://localhost:23752/node_modules/zone.js/dist/zone.js:357:25)
zone.js (344,13)
"Unhandled Promise rejection:"
"'Zone' is undefined"
"; Zone:"
"<root>"
"; Task:"
"Promise.then"
"; Value:"
{
  [functions]: ,
  __proto__: { },
  description: "'Zone' is undefined",
  message: "'Zone' is undefined",
  name: "ReferenceError",
  number: -2146823279,
  stack: "ReferenceError: 'Zone' is undefined
 at NgZoneImpl (eval code:8749:13)
 at NgZone (eval code:8902:13)
 at PlatformRef_.prototype._bootstrapModuleFactoryWithZone (eval code:9447:17)
 at Anonymous function (eval code:9489:50)
 at ZoneDelegate.prototype.invoke (http://localhost:23752/node_modules/zone.js/dist/zone.js:190:13)
 at Zone.prototype.run (http://localhost:23752/node_modules/zone.js/dist/zone.js:85:17)
 at Anonymous function (http://localhost:23752/node_modules/zone.js/dist/zone.js:451:17)
 at ZoneDelegate.prototype.invokeTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:223:17)
 at Zone.prototype.runTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:125:21)
 at drainMicroTaskQueue (http://localhost:23752/node_modules/zone.js/dist/zone.js:357:25)"
}
"ReferenceError: 'Zone' is undefined
at NgZoneImpl (eval code:8749:13)
at NgZone (eval code:8902:13)
at PlatformRef_.prototype._bootstrapModuleFactoryWithZone (eval code:9447:17)
at Anonymous function (eval code:9489:50)
at ZoneDelegate.prototype.invoke (http://localhost:23752/node_modules/zone.js/dist/zone.js:190:13)
at Zone.prototype.run (http://localhost:23752/node_modules/zone.js/dist/zone.js:85:17)
at Anonymous function (http://localhost:23752/node_modules/zone.js/dist/zone.js:451:17)
at ZoneDelegate.prototype.invokeTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:223:17)
at Zone.prototype.runTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:125:21)
at drainMicroTaskQueue (http://localhost:23752/node_modules/zone.js/dist/zone.js:357:25)"

Error: Uncaught (in promise): ReferenceError: 'Zone' is undefined
zone.js (346,9)
{
  [functions]: ,
  __proto__: { },
  description: "Uncaught (in promise): ReferenceError: 'Zone' is undefined",
  message: "Uncaught (in promise): ReferenceError: 'Zone' is undefined",
  name: "Error",
  promise: { },
  rejection: { },
  stack: "Error: Uncaught (in promise): ReferenceError: 'Zone' is undefined
 at resolvePromise (http://localhost:23752/node_modules/zone.js/dist/zone.js:418:25)
 at Anonymous function (http://localhost:23752/node_modules/zone.js/dist/zone.js:454:17)
 at ZoneDelegate.prototype.invokeTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:223:17)
 at Zone.prototype.runTask (http://localhost:23752/node_modules/zone.js/dist/zone.js:125:21)
 at drainMicroTaskQueue (http://localhost:23752/node_modules/zone.js/dist/zone.js:357:25)
 at g (http://localhost:23752/node_modules/core-js/client/shim.min.js:8:10014)
 at Anonymous function (http://localhost:23752/node_modules/core-js/client/shim.min.js:8:10138)
 at k (http://localhost:23752/node_modules/core-js/client/shim.min.js:8:14293)",
  task: {
     [functions]: ,
     __proto__: { },
     cancelFn: null,
     data: undefined,
     runCount: 1,
     scheduleFn: undefined,
     source: "Promise.then",
     type: "microTask",
     zone: { }
   },
   zone: {
     [functions]: ,
     __proto__: { },
     _name: "<root>",
     _parent: null,
     _properties: { },
     _zoneDelegate: { },
     name: "<root>",
     parent: null
   }
}

What I also noticed was the Argument not optional in zone.js on line 556

which is in

 if (NativePromise) {
    patchThen(NativePromise);
    if (typeof global['fetch'] !== 'undefined') {
        var fetchPromise = global['fetch']();
        // ignore output to prevent error;
        fetchPromise.then(function () { return null; }, function () { return null; });
        if (fetchPromise.constructor != NativePromise) {
            patchThen(fetchPromise.constructor);
        }
    }
}

and the specific line is:

var fetchPromise = global['fetch']();

Then there is the worrying error: "Could not complete the operation due to error 80020101"

There are a lot of solutions to that problem, removing double slashed comments, or html comments inside script tags, but none of them work.

Error 80020101

Does anyone have a clue?

I'm using latest MS insider preview Edge 39.14915.

Answer 1

I fixed this issue by updating zone.js from 0.6.21 => 0.6.25, available on CDN here https://unpkg.com/zone.js@0.6.25?main=browser or from their github repository.

Answer 2

It was confirmed that this bug is due to Windows 10 Insider preview with Ms Edge 39.14915 specifically in method global['fetch']();

Answer 3

Uncomment the polyfills in the polyfills.ts file in the application, see this answer for reference Angular2 app is not working on Microsoft edge