IE8 stack overflow on Ext.app.Application creation (or something after it?)

**myExtJsUname** · 7 Sep 2012 10:11 AM

I am using ExtJs 4.1.1

In IE 8 (but not 9 and not in FF), I am getting a stack overflow message ("Stack overflow at line: 0") that I have managed to zero in on and create a reproducible example of that also follows the general setup of my code.

Code:

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all.css">
    <script type="text/javascript" src="/extjs/ext-debug.js"></script>

<script type="text/javascript">
Ext.onReady(
    function(){

// This causes the stack overflow message!
        Ext.create(
            "Ext.app.Application"
            ,{
                name: "Blah"
            }
        );


// This works!
//        Ext.application({
//            name: 'Blah'
//        });

    }
);
</script>
  </head>
  <body>
  </body>
</html>

I've managed to debug this somewhat and know that the Ext.EventManager.fireReadyEvent is completing, but then the code is going somewhere (I'm not sure where) and that stack overflow message appears.

I know that if you replace the above method of creating the app with the commented method shown below it, the stack overflow message doesn't appear and, after the Ext.EventManager.fireReadyEvent method is completed, it starts going through defining all the different ExtJs classes, like Ext.button.Button, Ext.toolbar.Item, etc. It also appears to run through the Ext.EventManager.fireReadyEvent a second time. But I can't find what is sparking those things to happen to try to determine why they are not in the code above.

Can anyone suggest what differences exist between creating the Ext.app.Application one way versus the other above that would cause a stack overflow to occur? We are extending the Ext.app.Application and need to instantiate our Application class not just go with the Ext.application approach.

Cheers
jtm

scottmartin

If you are using MVC, you should use Ext.Application as it ensures that all of the dependencies are ready as well as the controllers, models ..etc.

onReady just cares about the page itself.

You should only need to call Ext.Application ..
( it loads ext.app.application and the uses onready before ext.create() )

If you call onReady, then you will need to use ext.requires as you discovered.

Scott.

**myExtJsUname** · 7 Sep 2012 11:06 AM

I've added the line: "Ext.require("Ext.app.Application");" before the Ext.onReady function where the class is instantiated and that seems to have taken care of the message.

Code:

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="/eMAF/resources/ext-4.1.1/resources/css/ext-all.css">
    <script type="text/javascript" src="/eMAF/resources/ext-4.1.1/ext-debug.js"></script>

<script type="text/javascript">
Ext.require("Ext.app.Application");
Ext.onReady(
    function(){
//        Ext.application({
//            name: 'Blah'
//        });

        Ext.create(
            "Ext.app.Application"
            ,{
                name: "Blah"
            }
        );

        alert("Done!");
    }
);
</script>
  </head>
  <body>
  </body>
</html>

Does that make sense that that would be the solution or am I just somehow masking a problem that continues to exist by doing this?

Cheers,
jtm

**scottmartin** · 7 Sep 2012 12:01 PM

If you are using MVC, you should use Ext.Application as it ensures that all of the dependencies are ready as well as the controllers, models ..etc.

onReady just cares about the page itself.

You should only need to call Ext.Application ..
( it loads ext.app.application and the uses onready before ext.create() )

If you call onReady, then you will need to use ext.requires as you discovered.

Scott.

IE8 stack overflow on Ext.app.Application creation (or something after it?)

Thread Tools

Search Thread

Display

Answered: IE8 stack overflow on Ext.app.Application creation (or something after it?)

Answered: IE8 stack overflow on Ext.app.Application creation (or something after it?)