Thank you for reporting this bug. We will make it our priority to review this report.
  1. 28 Oct 2010 8:19 AM #1
    cgi-bin
    cgi-bin is offline
    Sencha User
    Join Date
    Apr 2007
    Posts
    58
    Vote Rating
    0
    cgi-bin is on a distinguished road
      0  

    Default [FIXED] Upgrade from 3.2.1 to 3.3.0 -> script in body broken

    [FIXED] Upgrade from 3.2.1 to 3.3.0 -> script in body broken


    I updated the following files:
    ext-all.js
    adapter/ext/ext-base.js
    css/ext-all.css

    My main page breaks with:
    Error: Ext.fly(d) is null
    Source File: /js/ExtJS/ext-all.js
    Line: 7
    I ripped out most of my code, and eventually narrow it down that if I have any code in script tags in the body, I get the error... if all script in head, it works...

    This Works:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="/css/base.css" />
<link rel="stylesheet" type="text/css" href="/css/ExtJS/ext-all.css" />
<link rel="stylesheet" type="text/css" href="/css/ExtJS/ext-overrides.css" />

<script type="text/javascript" src="/js/ExtJS/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/js/ExtJS/ext-all.js"></script>


<script type="text/javascript">
Ext.BLANK_IMAGE_URL = '/img/ExtJS/default/s.gif';

Ext.onReady
(
	function()
	{
		var viewport = new Ext.Viewport
		({
			layout: 'border',
			items:
			[
				{
					region: 'north',
					height: 50,
					margins: '3 3 3 3',
					contentEl: 'north_content'
				},
				{
					region: 'south',
					height: 25,
					margins: '3 3 3 3',
					contentEl: 'south_content'
				},
				{
					region: 'west',
					header: false,
					width: 200,
					lines: false,
					autoScroll: true,
					margins: '0 3 0 3',
					contentEl: 'west_content'
				},
				{
					region: 'center',
					margins: '0 3 0 0',
					contentEl: 'center_content'
				}
			]
		});

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

<div id="west_content" class="x-hide-display">
	West Panel
</div>

<div id="north_content" class="x-hide-display">
	Testing
</div>

<div id="center_content" class="x-hide-display">
Some sort of initial content would go here...
</div>

<div id="south_content" class="x-hide-display">
	<p>footer/status/etc goes here...</p>
</div>
</body>
</html>
    This gives Ext.fly() is null error:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="/css/base.css" />
<link rel="stylesheet" type="text/css" href="/css/ExtJS/ext-all.css" />
<link rel="stylesheet" type="text/css" href="/css/ExtJS/ext-overrides.css" />
</head>
<body>
<script type="text/javascript" src="/js/ExtJS/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/js/ExtJS/ext-all.js"></script>

<script type="text/javascript">
Ext.BLANK_IMAGE_URL = '/img/ExtJS/default/s.gif';

Ext.onReady
(
	function()
	{
		var viewport = new Ext.Viewport
		({
			layout: 'border',
			items:
			[
				{
					region: 'north',
					height: 50,
					margins: '3 3 3 3',
					contentEl: 'north_content'
				},
				{
					region: 'south',
					height: 25,
					margins: '3 3 3 3',
					contentEl: 'south_content'
				},
				{
					region: 'west',
					header: false,
					width: 200,
					lines: false,
					autoScroll: true,
					margins: '0 3 0 3',
					contentEl: 'west_content'
				},
				{
					region: 'center',
					margins: '0 3 0 0',
					contentEl: 'center_content'
				}
			]
		});

	}
);
</script>

<div id="west_content" class="x-hide-display">
	West Panel
</div>

<div id="north_content" class="x-hide-display">
	Testing
</div>

<div id="center_content" class="x-hide-display">
Some sort of initial content would go here...
</div>

<div id="south_content" class="x-hide-display">
	<p>footer/status/etc goes here...</p>
</div>
</body>
</html>
    Very simply: the only difference is that the </head><body> tags were moved about 50 lines up or down.

    Basically why I had the code tags in the body is that I was trying to use the load screen indicators, changing status messages at various stages. Very similar to how the ExtJS site itself uses loading masks.
    Reply With Quote Reply With Quote
  2. 28 Oct 2010 8:25 AM #2
    cgi-bin
    cgi-bin is offline
    Sencha User
    Join Date
    Apr 2007
    Posts
    58
    Vote Rating
    0
    cgi-bin is on a distinguished road
      0  

    Default


    Also, to be clear... BOTH examples worked in 3.2.1
    Reply With Quote Reply With Quote
  3. 28 Oct 2010 2:03 PM #3
    jclawson
    jclawson is offline
    Ext User jclawson's Avatar
    Join Date
    Mar 2007
    Location
    Denver, Colorado
    Posts
    145
    Vote Rating
    1
    jclawson is on a distinguished road
      0  
    Send a message via AIM to jclawson Send a message via Yahoo to jclawson

    Default Ext.onReady seems to be broken

    Ext.onReady seems to be broken


    I am currently debugging an issue related to Ext.onReady in an upgrade from 3.2 to 3.3. All I can say now is that It definitely functions differently. Ext.onReady seems to be firing before the document is completely loaded in FF and Chrome. It seems to work correctly in IE. From a quick glance, its likely this is your problem as well.
    Advanced Web Development Blog
    Reply With Quote Reply With Quote
  4. 28 Oct 2010 2:31 PM #4
    jclawson
    jclawson is offline
    Ext User jclawson's Avatar
    Join Date
    Mar 2007
    Location
    Denver, Colorado
    Posts
    145
    Vote Rating
    1
    jclawson is on a distinguished road
      0  
    Send a message via AIM to jclawson Send a message via Yahoo to jclawson

    Default


    I found the bug. The offending change is on line 645 of EventManager.js:

    PHP Code:
    /*
         * Assert Ext.isReady here. If Ext is loaded after the document is ready, none of the native 
         * DOM onReady events will fire, because they have already passed.
         */
            Ext.isReady = initExtCss();
        
        if (!    Ext.isReady) {
                Ext.onReady(initExtCss);
        } 
    This is setting Ext.isReady to true before the page is fully initialized. This causes Ext.onReady's that get added after to immediately execute even if the DOM is not fully ready. Sencha... please change this back to what it was in 3.2.1:
    PHP Code:
       if(!initExtCss()){
                Ext.onReady(initExtCss);
        } 
    Advanced Web Development Blog
    Reply With Quote Reply With Quote
  5. 29 Oct 2010 11:54 AM #5
    MakFracta
    MakFracta is offline
    Sencha User
    Join Date
    Jan 2009
    Posts
    18
    Vote Rating
    6
    MakFracta is on a distinguished road
      0  

    Thumbs up jclawson is Right

    jclawson is Right


    I've found the same in IE 8. Some pages seems to work fine but on those with a lot of JavaScript references at the bottom, the onReady always triggers before the document loading is complete.

    jclawson is right. If you comment the line:

    PHP Code:
    /* 
         * Assert Ext.isReady here. If Ext is loaded after the document is ready, none of the native  
         * DOM onReady events will fire, because they have already passed. 
         */ 
        
        //!!!!COMMENT THIS LINE
        //Ext.isReady = initExtCss(); 
         
            if (!Ext.isReady) { 
                Ext.onReady(initExtCss); 
        } 
    Everything seems to works just fine until now. The page even seems to load faster.

    If somebody wants a fast solution until the official realese you can find this code at line number 4882 of ext-all-debug.js, in this file there is no comment at all. Thanks
    Reply With Quote Reply With Quote
  6. 3 Nov 2010 10:05 PM #6
    meroy
    meroy is offline
    Sencha User
    Join Date
    Jun 2009
    Posts
    750
    Vote Rating
    0
    meroy is on a distinguished road
      0  

    Default


    This has been fixed in SVN after the 3.3 release.
    Reply With Quote Reply With Quote
  7. 2 Dec 2010 11:19 PM #7
    kagupta@quark.com
    kagupta@quark.com is offline
    Ext JS Premium Member
    Join Date
    Aug 2008
    Posts
    171
    Vote Rating
    0
    kagupta@quark.com is on a distinguished road
      0  

    Default


    Is this fix available in ExtJS 3.3.1?

    Thanks

    Kapil
    Reply With Quote Reply With Quote
  8. 3 Dec 2010 3:58 AM #8
    Condor
    Condor is offline
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,251
    Vote Rating
    41
    Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold
      0  

    Default


    Yes.
    Reply With Quote Reply With Quote

Similar Threads

  1. [FIXED][3.??] Chart: axis titles + upgrade to latest Yahoo Charts
    By AlsonKemp in forum Ext 3.x: Bugs
    Replies: 5
    Last Post: 27 Jul 2009, 9:48 AM
  2. [FIXED][3.0.0] upgrade to 3.0 has grid view changed? or Ext.fly?
    By charleshimmer in forum Ext 3.x: Bugs
    Replies: 9
    Last Post: 17 Jul 2009, 3:43 PM
  3. [FIXED][3.0RC1.1] DateField Display Issue on Upgrade from 2.2
    By systemlevel in forum Ext 3.x: Bugs
    Replies: 5
    Last Post: 26 May 2009, 8:15 PM
  4. Panel Style Broken on body.update
    By dancablam in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 26 Jan 2009, 5:06 PM
  5. [FIXED] [1.1.3] Grid headers/body alignment broken in FF
    By abickford in forum Ext GWT: Bugs (1.x)
    Replies: 1
    Last Post: 12 Nov 2008, 9:34 PM