add new tests and fix cursor

Author: apalchys

src/components/fx/hover.js

@@ -274,9 +274,11 @@ function _hover(gd, evt, subplot, noHoverEvent) {
         if(hasUserCalledHover) {
             if('xpx' in evt) xpx = evt.xpx;
             else xpx = xaArray[0]._length / 2;
+            if(!('offsetX' in evt)) evt.offsetX = xpx + xaArray[0]._offset;
 
             if('ypx' in evt) ypx = evt.ypx;
             else ypx = yaArray[0]._length / 2;
+            if(!('offsetY' in evt)) evt.offsetY = ypx + yaArray[0]._offset;
         }
         else {
             // fire the beforehover event and quit if it returns false
@@ -419,7 +421,7 @@ function _hover(gd, evt, subplot, noHoverEvent) {
             if(hoverData.length === 0) {
                 pointData.distance = spikedistance;
                 pointData.index = false;
-                var closestPoints = trace._module.hoverPoints(pointData, xval, yval, 'closest');
+                var closestPoints = trace._module.hoverPoints(pointData, xval, yval, 'closest', fullLayout._hoverlayer);
                 if(closestPoints) {
                     var tmpPoint;
                     var closestVPoints = closestPoints.filter(function(point) {
@@ -1247,10 +1249,11 @@ function createSpikelines(closestPoints, opts) {
 
         if(ySnap === 'cursor') {
             hLinePointY = evt.offsetY;
+            hLinePointX = evt.offsetX;
         } else {
             hLinePointY = ya._offset + (hLinePoint.y0 + hLinePoint.y1) / 2;
+            hLinePointX = xa._offset + (hLinePoint.x0 + hLinePoint.x1) / 2;
         }
-        hLinePointX = xa._offset + (hLinePoint.x0 + hLinePoint.x1) / 2;
         var dfltHLineColor = tinycolor.readability(hLinePoint.color, contrastColor) < 1.5 ?
             Color.contrast(contrastColor) : hLinePoint.color;
         var yMode = ya.spikemode,
@@ -1322,12 +1325,13 @@ function createSpikelines(closestPoints, opts) {
 
         if(xSnap === 'cursor') {
             vLinePointX = evt.offsetX;
+            vLinePointY = evt.offsetY;
         } else {
             vLinePointX = xa._offset + (vLinePoint.x0 + vLinePoint.x1) / 2;
+            vLinePointY = ya._offset + (vLinePoint.y0 + vLinePoint.y1) / 2;
         }
-        vLinePointY = ya._offset + (vLinePoint.y0 + vLinePoint.y1) / 2;
         var dfltVLineColor = tinycolor.readability(vLinePoint.color, contrastColor) < 1.5 ?
-            Color.contrast(contrastColor) : vLinePoint.color;
+        Color.contrast(contrastColor) : vLinePoint.color;
         var xMode = xa.spikemode,
             xThickness = xa.spikethickness,
             xColor = xa.spikecolor || dfltVLineColor,

test/jasmine/tests/hover_label_test.js

@@ -1842,7 +1842,17 @@ describe('hover distance', function() {
             });
         });
 
-        it('responds to hoverdistance change', function() {
+        it('responds to hoverdistance change part 1', function() {
+            var gd = document.getElementById('graph');
+            var evt = { xpx: 450, ypx: 155 };
+            gd._fullLayout.hoverdistance = 10;
+
+            Fx.hover('graph', evt, 'xy');
+
+            expect(gd._hoverdata).toEqual(undefined);
+        });
+
+        it('responds to hoverdistance change part 2', function() {
             var gd = document.getElementById('graph');
             var evt = { xpx: 450, ypx: 155 };
             gd._fullLayout.hoverdistance = 30;
@@ -1857,7 +1867,8 @@ describe('hover distance', function() {
             expect(hoverTrace.y).toEqual(3);
 
             assertHoverLabelContent({
-                nums: '(2, 3)',
+                nums: '3',
+                axis: '2',
                 name: 'trace 0'
             });
         });

test/jasmine/tests/hover_spikeline_test.js

@@ -135,43 +135,56 @@ describe('spikeline', function() {
             .then(done);
         });
 
-        it('automatically switch between toaxis and across spikemodes on switching the hovermodes', function(done) {
+        it('draws lines and markers on enabled axes in the spikesnap "cursor" mode', function(done) {
             gd = createGraphDiv();
-            var _mock = makeMock('toaxis', 'closest');
+            var _mock = makeMock('toaxis', 'x');
 
-            Plotly.plot(gd, _mock).then(function() {
-                _hover({xval: 2, yval: 3}, 'xy');
+            _mock.layout.xaxis.spikesnap = 'cursor';
+            _mock.layout.yaxis.spikesnap = 'cursor';
+            _mock.layout.xaxis2.spikesnap = 'cursor';
+
+            Plotly.plot(gd, _mock)
+            .then(function() {
+                _set_spikedistance(200);
+            })
+            .then(function() {
+                _hover({xpx: 120, ypx: 180}, 'xy');
                 _assert(
-                    [[557, 401, 557, 250], [557, 401, 557, 250], [80, 250, 557, 250], [80, 250, 557, 250]],
-                    [[83, 250]]
+                    [[200, 401, 200, 280], [200, 401, 200, 280], [80, 280, 200, 280], [80, 280, 200, 280]],
+                    [[83, 280]]
                 );
             })
             .then(function() {
-                _hover({xval: 30, yval: 40}, 'x2y2');
+                _hover({xpx: 31, ypx: 41}, 'x2y2');
                 _assert(
-                    [[820, 220, 820, 167], [820, 220, 820, 167]],
+                    [[682, 220, 682, 156], [682, 220, 682, 156]],
                     []
                 );
             })
-            .then(function() {
-                _set_hovermode('x');
-            })
-            .then(function() {
+            .catch(fail)
+            .then(done);
+        });
+
+        it('doesn\'t switch between toaxis and across spikemodes on switching the hovermodes', function(done) {
+            gd = createGraphDiv();
+            var _mock = makeMock('toaxis', 'closest');
+
+            Plotly.plot(gd, _mock).then(function() {
                 _hover({xval: 2, yval: 3}, 'xy');
                 _assert(
-                    [[557, 100, 557, 401], [557, 100, 557, 401], [80, 250, 1033, 250], [80, 250, 1033, 250]],
+                    [[557, 401, 557, 250], [557, 401, 557, 250], [80, 250, 557, 250], [80, 250, 557, 250]],
                     [[83, 250]]
                 );
             })
             .then(function() {
                 _hover({xval: 30, yval: 40}, 'x2y2');
                 _assert(
-                    [[820, 115, 820, 220], [820, 115, 820, 220]],
+                    [[820, 220, 820, 167], [820, 220, 820, 167]],
                     []
                 );
             })
             .then(function() {
-                _set_hovermode('closest');
+                _set_hovermode('x');
             })
             .then(function() {
                 _hover({xval: 2, yval: 3}, 'xy');
@@ -191,7 +204,7 @@ describe('spikeline', function() {
             .then(done);
         });
 
-        it('increase the range of search for points to draw the spikelines', function(done) {
+        it('increase the range of search for points to draw the spikelines on spikedistance change', function(done) {
             gd = createGraphDiv();
             var _mock = makeMock('toaxis', 'closest');