From 69997b1d185419b55b3cc83498727fabe571cb14 Mon Sep 17 00:00:00 2001 From: Chelsea Date: Wed, 2 Dec 2015 14:31:26 -0500 Subject: [PATCH 1/5] or instead of and in showCommonLabel logic --- src/plots/cartesian/graph_interact.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 3af14739642..131ff5ceeae 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -778,7 +778,7 @@ function createHoverText(hoverData, opts) { var i, traceHoverinfo; for (i = 0; i < hoverData.length; i++) { traceHoverinfo = hoverData[i].trace.hoverinfo; - if (traceHoverinfo.indexOf('all')===-1 && + if (traceHoverinfo.indexOf('all')===-1 || traceHoverinfo.indexOf(hovermode)===-1) { showCommonLabel = false; break; From b45886fcc23cff08589bb0f4472c4681516dac7c Mon Sep 17 00:00:00 2001 From: Chelsea Date: Thu, 3 Dec 2015 16:10:00 -0500 Subject: [PATCH 2/5] edit interact tests and add hover label tests --- src/plots/cartesian/graph_interact.js | 5 +- test/jasmine/tests/hover_label_test.js | 97 ++++++++++++++++++++++++ test/jasmine/tests/plot_interact_test.js | 26 +------ 3 files changed, 102 insertions(+), 26 deletions(-) create mode 100644 test/jasmine/tests/hover_label_test.js diff --git a/src/plots/cartesian/graph_interact.js b/src/plots/cartesian/graph_interact.js index 131ff5ceeae..9994260899c 100644 --- a/src/plots/cartesian/graph_interact.js +++ b/src/plots/cartesian/graph_interact.js @@ -778,8 +778,9 @@ function createHoverText(hoverData, opts) { var i, traceHoverinfo; for (i = 0; i < hoverData.length; i++) { traceHoverinfo = hoverData[i].trace.hoverinfo; - if (traceHoverinfo.indexOf('all')===-1 || - traceHoverinfo.indexOf(hovermode)===-1) { + var parts = traceHoverinfo.split('+'); + if (parts.indexOf('all') === -1 && + parts.indexOf(hovermode) === -1) { showCommonLabel = false; break; } diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js new file mode 100644 index 00000000000..4d44f94fefb --- /dev/null +++ b/test/jasmine/tests/hover_label_test.js @@ -0,0 +1,97 @@ +var d3 = require('d3'); + +var Plotly = require('@src/index'); +var Fx = require('@src/plots/cartesian/graph_interact'); +var Lib = require('@src/lib'); + +var createGraphDiv = require('../assets/create_graph_div'); +var destroyGraphDiv = require('../assets/destroy_graph_div'); + +describe('hover info', function() { + 'use strict'; + + var mock = require('@mocks/14.json'), + evt = { + clientX: mock.layout.width/ 2, + clientY: mock.layout.height / 2 + }; + + afterEach(destroyGraphDiv); + + describe('hover info', function() { + var mockCopy = Lib.extendDeep({}, mock); + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388'); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1'); + }); + }); + + describe('hover info x', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].hoverinfo = 'x'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover x', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').size()).toEqual(0); + expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388'); + }); + }); + + describe('hover info y', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].hoverinfo = 'y'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover y', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(0); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1'); + }); + }); +}); diff --git a/test/jasmine/tests/plot_interact_test.js b/test/jasmine/tests/plot_interact_test.js index bddb8492853..9a84361cd64 100644 --- a/test/jasmine/tests/plot_interact_test.js +++ b/test/jasmine/tests/plot_interact_test.js @@ -12,7 +12,7 @@ describe('Test plot structure', function () { afterEach(destroyGraphDiv); - describe('cartesian plots', function() { + describe('cartesian plots', function() { describe('scatter traces', function() { var mock = require('@mocks/14.json'); @@ -45,29 +45,8 @@ describe('Test plot structure', function () { expect(nodes[0].length).toEqual(Npts); }); - - it('responds to hover', function() { - var gd = document.getElementById('graph'); - - var evt = { - clientX: gd.layout.width/ 2, - clientY: gd.layout.height / 2 - }; - - Fx.hover('graph', evt, 'xy'); - - var hoverTrace = gd._hoverdata[0]; - - expect(hoverTrace.curveNumber).toEqual(0); - expect(hoverTrace.pointNumber).toEqual(17); - expect(hoverTrace.x).toEqual(0.388); - expect(hoverTrace.y).toEqual(1); - - expect(d3.selectAll('g.axistext')[0].length).toEqual(1); - expect(d3.selectAll('g.hovertext')[0].length).toEqual(1); - }); }); - + describe('pie traces', function() { var mock = require('@mocks/pie_simple.json'); @@ -86,7 +65,6 @@ describe('Test plot structure', function () { expect(nodes[0].length).toEqual(Npts); }); }); - }); describe('geo plots', function() { From 9c5a14a7496e6cbeb7c863f366d3698b61d94c58 Mon Sep 17 00:00:00 2001 From: Chelsea Date: Thu, 3 Dec 2015 16:22:37 -0500 Subject: [PATCH 3/5] remove white space --- test/jasmine/tests/plot_interact_test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/test/jasmine/tests/plot_interact_test.js b/test/jasmine/tests/plot_interact_test.js index 9a84361cd64..80ed3a1918d 100644 --- a/test/jasmine/tests/plot_interact_test.js +++ b/test/jasmine/tests/plot_interact_test.js @@ -12,7 +12,7 @@ describe('Test plot structure', function () { afterEach(destroyGraphDiv); - describe('cartesian plots', function() { + describe('cartesian plots', function() { describe('scatter traces', function() { var mock = require('@mocks/14.json'); @@ -46,7 +46,7 @@ describe('Test plot structure', function () { expect(nodes[0].length).toEqual(Npts); }); }); - + describe('pie traces', function() { var mock = require('@mocks/pie_simple.json'); From 8e363e5b2ea73565533afd835b87b22f72d76224 Mon Sep 17 00:00:00 2001 From: Chelsea Date: Thu, 3 Dec 2015 16:57:30 -0500 Subject: [PATCH 4/5] more hover tests --- test/jasmine/tests/hover_label_test.js | 164 +++++++++++++++++++++++-- 1 file changed, 153 insertions(+), 11 deletions(-) diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js index 4d44f94fefb..5e35525d63b 100644 --- a/test/jasmine/tests/hover_label_test.js +++ b/test/jasmine/tests/hover_label_test.js @@ -9,13 +9,13 @@ var destroyGraphDiv = require('../assets/destroy_graph_div'); describe('hover info', function() { 'use strict'; - + var mock = require('@mocks/14.json'), evt = { clientX: mock.layout.width/ 2, clientY: mock.layout.height / 2 }; - + afterEach(destroyGraphDiv); describe('hover info', function() { @@ -23,14 +23,14 @@ describe('hover info', function() { beforeEach(function(done) { Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); - }); + }); it('responds to hover', function() { var gd = document.getElementById('graph'); Fx.hover('graph', evt, 'xy'); - + var hoverTrace = gd._hoverdata[0]; - + expect(hoverTrace.curveNumber).toEqual(0); expect(hoverTrace.pointNumber).toEqual(17); expect(hoverTrace.x).toEqual(0.388); @@ -50,14 +50,14 @@ describe('hover info', function() { beforeEach(function(done) { Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); - }); + }); it('responds to hover x', function() { var gd = document.getElementById('graph'); Fx.hover('graph', evt, 'xy'); - + var hoverTrace = gd._hoverdata[0]; - + expect(hoverTrace.curveNumber).toEqual(0); expect(hoverTrace.pointNumber).toEqual(17); expect(hoverTrace.x).toEqual(0.388); @@ -76,14 +76,14 @@ describe('hover info', function() { beforeEach(function(done) { Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); - }); + }); it('responds to hover y', function() { var gd = document.getElementById('graph'); Fx.hover('graph', evt, 'xy'); - + var hoverTrace = gd._hoverdata[0]; - + expect(hoverTrace.curveNumber).toEqual(0); expect(hoverTrace.pointNumber).toEqual(17); expect(hoverTrace.x).toEqual(0.388); @@ -94,4 +94,146 @@ describe('hover info', function() { expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1'); }); }); + + describe('hover info text', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].text = [] + mockCopy.data[0].text[17] = 'hover text' + mockCopy.data[0].hoverinfo = 'text'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover text', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(0); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('hover text'); + }); + }); + + describe('hover info all', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].text = [] + mockCopy.data[0].text[17] = 'hover text' + mockCopy.data[0].hoverinfo = 'all'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover all', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388'); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1hover text'); + }); + }); + + describe('hover info y+text', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].text = [] + mockCopy.data[0].text[17] = 'hover text' + mockCopy.data[0].hoverinfo = 'y+text'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover y+text', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(0); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1hover text'); + }); + }); + + describe('hover info x+text', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].text = [] + mockCopy.data[0].text[17] = 'hover text' + mockCopy.data[0].hoverinfo = 'x+text'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover x+text', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388'); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('hover text'); + }); + }); + + describe('hover info text with html', function() { + var mockCopy = Lib.extendDeep({}, mock); + + mockCopy.data[0].text = [] + mockCopy.data[0].text[17] = 'hover
text' + mockCopy.data[0].hoverinfo = 'text'; + + beforeEach(function(done) { + Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done); + }); + + it('responds to hover text with html', function() { + var gd = document.getElementById('graph'); + Fx.hover('graph', evt, 'xy'); + + var hoverTrace = gd._hoverdata[0]; + + expect(hoverTrace.curveNumber).toEqual(0); + expect(hoverTrace.pointNumber).toEqual(17); + expect(hoverTrace.x).toEqual(0.388); + expect(hoverTrace.y).toEqual(1); + + expect(d3.selectAll('g.axistext').size()).toEqual(0); + expect(d3.selectAll('g.hovertext').size()).toEqual(1); + expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('hovertext'); + }); + }); }); From e51e0df12a4dece42b0b938677133c195af0ef91 Mon Sep 17 00:00:00 2001 From: Chelsea Date: Thu, 3 Dec 2015 18:12:34 -0500 Subject: [PATCH 5/5] fix for tspans differing on chrome vs firefox --- test/jasmine/tests/hover_label_test.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js index 5e35525d63b..97d81031c58 100644 --- a/test/jasmine/tests/hover_label_test.js +++ b/test/jasmine/tests/hover_label_test.js @@ -148,7 +148,9 @@ describe('hover info', function() { expect(d3.selectAll('g.axistext').size()).toEqual(1); expect(d3.selectAll('g.hovertext').size()).toEqual(1); expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388'); - expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1hover text'); + expect(d3.selectAll('g.hovertext').select('text').selectAll('tspan').size()).toEqual(2); + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('1') + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('hover text') }); }); @@ -176,7 +178,9 @@ describe('hover info', function() { expect(d3.selectAll('g.axistext').size()).toEqual(0); expect(d3.selectAll('g.hovertext').size()).toEqual(1); - expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1hover text'); + expect(d3.selectAll('g.hovertext').selectAll('tspan').size()).toEqual(2); + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('1') + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('hover text') }); }); @@ -233,7 +237,9 @@ describe('hover info', function() { expect(d3.selectAll('g.axistext').size()).toEqual(0); expect(d3.selectAll('g.hovertext').size()).toEqual(1); - expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('hovertext'); + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('hover') + expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('text') + expect(d3.selectAll('g.hovertext').select('text').selectAll('tspan').size()).toEqual(2); }); }); });