From eb2d4e9a2097cbb7ca32776bccf81c23e6a3c39a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Fri, 13 Sep 2019 11:59:55 -0400 Subject: [PATCH 1/3] fix typos in cartesian_interact suite --- test/jasmine/tests/cartesian_interact_test.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/test/jasmine/tests/cartesian_interact_test.js b/test/jasmine/tests/cartesian_interact_test.js index bf3bb30c5c2..65a8e1030c0 100644 --- a/test/jasmine/tests/cartesian_interact_test.js +++ b/test/jasmine/tests/cartesian_interact_test.js @@ -65,7 +65,6 @@ describe('zoom box element', function() { }); }); - describe('main plot pan', function() { var gd, modeBar, relayoutCallback; @@ -893,7 +892,7 @@ describe('axis zoom/pan and main plot zoom', function() { cnt++; // called twice as many times on drag: // - once per axis during mousemouve - // - once per raxis on mouseup + // - once per axis on mouseup if(opts.dragged) cnt++; } }); @@ -1726,7 +1725,7 @@ describe('axis zoom/pan and main plot zoom', function() { Plotly.plot(gd, [{ type: 'heatmap', z: z() }], {dragmode: 'pan'}) .then(function() { - // inspired by https://github.com/plotly/plotly.js/issues/2687 + // inspired by https://github.com/plotly/plotly.js/issues/2687 gd.on('plotly_relayout', function(d) { relayoutTracker.unshift(d); setTimeout(function() { From 1c12dba3f33f449f125bed6f12e61e6273234bf7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Fri, 13 Sep 2019 12:02:59 -0400 Subject: [PATCH 2/3] :hocho: 2*MINDRAG requirement for zoomboxes to lead to relayout - this requirement can lead to visible 1d or 2d zoomboxes that do not lead to an axis range relayout, leading to confusing behaviour - lock this down in a test making sure small zoomboxes lead are followed by relayout calls. --- src/plots/cartesian/dragbox.js | 7 --- test/jasmine/tests/cartesian_interact_test.js | 60 +++++++++++++++++++ 2 files changed, 60 insertions(+), 7 deletions(-) diff --git a/src/plots/cartesian/dragbox.js b/src/plots/cartesian/dragbox.js index d362eefb1f5..a8f2ed79cf0 100644 --- a/src/plots/cartesian/dragbox.js +++ b/src/plots/cartesian/dragbox.js @@ -429,14 +429,7 @@ function makeDragBox(gd, plotinfo, x, y, w, h, ns, ew) { } function zoomDone() { - // more strict than dragged, which allows you to come back to where you started - // and still count as dragged - if(Math.min(box.h, box.w) < MINDRAG * 2) { - return removeZoombox(gd); - } - computeZoomUpdates(); - removeZoombox(gd); dragTail(); showDoubleClickNotifier(gd); diff --git a/test/jasmine/tests/cartesian_interact_test.js b/test/jasmine/tests/cartesian_interact_test.js index 65a8e1030c0..1dc33829e2c 100644 --- a/test/jasmine/tests/cartesian_interact_test.js +++ b/test/jasmine/tests/cartesian_interact_test.js @@ -1914,6 +1914,66 @@ describe('axis zoom/pan and main plot zoom', function() { .then(done); }); }); + + it('zoomboxes during small drag motions', function(done) { + var MINDRAG = constants.MINDRAG; + var eventData = {}; + + function _run(msg, dpos, exp) { + return function() { + var node = getDragger('xy', 'nsew'); + var fns = drag.makeFns({node: node, pos0: [200, 200], dpos: dpos}); + + return fns.start().then(function() { + var zl = d3.select(gd).select('g.zoomlayer'); + var d = zl.select('.zoombox-corners').attr('d'); + if(exp === 'nozoom') { + expect(d).toBe('M0,0Z', 'blank path | ' + msg); + } else { + var actual = (d.match(/Z/g) || []).length; + if(exp === 'x-zoom' || exp === 'y-zoom') { + expect(actual).toBe(2, 'two corners | ' + msg); + } else if(exp === 'xy-zoom') { + expect(actual).toBe(4, 'four corners | ' + msg); + } else { + fail('wrong expectation str.'); + } + } + }) + .then(fns.end) + .then(function() { + var keys = Object.keys(eventData); + if(exp === 'nozoom') { + expect(keys.length).toBe(0, 'no event data | ' + msg); + } else if(exp === 'x-zoom') { + expect(keys).withContext('relayout xaxis rng | ' + msg) + .toEqual(['xaxis.range[0]', 'xaxis.range[1]']); + } else if(exp === 'y-zoom') { + expect(keys).withContext('relayout yaxis rng | ' + msg) + .toEqual(['yaxis.range[0]', 'yaxis.range[1]']); + } else if(exp === 'xy-zoom') { + expect(keys.length).toBe(4, 'x and y relayout | ' + msg); + } else { + fail('wrong expectation str.'); + } + eventData = {}; + }); + }; + } + + Plotly.plot(gd, [{y: [1, 2, 1]}], {width: 400, height: 400}) + .then(function() { + gd.on('plotly_relayout', function(d) { eventData = d; }); + }) + .then(_run('dx < MINDRAG', [MINDRAG - 2, 0], 'nozoom')) + .then(_run('dx > MINDRAG', [MINDRAG + 2, 0], 'x-zoom')) + .then(_run('dy < MINDRAG', [0, MINDRAG - 2], 'nozoom')) + .then(_run('dy > MINDRAG', [0, MINDRAG + 2], 'y-zoom')) + .then(_run('(dx,dy) < MINDRAG', [MINDRAG - 2, MINDRAG - 2], 'nozoom')) + .then(_run('(dx,dy) > MINDRAG', [MINDRAG + 2, MINDRAG + 2], 'xy-zoom')) + .catch(failTest) + .then(done); + }); }); describe('Event data:', function() { From 61b88e95356ba53f91855a57d04abd9b9a7a2276 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Fri, 13 Sep 2019 13:07:16 -0400 Subject: [PATCH 3/3] fixup click-to-select in dragmode:'zoom' test - that drag(LASSO_PATH) call used to lead a no zoom, so this test did not properly check for seletedpoints persistence after zoom --- test/jasmine/tests/select_test.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index 34eb1d035fb..505c6737d46 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -437,10 +437,6 @@ describe('Click-to-select', function() { assertSelectedPoints([7, 35]); return _clickPt(mock14Pts[7], { shiftKey: true }); }) - .then(function() { - assertSelectedPoints(35); - drag(LASSO_PATH); - }) .then(function() { assertSelectedPoints(35); _clickPt(mock14Pts[35], { shiftKey: true }); @@ -448,6 +444,16 @@ describe('Click-to-select', function() { }) .then(function() { assertSelectionCleared(); + return _clickPt(mock14Pts[7], { shiftKey: true }); + }) + .then(function() { + assertSelectedPoints(7); + drag([[110, 100], [300, 300]]); + }) + .then(delay(100)) + .then(function() { + // persist after zoombox + assertSelectedPoints(7); }) .catch(failTest) .then(done);