]> source.dussan.org Git - jquery-ui.git/commitdiff
projects / jquery-ui.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 919d918)
Resizable: Remove bad workaround for draggable+resizable 1210/head
authorJörn Zaefferer <joern.zaefferer@gmail.com>
Tue, 11 Mar 2014 10:50:12 +0000 (11:50 +0100)
committerJörn Zaefferer <joern.zaefferer@gmail.com>
Wed, 16 Apr 2014 16:47:15 +0000 (18:47 +0200)
This adds a compound test page for draggable+resizable, which had no coverage
before. Using that page shows that there is no way to reproduce the behaviour
described in the original ticket that caused this workaround, since its not
possible to resize an element beyond the window boundaries. Therefore removing
the workaround, which is 6+ years old and has no test coverage, seems like the
sanest approach.

Fixes #6939
Closes gh-1210

tests/unit/resizable/resizable_core.js patch | blob | history
tests/visual/compound/draggable_resizable.html [new file with mode: 0644] patch | blob
tests/visual/index.html patch | blob | history
ui/resizable.js patch | blob | history

diff --git a/tests/unit/resizable/resizable_core.js b/tests/unit/resizable/resizable_core.js
index f0b5cea20e1e418454a087b9a1daa84f03ffd4e6..f43cde6237c558d6dff7945681cc77c776641358 100644 (file)
--- 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 = $("<div style='overflow:scroll;height:300px;width:300px;position:relative;'></div>").appendTo("#qunit-fixture"),
                overflowed = $("<div style='width: 1000px; height: 1000px;'></div>").appendTo( container ),
                el = $("<div style='height:100px;width:100px;position:absolute;top:10px;left:10px;'></div>").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 = $( "<div id='outer' style='width:50px'></div>" ),
                inner = $( "<div id='inner' style='width:30px'></div>" ),
                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 (file)
index 0000000..d383994
--- /dev/null
+++ b/tests/visual/compound/draggable_resizable.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="en">
+<head>
+       <meta charset="utf-8">
+       <title>Compound Visual Test: Draggable and Resizable block element</title>
+       <link rel="stylesheet" href="../visual.css">
+       <link rel="stylesheet" href="../../../themes/base/all.css">
+       <script src="../../../jquery.js"></script>
+       <script src="../../../ui/core.js"></script>
+       <script src="../../../ui/widget.js"></script>
+       <script src="../../../ui/mouse.js"></script>
+       <script src="../../../ui/draggable.js"></script>
+       <script src="../../../ui/resizable.js"></script>
+       <style>
+       .draggable {
+               margin: 0.5em;
+               padding: 0.5em;
+       }
+       .absolute {
+               color: red;
+               position: absolute !important;
+       }
+       </style>
+       <script>
+       $(function() {
+               $( ".draggable" )
+                       .addClass( "ui-widget ui-widget-header ui-corner-all" )
+                       .draggable({
+                               revert: "invalid"
+                       })
+                       .resizable({
+                               minHeight: 13,
+                               handles: "s"
+                       });
+               $( ".draggable:last" ).addClass( "absolute" );
+       });
+       </script>
+</head>
+<body>
+
+<p>WHAT: Three draggable and resizable elements, with only a bottom handle. Last one (red color) is absolutely positioned.</p>
+<p>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.</p>
+
+<div id="first">
+       <div class="draggable">Draggable 1-1</div>
+       <div class="draggable">Draggable 1-2</div>
+       <div class="draggable">Draggable 1-3</div>
+</div>
+
+</body>
+</html>
diff --git a/tests/visual/index.html b/tests/visual/index.html
index d7b93cb535788422f3c345116b6fd3b8e037d6cc..593ddcb07ce4cadf236cc4b5ab70e364412a3aa4 100644 (file)
--- a/tests/visual/index.html
+++ b/tests/visual/index.html
@@ -75,6 +75,7 @@
                        <li><a href="compound/dialog_widgets.html">Various Widgets in Dialog</a></li>
                        <li><a href="compound/draggable_accordion.html">Draggable Accordion</a></li>
                        <li><a href="compound/draggable_accordion_accordion_tabs_draggable.html">Nested Widgets</a></li>
+                       <li><a href="compound/draggable_resizable.html">Draggable Resizable</a></li>
                        <li><a href="compound/sortable_accordion_sortable_tabs.html">Sortable Tabs in Sortable Accordion</a></li>
                        <li><a href="compound/tabs_tabs.html">Nested Tabs</a></li>
                        <li><a href="compound/tabs_tooltips.html">Tabs with Tooltips</a></li>
diff --git a/ui/resizable.js b/ui/resizable.js
index 741ff040680bf1e9134ec530939511ea85fc2bba..b59f320130988cdfd9b3786e2de91dd3de7aa67a 100644 (file)
--- 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"));
The official jQuery user interface library: https://github.com/jquery/jquery-ui