diff --git a/src/components/dragelement/index.js b/src/components/dragelement/index.js index 03dd3489d50..a917eea08ed 100644 --- a/src/components/dragelement/index.js +++ b/src/components/dragelement/index.js @@ -180,7 +180,7 @@ dragElement.init = function init(options) { if(dx || dy) { gd._dragged = true; - dragElement.unhover(gd); + dragElement.unhover(gd, e); } if(gd._dragged && options.moveFn && !rightClick) { diff --git a/src/components/dragelement/unhover.js b/src/components/dragelement/unhover.js index 3f4724f1189..9cf687aae1a 100644 --- a/src/components/dragelement/unhover.js +++ b/src/components/dragelement/unhover.js @@ -34,7 +34,7 @@ unhover.raw = function raw(gd, evt) { var oldhoverdata = gd._hoverdata; if(!evt) evt = {}; - if(evt.target && + if(evt.target && !gd._dragged && Events.triggerHandler(gd, 'plotly_beforehover', evt) === false) { return; } diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js index f98b9af9f5c..22aee441ae6 100644 --- a/test/jasmine/tests/hover_label_test.js +++ b/test/jasmine/tests/hover_label_test.js @@ -3632,6 +3632,55 @@ describe('hover updates', function() { }) .then(done, done.fail); }); + + it('drag should trigger unhover', function(done) { + var data = [{y: [1]}]; + + var layout = { + hovermode: 'x', + width: 400, + height: 200, + margin: {l: 0, t: 0, r: 0, b: 0}, + showlegend: false + }; + + var gd = createGraphDiv(); + + var hoverHandler = jasmine.createSpy('hover'); + var unhoverHandler = jasmine.createSpy('unhover'); + + var hoverPt = [200, 100]; + var dragPt = [210, 100]; + + function hover() { + mouseEvent('mousemove', hoverPt[0], hoverPt[1]); + Lib.clearThrottle(); + } + + function drag() { + mouseEvent('mousedown', hoverPt[0], hoverPt[1]); + mouseEvent('mousemove', dragPt[0], dragPt[1]); + mouseEvent('mouseup', dragPt[0], dragPt[1]); + Lib.clearThrottle(); + } + + Plotly.react(gd, data, layout) + .then(function() { + gd.on('plotly_hover', hoverHandler); + gd.on('plotly_unhover', unhoverHandler); + }) + .then(hover) + .then(function() { + expect(hoverHandler).toHaveBeenCalled(); + expect(unhoverHandler).not.toHaveBeenCalled(); + }) + .then(drag) + .then(function() { + expect(hoverHandler).toHaveBeenCalled(); + expect(unhoverHandler).toHaveBeenCalled(); + }) + .then(done, done.fail); + }); }); describe('Test hover label custom styling:', function() {