"Out of stack space" in IE

[HalfLegend]

I am facing with a "Out of stack space" in IE

SCRIPT28: Out of stack space
File: zone.js, Line: 385, Column: 18
SCRIPT2343: Stack overflow at line: 385

I am working with Angular2 and it is working fine in Chrome and firefox. But an error in IE.
My IE version is IE11 x64

Context of the error code:

            ZoneDelegate.prototype.scheduleTask = function (targetZone, task) {
                try {
                    if (this._scheduleTaskZS) {
                        return this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this.zone, targetZone, task);
                    }
                    else if (task.scheduleFn) {
                        task.scheduleFn(task);
                    }
                    else if (task.type == 'microTask') {
                        scheduleMicroTask(task);
                    }
                    else {
                        throw new Error('Task is missing scheduleFn.');
                    }
                    return task; //<--- HERE is the error
                }
                finally {
                    if (targetZone == this.zone) {
                        this._updateTaskCount(task.type, 1);
                    }
                }
            };

[Delagen]

The same with angular 2 application in IE11

[Delagen]

Any movement in solve issue? This cause endless wrap from DirectiveNormalizer.normalizeTemplateAsync point

[Delagen]

Seems some polyfill issue. Corrected polyfills

[vicb]

outdated

[freezy]

Same issue here.

@Delagen Could you solve the problem? Which polyfill did you correct and how?

[Delagen]

@freezy I only replaced some polyfills with recommended in angular 2 docs, and issue was gone.

[freezy]

@Delagen I'm using the same polyfills.browser.ts as the one from the official Angular seed project. In the official doc I've only found the browser support page that only gives broad suggestions about the polyfills.

I've also tried just putting

import 'core-js/es6';
import 'core-js/es7/reflect';
require('zone.js/dist/zone');

as described here, with the same result. Could you be a bit more specific what you've changed, which polyfills and which versions you're using?

[Delagen]

Please see: https://angular.io/docs/ts/latest/guide/browser-support.html

import 'ie-shim'; // Internet Explorer 9 support

ie-shim use only requestAnimationFrame polyfill

You may use Animation feature

this not works in IE9 and require https://github.com/web-animations/web-animations-js for IE10+

also please check that no polyfills override or wrap setTimeout or setImmediate or other related functions

[freezy]

I've tried adding ie-shim as well as web-animations, same infinite loop. Chrome and Firefox still work perfectly while Safari and IE run into the loop.

This is a nightmare. I have no idea how to debug this. I will need to start from a minimal project and re-add component by component until I see where the problem is. The stacktrace is useless. Sometimes it's zone.js#436, sometimes polyfills.bundle.js#15501, as far as I can tell it doesn't even originate from anywhere in my code.

[Delagen]

Try to start with simple core-js import instead of

import 'core-js/es6';
import 'core-js/es7/reflect';

[sylvainpolletvillard]

I have the same issue, SCRIPT28: Out of stack space on app startup on IE11 when everything is working fine with Chrome and Firefox.

Here is what I tried:

• remove "zone.js/dist/long-stack-trace-zone" from polyfills
• replace "es6-shim" polyfill by "core-js" as suggested ; it leads me to another issue (TypeError: Object doesn't support property or method 'keys' angular#6479) telling me I have to use es6-shim. For some reason core-js polyfills Map but does not add a keys() method.
• change my loading setup to use SystemJS as suggested in Angular 2 Quickstart, instead of a simple script tag to load my app bundle

Currently my polyfills are :

• es6-shim/es6-shim.min.js
• whatwg-fetch/fetch.js
• reflect-metadata/Reflect.js
• zone.js/dist/zone.js

It seems to be an issue related to zone.js but I have no idea how to debug this.

EDIT: I found the solution. It comes from one of our dependencies that enforces its own Promise implementation (from https://github.com/stefanpenner/es6-promise). Using this polyfill, zone.js silently fails and the application does not load. The solution is to remove any other Promise polyfill and use the one provided by zone.js.