diff --git a/tests/unit/resizable/resizable_core.js b/tests/unit/resizable/resizable_core.js index f0b5cea20e1..f43cde6237c 100644 --- a/tests/unit/resizable/resizable_core.js +++ b/tests/unit/resizable/resizable_core.js @@ -171,13 +171,14 @@ test("handle with complex markup (#8756)", function() { }); test("resizable accounts for scroll position correctly (#3815)", function() { - expect( 3 ); + expect( 4 ); var position, top, left, container = $("
").appendTo("#qunit-fixture"), overflowed = $("
").appendTo( container ), el = $("
").appendTo( overflowed ).resizable({ handles: "all" }), - handle = ".ui-resizable-e"; + handle = ".ui-resizable-e", + handlePosition = $(handle).position().left; container.scrollLeft( 100 ).scrollTop( 100 ); @@ -189,6 +190,7 @@ test("resizable accounts for scroll position correctly (#3815)", function() { deepEqual( el.position(), position, "position stays the same when resized" ); equal( el.css("left"), left, "css('left') stays the same when resized" ); equal( el.css("top"), top, "css('top') stays the same when resized" ); + equal( $(handle).position().left, handlePosition + 50, "handle also moved" ); }); test( "resizable stores correct size when using helper and grid (#9547)", function() { @@ -208,7 +210,7 @@ test( "resizable stores correct size when using helper and grid (#9547)", functi test( "nested resizable", function() { expect( 4 ); - + var outer = $( "
" ), inner = $( "
" ), target = $( "#resizable1" ), @@ -224,7 +226,7 @@ test( "nested resizable", function() { innerHandle = $( "#inner > .ui-resizable-e" ); outerHandle = $( "#outer > .ui-resizable-e" ); - + TestHelpers.resizable.drag( innerHandle, 10 ); equal( inner.width(), 40, "compare width of inner element" ); TestHelpers.resizable.drag( innerHandle, -10 ); diff --git a/tests/visual/compound/draggable_resizable.html b/tests/visual/compound/draggable_resizable.html new file mode 100644 index 00000000000..d383994314d --- /dev/null +++ b/tests/visual/compound/draggable_resizable.html @@ -0,0 +1,51 @@ + + + + + Compound Visual Test: Draggable and Resizable block element + + + + + + + + + + + + + +

WHAT: Three draggable and resizable elements, with only a bottom handle. Last one (red color) is absolutely positioned.

+

EXPECTED: Each element can be dragged and resized. The first two stay with their relative positioning (induced by draggable). The last one can be resized despite the absolute positioning.

+ +
+
Draggable 1-1
+
Draggable 1-2
+
Draggable 1-3
+
+ + + diff --git a/tests/visual/index.html b/tests/visual/index.html index d7b93cb5357..593ddcb07ce 100644 --- a/tests/visual/index.html +++ b/tests/visual/index.html @@ -75,6 +75,7 @@

Compound

  • Various Widgets in Dialog
  • Draggable Accordion
  • Nested Widgets
  • +
  • Draggable Resizable
  • Sortable Tabs in Sortable Accordion
  • Nested Tabs
  • Tabs with Tooltips
  • diff --git a/ui/resizable.js b/ui/resizable.js index 741ff040680..b59f3201309 100644 --- a/ui/resizable.js +++ b/ui/resizable.js @@ -287,18 +287,10 @@ $.widget("ui.resizable", $.ui.mouse, { var curleft, curtop, cursor, o = this.options, - iniPos = this.element.position(), el = this.element; this.resizing = true; - // Bugfix for http://bugs.jqueryui.com/ticket/1749 - if ( (/absolute/).test( el.css("position") ) ) { - el.css({ position: "absolute", top: el.css("top"), left: el.css("left") }); - } else if (el.is(".ui-draggable")) { - el.css({ position: "absolute", top: iniPos.top, left: iniPos.left }); - } - this._renderProxy(); curleft = this._num(this.helper.css("left"));