Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Draggable: Ensure overflow:visible containments are correctly measured
Fixes #7016
  • Loading branch information
mikesherov committed Aug 17, 2014
1 parent d10440f commit 48ea2aa
Show file tree
Hide file tree
Showing 2 changed files with 44 additions and 4 deletions.
30 changes: 30 additions & 0 deletions tests/unit/draggable/draggable_options.js
Expand Up @@ -374,6 +374,36 @@ test( "containment, account for border", function() {
"The draggable should be to the right of its parent's right border" );
});

// http://bugs.jqueryui.com/ticket/7016
// draggable can be pulled out of containment in Chrome and IE8
test( "containment, element cant be pulled out of container", function() {
expect( 1 );

var offsetBefore,
parent = $( "<div>").css({ width: 200, height: 200 }).appendTo( "#qunit-fixture" ),
element = $( "#draggable1" ).appendTo( parent );

element
.css({
height: "5px",
width: "5px"
})
.draggable({ containment: "parent" })
.simulate( "drag", {
dx: 200,
dy: 200
});

offsetBefore = element.offset();

element.simulate( "drag", {
dx: 200,
dy: 200
});

deepEqual( element.offset(), offsetBefore, "The draggable should not move past bottom right edge" );
});

test( "containment, default, switching after initialization", function() {
expect( 8 );

Expand Down
18 changes: 14 additions & 4 deletions ui/draggable.js
Expand Up @@ -439,7 +439,7 @@ $.widget("ui.draggable", $.ui.mouse, {

_setContainment: function() {

var over, c, ce,
var isUserScrollable, c, ce,
o = this.options,
document = this.document[ 0 ];

Expand Down Expand Up @@ -486,13 +486,23 @@ $.widget("ui.draggable", $.ui.mouse, {
return;
}

over = c.css( "overflow" ) !== "hidden";
isUserScrollable = /(scroll|auto)/.test( c.css( "overflow" ) );

this.containment = [
( parseInt( c.css( "borderLeftWidth" ), 10 ) || 0 ) + ( parseInt( c.css( "paddingLeft" ), 10 ) || 0 ),
( parseInt( c.css( "borderTopWidth" ), 10 ) || 0 ) + ( parseInt( c.css( "paddingTop" ), 10 ) || 0 ),
( over ? Math.max( ce.scrollWidth, ce.offsetWidth ) : ce.offsetWidth ) - ( parseInt( c.css( "borderRightWidth" ), 10 ) || 0 ) - ( parseInt( c.css( "paddingRight" ), 10 ) || 0 ) - this.helperProportions.width - this.margins.left - this.margins.right,
( over ? Math.max( ce.scrollHeight, ce.offsetHeight ) : ce.offsetHeight ) - ( parseInt( c.css( "borderBottomWidth" ), 10 ) || 0 ) - ( parseInt( c.css( "paddingBottom" ), 10 ) || 0 ) - this.helperProportions.height - this.margins.top - this.margins.bottom
( isUserScrollable ? Math.max( ce.scrollWidth, ce.offsetWidth ) : ce.offsetWidth ) -
( parseInt( c.css( "borderRightWidth" ), 10 ) || 0 ) -
( parseInt( c.css( "paddingRight" ), 10 ) || 0 ) -
this.helperProportions.width -
this.margins.left -
this.margins.right,
( isUserScrollable ? Math.max( ce.scrollHeight, ce.offsetHeight ) : ce.offsetHeight ) -
( parseInt( c.css( "borderBottomWidth" ), 10 ) || 0 ) -
( parseInt( c.css( "paddingBottom" ), 10 ) || 0 ) -
this.helperProportions.height -
this.margins.top -
this.margins.bottom
];
this.relativeContainer = c;
},
Expand Down

0 comments on commit 48ea2aa

Please sign in to comment.