Work around spurious mousemove on Chrome.

When clicking on an element in Chrome, spurious mousemove events can be
generated when the cursor hasn't actually moved.  This can prevent the
toolbar from being shown when the handle is clicked because the code
sees the mousemove event and thinks a handle drag is happening.  Work
around this by only running the handle drag code if the cursor has moved
since the mousedown event.

1 files changed, 11 insertions, 5 deletions

diff --git a/debug_toolbar/static/debug_toolbar/js/toolbar.js b/debug_toolbar/static/debug_toolbar/js/toolbar.js
index cb40205..4bbd162 100644
--- a/debug_toolbar/static/debug_toolbar/js/toolbar.js
+++ b/debug_toolbar/static/debug_toolbar/js/toolbar.js
@@ -140,12 +140,18 @@
             });
             var handle = $('#djDebugToolbarHandle');
             $('#djShowToolBarButton').on('mousedown', function (event) {
-                var baseY = handle.offset().top - event.pageY;
+                var startPageY = event.pageY;
+                var baseY = handle.offset().top - startPageY;
                 $(document).on('mousemove.djDebug', function (event) {
-                    var offset = handle.offset();
-                    offset.top = baseY + event.pageY;
-                    handle.offset(offset);
-                    djdt.handleDragged = true;
+                    // Chrome can send spurious mousemove events, so don't do anything unless the
+                    // cursor really moved.  Otherwise, it will be impossible to expand the toolbar
+                    // due to djdt.handleDragged being set to true.
+                    if (djdt.handleDragged || event.pageY != startPageY) {
+                        var offset = handle.offset();
+                        offset.top = baseY + event.pageY;
+                        handle.offset(offset);
+                        djdt.handleDragged = true;
+                    }
                 });
                 return false;
             });