Merge pull request #3480 from plotly/3478-fix-hovertemplate

do not delete hoverlabel when hovertemplate is defined

Author: antoinerg

src/components/fx/hover.js

@@ -957,8 +957,9 @@ function createHoverText(hoverData, opts, gd) {
         if(d.extraText !== undefined) text += (text ? '<br>' : '') + d.extraText;
 
         // if 'text' is empty at this point,
+        // and hovertemplate is not defined,
         // put 'name' in main label and don't show secondary label
-        if(text === '') {
+        if(text === '' && !d.hovertemplate) {
             // if 'name' is also empty, remove entire label
             if(name === '') g.remove();
             text = name;

test/jasmine/tests/pie_test.js

@@ -1084,6 +1084,7 @@ describe('pie hovering', function() {
         });
 
         it('should use hovertemplate if specified', function(done) {
+            mockCopy.data[0].name = '';
             Plotly.plot(gd, mockCopy.data, mockCopy.layout)
             .then(_hover)
             .then(function() {

test/jasmine/tests/scattergeo_test.js

@@ -299,6 +299,17 @@ describe('Test scattergeo hover', function() {
         .then(done);
     });
 
+    it('should not hide hover label when hovertemplate', function(done) {
+        Plotly.restyle(gd, {
+            name: '',
+            hovertemplate: 'tpl %{lat}<extra>x</extra>'
+        }).then(function() {
+            check([381, 221], ['tpl 10', 'x']);
+        })
+        .catch(failTest)
+        .then(done);
+    });
+
     it('should generate hover label info (\'text\' single value case)', function(done) {
         Plotly.restyle(gd, 'text', 'text').then(function() {
             check([381, 221], ['(10°, 10°)\ntext', null]);

test/jasmine/tests/scattermapbox_test.js

@@ -10,6 +10,7 @@ var destroyGraphDiv = require('../assets/destroy_graph_div');
 var failTest = require('../assets/fail_test');
 var supplyAllDefaults = require('../assets/supply_defaults');
 
+var assertHoverLabelContent = require('../assets/custom_assertions').assertHoverLabelContent;
 var mouseEvent = require('../assets/mouse_event');
 var click = require('../assets/click');
 var HOVERMINTIME = require('@src/components/fx').constants.HOVERMINTIME;
@@ -601,6 +602,15 @@ describe('@noCI scattermapbox hover', function() {
         };
     }
 
+    function checkHoverLabel(pos, content) {
+        mouseEvent('mousemove', pos[0], pos[1]);
+
+        assertHoverLabelContent({
+            nums: content[0],
+            name: content[1]
+        });
+    }
+
     it('should generate hover label info (base case)', function() {
         var xval = 11;
         var yval = 11;
@@ -788,6 +798,17 @@ describe('@noCI scattermapbox hover', function() {
             done();
         });
     });
+
+    it('should always display hoverlabel when hovertemplate is defined', function(done) {
+        Plotly.restyle(gd, {
+            name: '',
+            hovertemplate: 'tpl2<extra></extra>'
+        })
+        .then(function() {
+            checkHoverLabel([190, 215], ['tpl2', '']);
+            done();
+        });
+    });
 });
 
 describe('@noCI Test plotly events on a scattermapbox plot:', function() {

test/jasmine/tests/scatterpolar_test.js

@@ -117,6 +117,15 @@ describe('Test scatterpolar hover:', function() {
         },
         nums: 'template 4.02289202968 128.342009045',
         name: 'Trial 3'
+    }, {
+        desc: 'with hovertemplate and empty trace name',
+        patch: function(fig) {
+            fig.data[2].hovertemplate = 'template %{r} %{theta}';
+            fig.data[2].name = '';
+            return fig;
+        },
+        nums: 'template 4.02289202968 128.342009045',
+        name: ''
     }, {
         desc: '(no labels - out of sector)',
         patch: function(fig) {

test/jasmine/tests/scatterternary_test.js

@@ -9,6 +9,9 @@ var failTest = require('../assets/fail_test');
 var customAssertions = require('../assets/custom_assertions');
 var supplyAllDefaults = require('../assets/supply_defaults');
 
+var mouseEvent = require('../assets/mouse_event');
+var assertHoverLabelContent = customAssertions.assertHoverLabelContent;
+
 var assertClip = customAssertions.assertClip;
 var assertNodeDisplay = customAssertions.assertNodeDisplay;
 
@@ -334,17 +337,24 @@ describe('scatterternary hover', function() {
 
     var gd;
 
+    function check(pos, content) {
+        mouseEvent('mousemove', pos[0], pos[1]);
+
+        assertHoverLabelContent({
+            nums: content[0],
+            name: content[1]
+        });
+    }
+
     beforeAll(function(done) {
         gd = createGraphDiv();
-
         var data = [{
             type: 'scatterternary',
             a: [0.1, 0.2, 0.3],
             b: [0.3, 0.2, 0.1],
             c: [0.1, 0.4, 0.5],
             text: ['A', 'B', 'C']
         }];
-
         Plotly.plot(gd, data).then(done);
     });
 
@@ -418,6 +428,25 @@ describe('scatterternary hover', function() {
         .then(done);
     });
 
+    it('should always display hoverlabel when hovertemplate is defined', function(done) {
+        var fig = Lib.extendDeep({}, require('@mocks/ternary_simple.json'));
+
+        Plotly.newPlot(gd, fig)
+        .then(function() {
+            return Plotly.restyle(gd, {
+                hovertemplate: '%{a}, %{b}, %{c}',
+                name: '',
+                text: null,
+                hovertext: null
+            });
+        })
+        .then(function() {
+            check([380, 210], ['0.5, 0.25, 0.25']);
+        })
+        .catch(failTest)
+        .then(done);
+    });
+
 });
 
 describe('Test scatterternary *cliponaxis*', function() {