From bd6995e484512070002128f3d25888425319b292 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Thu, 21 Jan 2016 10:09:14 -0500 Subject: [PATCH 01/14] wip emit double click eventData --- src/plots/cartesian/graph_interact.js | 1 + src/plots/cartesian/select.js | 2 ++ 2 files changed, 3 insertions(+) diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 6a8327ced22..84e3db4f6e3 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -1821,6 +1821,7 @@ function dragBox(gd, plotinfo, x, y, w, h, ns, ew) { } } + gd.emit('plotly_doubleclick', {}); Plotly.relayout(gd, attrs); } diff --git a/src/plots/cartesian/select.js b/src/plots/cartesian/select.js index 3754efce6a7..1db92c7e914 100644 --- a/src/plots/cartesian/select.js +++ b/src/plots/cartesian/select.js @@ -171,6 +171,8 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) { searchInfo = searchTraces[i]; searchInfo.selectPoints(searchInfo, false); } + + gd.emit('plotly_doubleclick', {}); } else { dragOptions.gd.emit('plotly_selected', eventData); From 10cded2cf70a91a63458345cfb7b59a29b614b5c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 16:54:31 -0500 Subject: [PATCH 02/14] emit 'plotly_doubleclick' events, on dragbox double clicks and select/lasso double clicks --- src/plots/cartesian/graph_interact.js | 2 +- src/plots/cartesian/select.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 84e3db4f6e3..260542afb52 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -1821,7 +1821,7 @@ function dragBox(gd, plotinfo, x, y, w, h, ns, ew) { } } - gd.emit('plotly_doubleclick', {}); + gd.emit('plotly_doubleclick', null); Plotly.relayout(gd, attrs); } diff --git a/src/plots/cartesian/select.js b/src/plots/cartesian/select.js index 1db92c7e914..94f5018ab3f 100644 --- a/src/plots/cartesian/select.js +++ b/src/plots/cartesian/select.js @@ -172,7 +172,7 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) { searchInfo.selectPoints(searchInfo, false); } - gd.emit('plotly_doubleclick', {}); + gd.emit('plotly_doubleclick', null); } else { dragOptions.gd.emit('plotly_selected', eventData); From 8b6783f6608980e210ea249e44031029f6bab8a7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 16:55:25 -0500 Subject: [PATCH 03/14] flatten click test describe struc --- test/jasmine/tests/click_test.js | 71 +++++++++++++++++--------------- 1 file changed, 37 insertions(+), 34 deletions(-) diff --git a/test/jasmine/tests/click_test.js b/test/jasmine/tests/click_test.js index 18c49542b06..be811a524bb 100644 --- a/test/jasmine/tests/click_test.js +++ b/test/jasmine/tests/click_test.js @@ -9,47 +9,50 @@ var mouseEvent = require('../assets/mouse_event'); describe('click event', function() { var mock = require('@mocks/14.json'); - describe('event data', function() { - var mockCopy = Lib.extendDeep({}, mock), - clientX = 351, - clientY = 223, - gd; - - function click() { - mouseEvent('mousemove', clientX, clientY); - mouseEvent('mousedown', clientX, clientY); - mouseEvent('mouseup', clientX, clientY); - } - - beforeEach(function(done) { - gd = createGraphDiv(); - - Plotly.plot(gd, mockCopy.data, mockCopy.layout) - .then(done); + afterEach(destroyGraphDiv); + + var mockCopy = Lib.extendDeep({}, mock), + clientX = 351, + clientY = 223, + gd; + + function click() { + mouseEvent('mousemove', clientX, clientY); + mouseEvent('mousedown', clientX, clientY); + mouseEvent('mouseup', clientX, clientY); + } + + beforeEach(function(done) { + gd = createGraphDiv(); + + Plotly.plot(gd, mockCopy.data, mockCopy.layout) + .then(done); + }); + + it('should contain the correct fields', function() { + var futureData; + + gd.on('plotly_click', function(data) { + futureData = data; }); - afterEach(destroyGraphDiv); + click(); - it('should contain the correct fields', function() { - var futureData; + expect(futureData.points.length).toEqual(1); - gd.on('plotly_click', function(data) { - futureData = data; - }); + var pt = futureData.points[0]; + expect(Object.keys(pt)).toEqual([ + 'data', 'fullData', 'curveNumber', 'pointNumber', + 'x', 'y', 'xaxis', 'yaxis' + ]); + expect(pt.curveNumber).toEqual(0); + expect(pt.pointNumber).toEqual(11); + expect(pt.x).toEqual(0.125); + expect(pt.y).toEqual(2.125); + }); - click(); - expect(futureData.points.length).toEqual(1); - var pt = futureData.points[0]; - expect(Object.keys(pt)).toEqual([ - 'data', 'fullData', 'curveNumber', 'pointNumber', - 'x', 'y', 'xaxis', 'yaxis' - ]); - expect(pt.curveNumber).toEqual(0); - expect(pt.pointNumber).toEqual(11); - expect(pt.x).toEqual(0.125); - expect(pt.y).toEqual(2.125); }); }); }); From e8ef66306b4ebaf7df709de8880371026d6bbdf9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 16:55:36 -0500 Subject: [PATCH 04/14] add double click test --- test/jasmine/tests/click_test.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/test/jasmine/tests/click_test.js b/test/jasmine/tests/click_test.js index be811a524bb..7758e35c328 100644 --- a/test/jasmine/tests/click_test.js +++ b/test/jasmine/tests/click_test.js @@ -1,5 +1,6 @@ var Plotly = require('@lib/index'); var Lib = require('@src/lib'); +var DBLCLICKDELAY = require('@src/plots/cartesian/constants').DBLCLICKDELAY; var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div'); @@ -22,6 +23,14 @@ describe('click event', function() { mouseEvent('mouseup', clientX, clientY); } + function doubleClick(cb) { + click(); + setTimeout(function() { + click(); + cb(); + }, DBLCLICKDELAY / 2); + } + beforeEach(function(done) { gd = createGraphDiv(); @@ -51,8 +60,16 @@ describe('click event', function() { expect(pt.y).toEqual(2.125); }); + it('should trigger double click if two clicks are \'close\' together', function(done) { + var futureData; + gd.on('plotly_doubleclick', function(data) { + futureData = data; + }); + doubleClick(function() { + expect(futureData).toBe(null); + done(); }); }); }); From d46ae26f89ef53de6bccebe1e2c6422c88e80846 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 16:55:51 -0500 Subject: [PATCH 05/14] add select/lasso jasmine tests --- test/jasmine/tests/select_test.js | 174 ++++++++++++++++++++++++++++++ 1 file changed, 174 insertions(+) create mode 100644 test/jasmine/tests/select_test.js diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js new file mode 100644 index 00000000000..b5b30766f16 --- /dev/null +++ b/test/jasmine/tests/select_test.js @@ -0,0 +1,174 @@ +var Plotly = require('@lib/index'); +var Lib = require('@src/lib'); +var DBLCLICKDELAY = require('@src/plots/cartesian/constants').DBLCLICKDELAY; + +var createGraphDiv = require('../assets/create_graph_div'); +var destroyGraphDiv = require('../assets/destroy_graph_div'); +var mouseEvent = require('../assets/mouse_event'); + + +describe('select box and lasso', function() { + var mock = require('@mocks/14.json'); + + afterEach(destroyGraphDiv); + + function drag(path) { + var len = path.length; + + mouseEvent('mousemove', path[0][0], path[0][1]); + mouseEvent('mousedown', path[0][0], path[0][1]); + + path.slice(1, len).forEach(function(pt) { + mouseEvent('mousemove', pt[0], pt[1]); + }); + + mouseEvent('mouseup', path[len - 1][0], path[len - 1][1]); + } + + function click(x, y) { + mouseEvent('mousemove', x, y); + mouseEvent('mousedown', x, y); + mouseEvent('mouseup', x, y); + } + + function doubleClick(x, y, cb) { + click(x, y); + setTimeout(function() { + click(x, y); + cb(); + }, DBLCLICKDELAY / 2); + } + + describe('select events', function() { + var mockCopy = Lib.extendDeep({}, mock); + mockCopy.layout.dragmode = 'select'; + + var gd; + beforeEach(function(done) { + gd = createGraphDiv(); + + Plotly.plot(gd, mockCopy.data, mockCopy.layout) + .then(done); + }); + + it('should trigger events', function(done) { + var selectingCnt = 0, + selectingData; + gd.on('plotly_selecting', function(data) { + selectingCnt++; + selectingData = data; + }); + + var selectedCnt = 0, + selectedData; + gd.on('plotly_selected', function(data) { + selectedCnt++; + selectedData = data; + }); + + var doubleClickData; + gd.on('plotly_doubleclick', function(data) { + doubleClickData = data; + }); + + drag([[100, 200], [150, 200]]); + + expect(selectingCnt).toEqual(1); + expect(selectingData.points).toEqual([{ + curveNumber: 0, + pointNumber: 0, + x: 0.002, + y: 16.25 + }, { + curveNumber: 0, + pointNumber: 1, + x: 0.004, + y: 12.5 + }]); + expect(selectingData.range).toEqual({ + x: [0.0019667582669138295, 0.004546754982054625], + y: [0.10209191961595454, 24.512223978291406] + }); + + expect(selectedCnt).toEqual(1); + expect(selectedData.points).toEqual([{ + curveNumber: 0, + pointNumber: 0, + x: 0.002, + y: 16.25 + }, { + curveNumber: 0, + pointNumber: 1, + x: 0.004, + y: 12.5 + }]); + expect(selectedData.range).toEqual({ + x: [0.0019667582669138295, 0.004546754982054625], + y: [0.10209191961595454, 24.512223978291406] + }); + + doubleClick(250, 200, function() { + expect(doubleClickData).toBe(null); + done(); + }); + }); + + }); + + describe('lasso events', function() { + var mockCopy = Lib.extendDeep({}, mock); + mockCopy.layout.dragmode = 'lasso'; + + var gd; + beforeEach(function(done) { + gd = createGraphDiv(); + + Plotly.plot(gd, mockCopy.data, mockCopy.layout) + .then(done); + }); + + it('should trigger events', function(done) { + var selectingCnt = 0, + selectingData; + gd.on('plotly_selecting', function(data) { + selectingCnt++; + selectingData = data; + }); + + var selectedCnt = 0, + selectedData; + gd.on('plotly_selected', function(data) { + selectedCnt++; + selectedData = data; + }); + + var doubleClickData; + gd.on('plotly_doubleclick', function(data) { + doubleClickData = data; + }); + + drag([[331, 178], [333, 246], [350, 250], [343, 176]]); + + expect(selectingCnt).toEqual(3); + expect(selectingData.points).toEqual([{ + curveNumber: 0, + pointNumber: 10, + x: 0.099, + y: 2.75 + }]); + + expect(selectedCnt).toEqual(1); + expect(selectedData.points).toEqual([{ + curveNumber: 0, + pointNumber: 10, + x: 0.099, + y: 2.75 + }]); + + doubleClick(250, 200, function() { + expect(doubleClickData).toBe(null); + done(); + }); + }); + }); +}); From 02eca97ddf6c1398a407f30ab3c147a1c0635391 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 16:56:17 -0500 Subject: [PATCH 06/14] revert Plots object in register, - so that Plots is consistent from suite to suite. --- test/jasmine/tests/register_test.js | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/test/jasmine/tests/register_test.js b/test/jasmine/tests/register_test.js index 80a2657f3e4..0e5a436ad71 100644 --- a/test/jasmine/tests/register_test.js +++ b/test/jasmine/tests/register_test.js @@ -1,6 +1,27 @@ var Plotly = require('@lib/index'); describe('the register function', function() { + 'use strict'; + + var Plots = Plotly.Plots; + + beforeEach(function() { + this.modulesKeys = Object.keys(Plots.modules); + this.allTypesKeys = Object.keys(Plots.allTypes); + this.allCategoriesKeys = Object.keys(Plots.allCategories); + }); + + afterEach(function() { + function revertObj(obj, initialKeys) { + Object.keys(obj).forEach(function(k) { + if(initialKeys.indexOf(k) === -1) delete obj[k]; + }); + } + + revertObj(Plots.modules, this.modulesKeys); + revertObj(Plots.allTypes, this.allTypesKeys); + revertObj(Plots.allCategories, this.allCategoriesKeys); + }); it('should throw an error when no argument is given', function() { expect(function() { From 782f6926a6abd552fc44a9f22e95f36d0daffa46 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Mon, 15 Feb 2016 17:29:17 -0500 Subject: [PATCH 07/14] use toBeCloseTo to assert selection ranges, - so that test Chrome and FF can agree --- test/jasmine/tests/select_test.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index b5b30766f16..f5998a50928 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -39,6 +39,15 @@ describe('select box and lasso', function() { }, DBLCLICKDELAY / 2); } + function assertRange(actual, expected) { + var PRECISION = 4; + + expect(actual.x[0]).toBeCloseTo(expected.x[0], PRECISION); + expect(actual.x[1]).toBeCloseTo(expected.x[1], PRECISION); + expect(actual.y[0]).toBeCloseTo(expected.y[0], PRECISION); + expect(actual.y[1]).toBeCloseTo(expected.y[1], PRECISION); + } + describe('select events', function() { var mockCopy = Lib.extendDeep({}, mock); mockCopy.layout.dragmode = 'select'; @@ -85,7 +94,7 @@ describe('select box and lasso', function() { x: 0.004, y: 12.5 }]); - expect(selectingData.range).toEqual({ + assertRange(selectingData.range, { x: [0.0019667582669138295, 0.004546754982054625], y: [0.10209191961595454, 24.512223978291406] }); @@ -102,7 +111,7 @@ describe('select box and lasso', function() { x: 0.004, y: 12.5 }]); - expect(selectedData.range).toEqual({ + assertRange(selectedData.range, { x: [0.0019667582669138295, 0.004546754982054625], y: [0.10209191961595454, 24.512223978291406] }); From 5b1e89568cdd420e7969c4aa19118e88acadb02c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 17 Feb 2016 11:23:15 -0500 Subject: [PATCH 08/14] add comment about click events simulators --- test/jasmine/tests/click_test.js | 3 +++ test/jasmine/tests/select_test.js | 3 +++ 2 files changed, 6 insertions(+) diff --git a/test/jasmine/tests/click_test.js b/test/jasmine/tests/click_test.js index 7758e35c328..330a02a4634 100644 --- a/test/jasmine/tests/click_test.js +++ b/test/jasmine/tests/click_test.js @@ -17,6 +17,9 @@ describe('click event', function() { clientY = 223, gd; + // cartesian click events events use the hover data + // from the mousemove events and then simulate + // a click event on mouseup function click() { mouseEvent('mousemove', clientX, clientY); mouseEvent('mousedown', clientX, clientY); diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index f5998a50928..6ce34814fb0 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -25,6 +25,9 @@ describe('select box and lasso', function() { mouseEvent('mouseup', path[len - 1][0], path[len - 1][1]); } + // cartesian click events events use the hover data + // from the mousemove events and then simulate + // a click event on mouseup function click(x, y) { mouseEvent('mousemove', x, y); mouseEvent('mousedown', x, y); From c41a7565a55a489cc9db010399272f93bd309a32 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 17 Feb 2016 11:23:31 -0500 Subject: [PATCH 09/14] make jasmine describe more explicit --- test/jasmine/tests/select_test.js | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index 6ce34814fb0..e123bba9078 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -63,7 +63,7 @@ describe('select box and lasso', function() { .then(done); }); - it('should trigger events', function(done) { + it('should trigger selecting/selected/deselect events', function(done) { var selectingCnt = 0, selectingData; gd.on('plotly_selecting', function(data) { @@ -85,7 +85,7 @@ describe('select box and lasso', function() { drag([[100, 200], [150, 200]]); - expect(selectingCnt).toEqual(1); + expect(selectingCnt).toEqual(1, 'with the correct selecting count'); expect(selectingData.points).toEqual([{ curveNumber: 0, pointNumber: 0, @@ -96,13 +96,13 @@ describe('select box and lasso', function() { pointNumber: 1, x: 0.004, y: 12.5 - }]); + }], 'with the correct selecting points'); assertRange(selectingData.range, { x: [0.0019667582669138295, 0.004546754982054625], y: [0.10209191961595454, 24.512223978291406] - }); + }, 'with the correct selecting range'); - expect(selectedCnt).toEqual(1); + expect(selectedCnt).toEqual(1, 'with the correct selected count'); expect(selectedData.points).toEqual([{ curveNumber: 0, pointNumber: 0, @@ -113,14 +113,14 @@ describe('select box and lasso', function() { pointNumber: 1, x: 0.004, y: 12.5 - }]); + }], 'with the correct selected points'); assertRange(selectedData.range, { x: [0.0019667582669138295, 0.004546754982054625], y: [0.10209191961595454, 24.512223978291406] - }); + }, 'with the correct selected range'); doubleClick(250, 200, function() { - expect(doubleClickData).toBe(null); + expect(doubleClickData).toBe(null, 'with the correct deselect data'); done(); }); }); @@ -139,7 +139,7 @@ describe('select box and lasso', function() { .then(done); }); - it('should trigger events', function(done) { + it('should trigger selecting/selected/deselect events', function(done) { var selectingCnt = 0, selectingData; gd.on('plotly_selecting', function(data) { @@ -161,24 +161,24 @@ describe('select box and lasso', function() { drag([[331, 178], [333, 246], [350, 250], [343, 176]]); - expect(selectingCnt).toEqual(3); + expect(selectingCnt).toEqual(3, 'with the correct selecting count'); expect(selectingData.points).toEqual([{ curveNumber: 0, pointNumber: 10, x: 0.099, y: 2.75 - }]); + }], 'with the correct selecting points'); - expect(selectedCnt).toEqual(1); + expect(selectedCnt).toEqual(1, 'with the correct selected count'); expect(selectedData.points).toEqual([{ curveNumber: 0, pointNumber: 10, x: 0.099, y: 2.75 - }]); + }], 'with the correct selected points'); doubleClick(250, 200, function() { - expect(doubleClickData).toBe(null); + expect(doubleClickData).toBe(null, 'with the correct deselect data'); done(); }); }); From 9c19406d25df3f90c033feb0fdcc488b85febbea Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 17 Feb 2016 11:25:42 -0500 Subject: [PATCH 10/14] try sending hoverdata on double click: - double click on a data pt now (1) fires a click event, (2) fires a double click event and (3) fires another click event, with the same event data - double clicking not on a data pt fires a double click event with null event data --- src/plots/cartesian/graph_interact.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 260542afb52..bb4c343de17 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -1821,7 +1821,8 @@ function dragBox(gd, plotinfo, x, y, w, h, ns, ew) { } } - gd.emit('plotly_doubleclick', null); + var dblClickData = gd._hoverdata ? {points: gd._hoverdata} : null; + gd.emit('plotly_doubleclick', dblClickData); Plotly.relayout(gd, attrs); } From 848f4a555dd51d41ae65ef6a637e8ffd130c115c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 24 Feb 2016 13:07:36 -0500 Subject: [PATCH 11/14] move destroyGraphDiv to suite level --- test/jasmine/tests/plot_promise_test.js | 20 +++----------------- 1 file changed, 3 insertions(+), 17 deletions(-) diff --git a/test/jasmine/tests/plot_promise_test.js b/test/jasmine/tests/plot_promise_test.js index 8efe48ab920..9e326625ba9 100644 --- a/test/jasmine/tests/plot_promise_test.js +++ b/test/jasmine/tests/plot_promise_test.js @@ -3,9 +3,12 @@ var Events = require('@src/lib/events'); var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div'); + describe('Plotly.___ methods', function() { 'use strict'; + afterEach(destroyGraphDiv); + describe('Plotly.plot promise', function() { var promise, promiseGd; @@ -20,7 +23,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -54,7 +56,6 @@ describe('Plotly.___ methods', function() { }); }); - afterEach(destroyGraphDiv); it('should be rejected when plotly_beforeplot event handlers return false', function() { expect(promiseRejected).toBe(true); @@ -81,7 +82,6 @@ describe('Plotly.___ methods', function() { }); }); - afterEach(destroyGraphDiv); it('should reject the promise when graph is being dragged', function() { expect(promiseRejected).toBe(true); @@ -105,7 +105,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -129,7 +128,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -156,7 +154,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -183,7 +180,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -210,7 +206,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -237,7 +232,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -264,7 +258,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -294,7 +287,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -321,7 +313,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -348,7 +339,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be rejected when the attribute is missing', function() { expect(promiseRejected).toBe(true); @@ -373,7 +363,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -401,7 +390,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div as an argument', function() { expect(promiseGd).toBeDefined(); @@ -430,7 +418,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be returned with the graph div unchanged when the framework is polar', function() { expect(promiseGd).toBeDefined(); @@ -457,7 +444,6 @@ describe('Plotly.___ methods', function() { done(); }); }); - afterEach(destroyGraphDiv); it('should be rejected when the attribute is missing', function() { expect(promiseRejected).toBe(true); From 4c5103f01e0016b6ee08037d705627b96bcbf26d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 24 Feb 2016 13:11:31 -0500 Subject: [PATCH 12/14] send null on plotly_doubleclick events: - to not introduce more complexity into our set of event data --- src/plots/cartesian/graph_interact.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 8418fb6647e..3548cc7faab 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -1822,8 +1822,7 @@ function dragBox(gd, plotinfo, x, y, w, h, ns, ew) { } } - var dblClickData = gd._hoverdata ? {points: gd._hoverdata} : null; - gd.emit('plotly_doubleclick', dblClickData); + gd.emit('plotly_doubleclick', null); Plotly.relayout(gd, attrs); } From d517c4fad97eb181109abfeb99ffb8cc791de015 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 24 Feb 2016 13:12:57 -0500 Subject: [PATCH 13/14] make doubleclick in select/lasso mode emit its own event: plotly_deselect --- src/plots/cartesian/select.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/plots/cartesian/select.js b/src/plots/cartesian/select.js index 94f5018ab3f..255b0f9e448 100644 --- a/src/plots/cartesian/select.js +++ b/src/plots/cartesian/select.js @@ -172,7 +172,7 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) { searchInfo.selectPoints(searchInfo, false); } - gd.emit('plotly_doubleclick', null); + gd.emit('plotly_deselect', null); } else { dragOptions.gd.emit('plotly_selected', eventData); From 90edb188ff68bde7bfd7e8befbe5059781187a89 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= Date: Wed, 24 Feb 2016 13:13:13 -0500 Subject: [PATCH 14/14] update click and select tests --- test/jasmine/tests/click_test.js | 82 ++++++++++++++++++------------- test/jasmine/tests/select_test.js | 15 +++--- 2 files changed, 56 insertions(+), 41 deletions(-) diff --git a/test/jasmine/tests/click_test.js b/test/jasmine/tests/click_test.js index 330a02a4634..f680d2c6963 100644 --- a/test/jasmine/tests/click_test.js +++ b/test/jasmine/tests/click_test.js @@ -7,29 +7,29 @@ var destroyGraphDiv = require('../assets/destroy_graph_div'); var mouseEvent = require('../assets/mouse_event'); -describe('click event', function() { - var mock = require('@mocks/14.json'); +describe('click interactions', function() { + var mock = require('@mocks/14.json'), + mockCopy = Lib.extendDeep({}, mock), + gd; - afterEach(destroyGraphDiv); + var pointPos = [351, 223], + blankPos = [70, 363]; - var mockCopy = Lib.extendDeep({}, mock), - clientX = 351, - clientY = 223, - gd; + afterEach(destroyGraphDiv); // cartesian click events events use the hover data // from the mousemove events and then simulate // a click event on mouseup - function click() { - mouseEvent('mousemove', clientX, clientY); - mouseEvent('mousedown', clientX, clientY); - mouseEvent('mouseup', clientX, clientY); + function click(x, y) { + mouseEvent('mousemove', x, y); + mouseEvent('mousedown', x, y); + mouseEvent('mouseup', x, y); } - function doubleClick(cb) { - click(); + function doubleClick(x, y, cb) { + click(x, y); setTimeout(function() { - click(); + click(x, y); cb(); }, DBLCLICKDELAY / 2); } @@ -41,38 +41,50 @@ describe('click event', function() { .then(done); }); - it('should contain the correct fields', function() { + describe('click events', function() { var futureData; - gd.on('plotly_click', function(data) { - futureData = data; + beforeEach(function() { + gd.on('plotly_click', function(data) { + futureData = data; + }); }); - click(); - - expect(futureData.points.length).toEqual(1); + it('should not be trigged when not on data points', function() { + click(blankPos[0], blankPos[1]); + expect(futureData).toBe(undefined); + }); - var pt = futureData.points[0]; - expect(Object.keys(pt)).toEqual([ - 'data', 'fullData', 'curveNumber', 'pointNumber', - 'x', 'y', 'xaxis', 'yaxis' - ]); - expect(pt.curveNumber).toEqual(0); - expect(pt.pointNumber).toEqual(11); - expect(pt.x).toEqual(0.125); - expect(pt.y).toEqual(2.125); + it('should contain the correct fields', function() { + click(pointPos[0], pointPos[1]); + expect(futureData.points.length).toEqual(1); + + var pt = futureData.points[0]; + expect(Object.keys(pt)).toEqual([ + 'data', 'fullData', 'curveNumber', 'pointNumber', + 'x', 'y', 'xaxis', 'yaxis' + ]); + expect(pt.curveNumber).toEqual(0); + expect(pt.pointNumber).toEqual(11); + expect(pt.x).toEqual(0.125); + expect(pt.y).toEqual(2.125); + }); }); - it('should trigger double click if two clicks are \'close\' together', function(done) { + describe('double click events', function() { var futureData; - gd.on('plotly_doubleclick', function(data) { - futureData = data; + beforeEach(function() { + gd.on('plotly_doubleclick', function(data) { + futureData = data; + }); }); - doubleClick(function() { - expect(futureData).toBe(null); - done(); + it('should return null', function(done) { + doubleClick(pointPos[0], pointPos[1], function() { + expect(futureData).toBe(null); + done(); + }); }); }); }); diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index e123bba9078..6eb5b27231e 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -5,11 +5,16 @@ var DBLCLICKDELAY = require('@src/plots/cartesian/constants').DBLCLICKDELAY; var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div'); var mouseEvent = require('../assets/mouse_event'); +var customMatchers = require('../assets/custom_matchers'); describe('select box and lasso', function() { var mock = require('@mocks/14.json'); + beforeEach(function() { + jasmine.addMatchers(customMatchers); + }); + afterEach(destroyGraphDiv); function drag(path) { @@ -45,10 +50,8 @@ describe('select box and lasso', function() { function assertRange(actual, expected) { var PRECISION = 4; - expect(actual.x[0]).toBeCloseTo(expected.x[0], PRECISION); - expect(actual.x[1]).toBeCloseTo(expected.x[1], PRECISION); - expect(actual.y[0]).toBeCloseTo(expected.y[0], PRECISION); - expect(actual.y[1]).toBeCloseTo(expected.y[1], PRECISION); + expect(actual.x).toBeCloseToArray(expected.x, PRECISION); + expect(actual.y).toBeCloseToArray(expected.y, PRECISION); } describe('select events', function() { @@ -79,7 +82,7 @@ describe('select box and lasso', function() { }); var doubleClickData; - gd.on('plotly_doubleclick', function(data) { + gd.on('plotly_deselect', function(data) { doubleClickData = data; }); @@ -155,7 +158,7 @@ describe('select box and lasso', function() { }); var doubleClickData; - gd.on('plotly_doubleclick', function(data) { + gd.on('plotly_deselect', function(data) { doubleClickData = data; });