View Full Version : [FIXED][3.0rc1] Ext samples: resizable snapping bug

30 Apr 2009, 3:54 AM
On the Ext Resizable examples page:


I can reproduce the following issue consistently in firefox:
1. Grab the "snapping" resizable area's resizer
2. Very quickly ("throw") move your mouse to the left and release the mouse button
3. The resizable area becomes width and height 0.

See the attached screenshot for an example.

1 May 2009, 6:33 PM
Reproduced this one consistently on the textarea. Could not reproduce it on any of the other ones. Environment is Linux FF3. Marking this as open.

1 May 2009, 9:28 PM
Duplicate of this bugreport (http://www.extjs.com/forum/showthread.php?t=42209).

16 Jun 2009, 7:42 PM
The reported problem can be solved by doing this

Ext.EspiResizable = Ext.extend(Ext.Resizable, {
// private
constrain: function(v, diff, m, mx) {
var orig_diff = diff;
if (v - diff < m) {
diff = v - m;
} else if (v - diff > mx) {
diff = mx - v;
if (orig_diff < 0 && diff > 0 ||
orig_diff > 0 && diff < 0) diff = -diff;
return diff;
onMouseMove: function(e){
if (this.inMouseMove) return; // Getting rid of reentrance
this.inMouseMove = true;
Ext.EspiResizable.superclass.onMouseMove.call(this, e);
this.inMouseMove = null;
Please use this patch to include this fix into the final release.

16 Jun 2009, 11:55 PM
Could you highlight the differences in red please just for the interest of those following, and to make it easy for the dev team to see what you've done?

17 Jun 2009, 12:08 AM
The constrain function does indeed look wrong, but shouldn't it be:

Ext.override(Ext.Resizable, {
constrain : function(v, diff, m, mx){
if(v - diff < m){
diff = v - m;
}else if(v - diff > mx){
diff = v - mx /*- v*/;
return diff;
or even shorter:

Ext.override(Ext.Resizable, {
constrain : function(v, diff, m, mx){
return v - (v - diff).constrain(m, mx);

17 Jun 2009, 1:48 AM
After apply Condor's fix I wasn't able to reproduce this issue. Anyone else?

17 Jun 2009, 11:41 AM
What I did is to avoid reentrance to onMouseMove. The real issue here is that the sign of diff is not preserved in function constrain. As long as you preserve the sign of diff (negative or positive, as it comes originaly as an argument) the error is not reproducible. Anyone can reproduce this issue with my patch?

17 Jun 2009, 2:53 PM
I have a problem with Condor's fix. I wasn't able to reproduce it with my fix, but it doesn't mean that my code doesn't have the same problem.
After a while of resizing a resizable div using a lot the west handle and then the east handle, it desapeared.
I'm trying to reproduce it with my code.

17 Jun 2009, 3:19 PM
After a long time resizing the div, the div disapeared at MouseUp with my code too.
I keep resizing the whole time and only released the mouse button once and it disapeared.

DIV's properties before the error:
position: relative;
width: 198px;
height: 398px;
left: 800px;
top: 200px;

DIV's properties after the error:
position: relative;
width: 48px;
height: 48px;
left: -6px;
top: -81px;

As you can see, the top property was also affected. It should not be possible as the onMouseMove function only affects the left and width values when working with the west handle.
Note: no matter where the div is located when this bug is reproduced, the resulting sizes are always the same.

19 Jun 2009, 1:23 AM
A fix for this has been committed to SVN, sometimes the mousemove event would fire after mouseup. so just setting a flag seems to do the trick. Might not be the best solution, but it seems to work correctly.