PDA

View Full Version : [CLOSED][3.2.1] Ext.Element -> createChild



tobiu
13 Jul 2010, 7:52 AM
hi team,

this bug only occurs in chrome, in IE 8 and ff 3.6 this code works fine:



Ext.onReady(function(){
new Ext.Button({
renderTo: document.body,
text:'Hello World',
listeners : {
afterrender : function(btn){
btn.getEl().createChild({
tag: 'div',
id: 'btnChild'
});
}
}
});
});


the chrome console says:


Uncaught TypeError: Cannot read property 'nextSibling' of null


refering to the ieTable-function of Ext.DomHelper:



function ieTable(depth, s, h, e){
tempTableEl.innerHTML = [s, h, e].join('');
var i = -1,
el = tempTableEl,
ns;
while(++i < depth){
el = el.firstChild;
}

// here is the point chrome breaks, it seems that el == null
if(ns = el.nextSibling){
var df = document.createDocumentFragment();
while(el){
ns = el.nextSibling;
df.appendChild(el);
el = ns;
}
el = df;
}
return el;
}


i think that including



if(el && ns = el.nextSibling){


will do the trick but i have no idea how to change that method inside the DomHelper-singleton.


kind regards,
tobiu

evant
13 Jul 2010, 8:22 AM
Should that really work?

You're adding a div as a child to a table element. It's probably more good luck than anything else that it works.

tobiu
13 Jul 2010, 8:42 AM
hi even,

well, this makes sense. only tbody and tr-tags should be children of a table.

i found this one in Ext.ux.SwfUploadPanel, a non official ux.

so, i think the best way to go is to debug that ux ;)

feel free to close this report.

well, i already spent some time to check, what happens inside the domHelper, so maybe it helps someone else to see why chrome acts differently:

firefox calls
createdChild -> doInsert -> insertHTML

chrome calls:
createChild -> doInsert -> insertHTML -> insertIntoTable -> ieTable

so, the problem was in insertHTML, not ieTable:
there is a check:


if (el.insertAdjacentHTML)

returning true in chrome, false in other browsers.


kind regards and thanks for the table -> tr hint =)
tobiu