add hover test for M1 bars on M3 bars

Author: archmoj

test/jasmine/tests/hover_label_test.js

@@ -4798,11 +4798,6 @@ describe('hovermode: (x|y)unified', function() {
             }
         })
         .then(function(gd) {
-            _hover(gd, { xpx: 25, ypx: 250 });
-            assertLabel({title: 'Jan 1, 2017', items: [
-                'scatter : 1'
-            ]});
-
             _hover(gd, { xpx: 50, ypx: 250 });
             assertLabel({title: 'Feb 1, 2017', items: [
                 'scatter : 2'
@@ -4875,6 +4870,135 @@ describe('hovermode: (x|y)unified', function() {
         .then(done, done.fail);
     });
 
+    it('case of M1 period bars overlaid on M3 period bars', function(done) {
+        Plotly.newPlot(gd, {
+            data: [
+                {
+                    type: 'bar',
+                    name: 'M3',
+                    xperiod: 'M3',
+                    x: [
+                        '2017-04',
+                        '2017-07',
+                        '2017-10',
+                        '2018-01'
+                    ],
+                    y: [10, 5, 10, 5]
+                },
+                {
+                    type: 'bar',
+                    name: 'M1',
+                    xperiod: 'M1',
+                    x: [
+                        '2017-01',
+                        '2017-02',
+                        '2017-03',
+                        '2017-04',
+                        '2017-05',
+                        '2017-06',
+                        '2017-07',
+                        '2017-08',
+                        '2017-09',
+                        '2017-10',
+                        '2017-11',
+                        '2017-12'
+                    ],
+                    y: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
+                }
+            ],
+            layout: {
+                barmode: 'overlay',
+                hovermode: 'x unified',
+                showlegend: false,
+                width: 500,
+                height: 500,
+                margin: {
+                    t: 50,
+                    b: 50,
+                    l: 50,
+                    r: 50
+                }
+            }
+        })
+        .then(function(gd) {
+            _hover(gd, { xpx: 25, ypx: 250 });
+            assertLabel({title: 'Jan 1, 2017', items: [
+                'M1 : 1'
+            ]});
+
+            _hover(gd, { xpx: 50, ypx: 250 });
+            assertLabel({title: 'Feb 1, 2017', items: [
+                'M1 : 2'
+            ]});
+
+            _hover(gd, { xpx: 75, ypx: 250 });
+            assertLabel({title: 'Mar 1, 2017', items: [
+                'M1 : 3',
+                'M1 : (Feb 1, 2017, 2)'
+            ]});
+
+            _hover(gd, { xpx: 100, ypx: 250 });
+            assertLabel({title: 'Apr 1, 2017', items: [
+                'M3 : 10',
+                'M1 : 4'
+            ]});
+
+            _hover(gd, { xpx: 125, ypx: 250 });
+            assertLabel({title: 'May 1, 2017', items: [
+                'M3 : (Apr 1, 2017, 10)',
+                'M1 : 5'
+            ]});
+
+            _hover(gd, { xpx: 150, ypx: 250 });
+            assertLabel({title: 'Jun 1, 2017', items: [
+                'M3 : (Apr 1, 2017, 10)',
+                'M1 : 6'
+            ]});
+
+            _hover(gd, { xpx: 175, ypx: 250 });
+            assertLabel({title: 'Jul 1, 2017', items: [
+                'M3 : 5',
+                'M1 : 7'
+            ]});
+
+            _hover(gd, { xpx: 200, ypx: 250 });
+            assertLabel({title: 'Aug 1, 2017', items: [
+                'M3 : (Jul 1, 2017, 5)',
+                'M1 : 8'
+            ]});
+
+            _hover(gd, { xpx: 225, ypx: 250 });
+            assertLabel({title: 'Sep 1, 2017', items: [
+                'M3 : (Jul 1, 2017, 5)',
+                'M1 : 9'
+            ]});
+
+            _hover(gd, { xpx: 250, ypx: 250 });
+            assertLabel({title: 'Oct 1, 2017', items: [
+                'M3 : 10',
+                'M1 : 10'
+            ]});
+
+            _hover(gd, { xpx: 275, ypx: 250 });
+            assertLabel({title: 'Nov 1, 2017', items: [
+                'M3 : (Oct 1, 2017, 10)',
+                'M1 : 11'
+            ]});
+
+            _hover(gd, { xpx: 300, ypx: 250 });
+            assertLabel({title: 'Dec 1, 2017', items: [
+                'M3 : (Oct 1, 2017, 10)',
+                'M1 : 12'
+            ]});
+
+            _hover(gd, { xpx: 350, ypx: 250 });
+            assertLabel({title: 'Jan 1, 2018', items: [
+                'M3 : 5'
+            ]});
+        })
+        .then(done, done.fail);
+    });
+
     it('should have the same traceorder as the legend', function(done) {
         var mock = require('@mocks/stacked_area.json');
         var mockCopy = Lib.extendDeep({}, mock);