[CLOSED]Ext.History.init() bug?

[ody]

Just attempted to use Ext.History (ext 3.2.1), and get this error when calling init (from chrome) :

Uncaught TypeError: Cannot read property 'value' of null
startUp ext-all-debug.js:30124
init ext-all-debug.js:30176
(anonymous function) index.html:17
call 

Plain index.html included nothing but:

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

The fix as I would guess it, would be to change line 30145 (in ext-all-debug.js) from:

fieldId: 'x-history-field', 

to

fieldId: {value : 'x-history-field'}, 

Which appears to work for me, at least.

[ody]

Actually, it looks like it is something to do with the DOM element id:x-history-field not existing .. which I can see CSS for but nothing that creates the element. If I create a div in the body with id x-history-field all works as expected.

[ody]

I've put this in at line 30165ish:

if(!hiddenField || hiddenField == null)
{
    Ext.DomHelper.append('body', {tag: 'div', id: "x-history-field"});
    hiddenField = Ext.getDom(Ext.History.fieldId);
} 

I'm new to all this so not really sure if this is the best possible fix, would love some input either way.

[plalx]

It is not a bug, Ext.History class is designed that way.

By looking at a part of init() code:

hiddenField = Ext.getDom(Ext.History.fieldId);
if (Ext.isIE) {
    iframe = Ext.getDom(Ext.History.iframeId);
}

There is nothing creating the element, letting that task up to the developer.

It would still be a valid question to ask why they choosed not to create elements required by Ext.History automatically...

[ody]

ExtJS is to good, I keep making assumptions it's taking care of things.

[plalx]

I've put this in at line 30165ish:.

You should never directly modify the ext code since you will lose changes when updating the library.

You should simply override the class methods that you want using Ext.override().

In this specific case, you could only add this code to the Ext.onReady() function:

*Note: Ext.History class needs an hidden input field, not a div element.

Ext.DomHelper.append('body', {tag: 'input', type:'hidden', id: "x-history-field"});

You can also create an interceptor to Ext.History.init() function that would create the element before processing the function.

//Something like this

Ext.History.init = Ext.History.init.createInterceptor(function(){
       Ext.DomHelper.append('body', {tag: 'input', type:'hidden', id: "x-history-field"});
});

Look at the createInterceptor doc here.

[ody]

thanks scarsick! funnily I've learnt a lot by not RTFM :P

[ody]

This interceptor function has given me an idea..

Ext.ns('Ext.Debug');
Ext.Debug = function(){

    Ext.History.init = Ext.History.init.createInterceptor(function(){
        hiddenField = Ext.getDom(Ext.History.fieldId);
        if(!hiddenField || hiddenField == null)
        {
            alert('Ext.History.init: no hidden field defined.');
            return  false;
        }

        return true;
    });

    Ext.apply = Ext.History.init.createInterceptor(function(o, c, defaults){
        if(typeof o != "object" || typeof c != "object")
        {
            alert('Ext.apply: arguments must be of type object.');
            return false;
        }
        return true;
    });

}(); 

Every time I run into problems like these I'll simply add a test case to Ext.Debug. This can then be used by others to quickly pick up on common mistakes.

I've got this feeling that someone is going to tell me this has already been done :-D

[plalx]

I like the idea... this pattern could almost be used in the entire framework to give custom error messages that would help fixing bugs, without having the code polluted with error checking code.

[ody]

Do you or any mods/devs know the best way to get something like this off the ground? I know I could slap it on googlecode and add test cases as I stumble over the ExtJS library but that doesn't feel like it would be the best way forward.

Maybe starting a new thread somewhere asking for input from the community?