]> 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: 233f08e)
Mouse: Only detect out of document mouseups after a mousemove
authorMike Sherov <mike.sherov@gmail.com>
Tue, 19 Aug 2014 19:09:28 +0000 (15:09 -0400)
committerMike Sherov <mike.sherov@gmail.com>
Wed, 20 Aug 2014 15:19:36 +0000 (11:19 -0400)
This prevents the firing of mouseup in the case of IE<9, which will
fire a mousemove event if content is placed under the cursor on
mousedown.

Fixes #7778

tests/jquery.simulate.js patch | blob | history
tests/unit/draggable/draggable_core.js patch | blob | history
tests/visual/draggable/replaced.html [new file with mode: 0644] patch | blob
tests/visual/index.html patch | blob | history
ui/mouse.js patch | blob | history

diff --git a/tests/jquery.simulate.js b/tests/jquery.simulate.js
index 1dd96ac3a7dc6d0a8d920dc5a1907f4c8e6e005e..28e8a103beb738a36f9459dc7ed7776ea4de84ee 100644 (file)
--- a/tests/jquery.simulate.js
+++ b/tests/jquery.simulate.js
@@ -144,7 +144,7 @@ $.extend( $.simulate.prototype, {
                                0: 1,
                                1: 4,
                                2: 2
-                       }[ event.button ] || event.button;
+                       }[ event.button ] || ( event.button === -1 ? 0 : event.button );
                }
 
                return event;
diff --git a/tests/unit/draggable/draggable_core.js b/tests/unit/draggable/draggable_core.js
index 8bc48f14c97d1cd6ecebe4e35dd037cac26426cf..4ea5e608a62b6d23108168a913594a73fa505ac3 100644 (file)
--- a/tests/unit/draggable/draggable_core.js
+++ b/tests/unit/draggable/draggable_core.js
@@ -111,6 +111,23 @@ test( "#8269: Removing draggable element on drop", function() {
        }
 });
 
+// http://bugs.jqueryui.com/ticket/7778
+// drag element breaks in IE8 when its content is replaced onmousedown
+test( "Stray mousemove after mousedown still drags", function() {
+       expect( 2 );
+
+       var element = $( "#draggable1" ).draggable({ scroll: false });
+
+       // In IE8, when content is placed under the mouse (e.g. when draggable content is replaced
+       // on mousedown), mousemove is triggered on those elements even though the mouse hasn't moved.
+       // Support: IE <9
+       element.bind( "mousedown", function() {
+               $( document ).simulate( "mousemove", { button: -1 });
+       });
+
+       TestHelpers.draggable.shouldMove( element, "element is draggable" );
+});
+
 test( "#6258: not following mouse when scrolled and using overflow-y: scroll", function() {
        expect( 2 );
 
diff --git a/tests/visual/draggable/replaced.html b/tests/visual/draggable/replaced.html
new file mode 100644 (file)
index 0000000..9b54716
--- /dev/null
+++ b/tests/visual/draggable/replaced.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<html lang="en">
+<head>
+       <meta charset="utf-8">
+       <title>Draggable Visual Test</title>
+       <link rel="stylesheet" href="../../../themes/base/all.css">
+       <script src="../../../external/jquery/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>
+       $(function() {
+               $( "#draggable" )
+                       .draggable()
+                       .bind( "mousedown", function() {
+                               $( this ).html( "<div>replaced</div>" );
+                       });
+       });
+       </script>
+
+       <style>
+       #draggable {
+               background: green;
+               height: 75px;
+               width: 75px;
+       }
+       </style>
+</head>
+<body>
+
+<p>WHAT: A draggable, whose content is replaced onmousedown.</p>
+<p>EXPECTED: In IE8, the draggable can actually be dragged.</p>
+
+<div id="draggable"><div>content</div></div>
+
+</body>
+</html>
diff --git a/tests/visual/index.html b/tests/visual/index.html
index 949fb7e8211a240392dd7680fb50157861cd7f6b..736ba31179abd74185b2e1b2db7f348f46b9ea70 100644 (file)
--- a/tests/visual/index.html
+++ b/tests/visual/index.html
@@ -40,6 +40,11 @@
                        <li><a href="dialog/stacking.html">Overlapping dialogs</a></li>
                </ul>
 
+               <h2>Draggable</h2>
+               <ul>
+                       <li><a href="draggable/replaced.html">Replaced Content On Mousedown</a></li>
+               </ul>
+
                <h2>Effects</h2>
                <ul>
                        <li><a href="effects/all.html">All</a></li>
diff --git a/ui/mouse.js b/ui/mouse.js
index ecfc748af7eb766c922331e32007da76ca9e0487..0ac9acb6c9f139d1395030171b1a95370a9e01a7 100644 (file)
--- a/ui/mouse.js
+++ b/ui/mouse.js
@@ -70,6 +70,8 @@ return $.widget("ui.mouse", {
                        return;
                }
 
+               this._mouseMoved = false;
+
                // we may have missed mouseup (out of window)
                (this._mouseStarted && this._mouseUp(event));
 
@@ -123,13 +125,23 @@ return $.widget("ui.mouse", {
        },
 
        _mouseMove: function(event) {
-               // IE mouseup check - mouseup happened when mouse was out of window
-               if ($.ui.ie && ( !document.documentMode || document.documentMode < 9 ) && !event.button) {
-                       return this._mouseUp(event);
+               // Only check for mouseups outside the document if you've moved inside the document
+               // at least once. This prevents the firing of mouseup in the case of IE<9, which will
+               // fire a mousemove event if content is placed under the cursor. See #7778
+               // Support: IE <9
+               if ( this._mouseMoved ) {
+                       // IE mouseup check - mouseup happened when mouse was out of window
+                       if ($.ui.ie && ( !document.documentMode || document.documentMode < 9 ) && !event.button) {
+                               return this._mouseUp(event);
+
+                       // Iframe mouseup check - mouseup occurred in another document
+                       } else if ( !event.which ) {
+                               return this._mouseUp( event );
+                       }
+               }
 
-               // Iframe mouseup check - mouseup occurred in another document
-               } else if ( !event.which ) {
-                       return this._mouseUp( event );
+               if ( event.which || event.button ) {
+                       this._mouseMoved = true;
                }
 
                if (this._mouseStarted) {
The official jQuery user interface library: https://github.com/jquery/jquery-ui