PDA

View Full Version : [CLOSED][3.x] Potential bug in AnchorLayout??



Animal
27 Apr 2009, 1:42 AM
I have just been tearing my hair out over a weird problem with layouts where they were not reflowing properly.

I tracked it down finally to AnchorLayout. There's nothing technically wrong with the code:



onLayout : function(ct, target){
Ext.layout.AnchorLayout.superclass.onLayout.call(this, ct, target);

var size = this.getAnchorViewSize(ct, target);

var w = size.width, h = size.height;

if(w < 20 && h < 20){
return;
}

// find the container anchoring size
var aw, ah;
if(ct.anchorSize){
if(typeof ct.anchorSize == 'number'){
aw = ct.anchorSize;
}else{
aw = ct.anchorSize.width;
ah = ct.anchorSize.height;
}
}else{
aw = ct.initialConfig.width;
ah = ct.initialConfig.height;
}

var cs = ct.items.items, len = cs.length, i, c, a, cw, ch;
for(i = 0; i < len; i++){
c = cs[i];
if(c.anchor){
a = c.anchorSpec;
if(!a){ // cache all anchor values
var vs = c.anchor.split(' ');
c.anchorSpec = a = {
right: this.parseAnchor(vs[0], c.initialConfig.width, aw),
bottom: this.parseAnchor(vs[1], c.initialConfig.height, ah)
};
}
cw = a.right ? this.adjustWidthAnchor(a.right(w), c) : undefined;
ch = a.bottom ? this.adjustHeightAnchor(a.bottom(h), c) : undefined;

if(cw || ch){
c.setSize(cw || undefined, ch || undefined);
}
}
}
},


But for some reason the Javascript runtime was refusing to see the function a.right as a truthy value, and so was setting cw to undefined.

I'd break at that line, and I could switch to the console and evaluate that whole expression and the value would come out as the correctly adjusted width, but when clicking Step into on that line, it just stepped over and cw ended up undefined.

I don't know in what circumstances the runtime does this, but the following more explicit test fixed it for me:



onLayout : function(ct, target){
Ext.layout.AnchorLayout.superclass.onLayout.call(this, ct, target);

var size = this.getAnchorViewSize(ct, target);

var w = size.width, h = size.height;

if(w < 20 && h < 20){
return;
}

// find the container anchoring size
var aw, ah;
if(ct.anchorSize){
if(typeof ct.anchorSize == 'number'){
aw = ct.anchorSize;
}else{
aw = ct.anchorSize.width;
ah = ct.anchorSize.height;
}
}else{
aw = ct.initialConfig.width;
ah = ct.initialConfig.height;
}

var cs = ct.items.items, len = cs.length, i, c, a, cw, ch;
for(i = 0; i < len; i++){
c = cs[i];
if(c.anchor){
a = c.anchorSpec;
if(!a){ // cache all anchor values
var vs = c.anchor.split(' ');
c.anchorSpec = a = {
right: this.parseAnchor(vs[0], c.initialConfig.width, aw),
bottom: this.parseAnchor(vs[1], c.initialConfig.height, ah)
};
}
cw = Ext.isFunction(a.right) ? this.adjustWidthAnchor(a.right(w), c) : undefined;
ch = Ext.isFunction(a.bottom) ? this.adjustHeightAnchor(a.bottom(h), c) : undefined;

if(cw || ch){
c.setSize(cw || undefined, ch || undefined);
}
}
}
},

evant
27 Apr 2009, 1:43 AM
Out of interest, was this happening in all browsers?

Animal
27 Apr 2009, 3:10 AM
Yes. It was really strange. None of my anchor layouts (ie forms) would lay out properly.

aconran
4 May 2009, 10:52 AM
So are you using an override at this point? Are you able to reproduce this?

Animal
5 May 2009, 12:56 AM
I can't reproduce it in an example page. I've been trying to create a version of examples/layout/complex.html to reproduce it, and I can't.

But yes, I am using an override which uses Ext.isFunction instead of a truth test. I just can't figure it out. Stepping through in Firebug would step over the statement with just a truth test!

mjlecomte
4 Jun 2009, 12:44 PM
Checking in here to see if there's any update. Looks like this one's is still marked INFOREQ seeking further information before elevating to OPEN status.

mjlecomte
16 Aug 2009, 11:33 AM
This thread has remained in INFOREQ status for some time now and I don't see any test case posted as requested per http://extjs.com/forum/showthread.php?p=341947#post341947.

I'm going to update the status to CLOSED in absence of a test case. Please post a test case to have the issue reopened.