fix selectedpoints for q1/median/q3 traces + add hover/select tests

Author: etpinard

src/lib/index.js

@@ -584,7 +584,9 @@ lib.tagSelected = function(calcTrace, trace, ptNumber2cdIndex) {
     for(var i = 0; i < selectedpoints.length; i++) {
         var ptIndex = selectedpoints[i];
 
-        if(lib.isIndex(ptIndex)) {
+        if(lib.isIndex(ptIndex) ||
+           (lib.isArrayOrTypedArray(ptIndex) && lib.isIndex(ptIndex[0]) && lib.isIndex(ptIndex[1]))
+        ) {
             var ptNumber = ptIndex2ptNumber ? ptIndex2ptNumber[ptIndex] : ptIndex;
             var cdIndex = ptNumber2cdIndex ? ptNumber2cdIndex[ptNumber] : ptNumber;
 

test/jasmine/tests/box_test.js

@@ -753,6 +753,72 @@ describe('Test box hover:', function() {
         nums: ['median: 2', 'q1: 1.5', 'q3: 2.5', 'max: 3', 'min: 1'],
         name: ['', '', '', '', ''],
         axis: 'trace 0'
+    }, {
+        desc: 'q1/median/q3 signature on boxes',
+        mock: {
+            data: [{
+                type: 'box',
+                x0: 'A',
+                q1: [1],
+                median: [2],
+                q3: [3]
+            }],
+            layout: {
+                width: 400,
+                height: 400
+            }
+        },
+        pos: [200, 200],
+        nums: ['median: 2', 'q1: 1', 'q3: 3'],
+        name: ['', '', ''],
+        axis: 'A'
+    }, {
+        desc: 'q1/median/q3 signature on points',
+        mock: {
+            data: [{
+                type: 'box',
+                x0: 'A',
+                q1: [1],
+                median: [2],
+                q3: [3],
+                y: [[0, 1, 2, 3, 4]],
+                hoveron: 'points',
+                pointpos: 0
+            }],
+            layout: {
+                width: 400,
+                height: 400,
+                margin: {l: 0, t: 0, b: 0, r: 0}
+            }
+        },
+        pos: [200, 200],
+        nums: '2',
+        name: '',
+        axis: 'A'
+    }, {
+        desc: 'q1/median/q3 signature on points + hovertemplate',
+        mock: {
+            data: [{
+                type: 'box',
+                x0: 'A',
+                q1: [1],
+                median: [2],
+                q3: [3],
+                y: [[0, 1, 2, 3, 4]],
+                hoveron: 'points',
+                pointpos: 0,
+                hovertemplate: '%{x} | %{y}<extra>%{pointNumber[0]} | %{pointNumber[1]}</extra>'
+            }],
+            layout: {
+                width: 400,
+                height: 400,
+                margin: {l: 0, t: 0, b: 0, r: 0}
+            }
+        },
+        pos: [200, 200],
+        nums: 'A | 2',
+        name: '0 | 2',
+        axis: 'A'
     }].forEach(function(specs) {
         it('should generate correct hover labels ' + specs.desc, function(done) {
             run(specs).catch(failTest).then(done);
@@ -1306,5 +1372,30 @@ describe('Test box calc', function() {
                 ]]
             );
         });
+
+        it('should tag selected sample points', function() {
+            var cd = _calc({
+                q1: [1], median: [2], q3: [3],
+                x: [[1, 3, 2]]
+            });
+            _assert('base case', cd[0],
+                ['pts'],
+                [[{v: 1, i: [0, 0]}, {v: 2, i: [0, 2]}, {v: 3, i: [0, 1]}]]
+            );
+
+            cd = _calc({
+                q1: [1], median: [2], q3: [3],
+                x: [[1, 3, 2]],
+                selectedpoints: [[0, 1]]
+            });
+            _assert('with set selectedpoints', cd[0],
+                ['pts'],
+                [[
+                    {v: 1, i: [0, 0]},
+                    {v: 2, i: [0, 2]},
+                    {v: 3, i: [0, 1], selected: 1}
+                ]]
+            );
+        });
     });
 });

test/jasmine/tests/select_test.js

@@ -2692,6 +2692,55 @@ describe('Test select box and lasso per trace:', function() {
         .then(done);
     });
 
+    it('@flaky should work for box traces (q1/median/q3 case)', function(done) {
+        var assertPoints = makeAssertPoints(['curveNumber', 'y', 'x']);
+        var assertSelectedPoints = makeAssertSelectedPoints();
+
+        var fig = {
+            data: [{
+                type: 'box',
+                x0: 'A',
+                q1: [1],
+                median: [2],
+                q3: [3],
+                y: [[0, 1, 2, 3, 4]],
+                pointpos: 0,
+            }],
+            layout: {
+                width: 500,
+                height: 500,
+                dragmode: 'lasso'
+            }
+        };
+
+        Plotly.plot(gd, fig)
+        .then(function() {
+            return _run(
+                [[200, 200], [400, 200], [400, 350], [200, 350], [200, 200]],
+                function() {
+                    assertPoints([ [0, 1, undefined], [0, 2, undefined] ]);
+                    assertSelectedPoints({ 0: [[0, 1], [0, 2]] });
+                },
+                null, LASSOEVENTS, 'box lasso'
+            );
+        })
+        .then(function() {
+            return Plotly.relayout(gd, 'dragmode', 'select');
+        })
+        .then(function() {
+            return _run(
+                [[200, 200], [400, 300]],
+                function() {
+                    assertPoints([ [0, 2, undefined] ]);
+                    assertSelectedPoints({ 0: [[0, 2]] });
+                },
+                null, BOXEVENTS, 'box select'
+            );
+        })
+        .catch(failTest)
+        .then(done);
+    });
+
     it('@flaky should work for violin traces', function(done) {
         var assertPoints = makeAssertPoints(['curveNumber', 'y', 'x']);
         var assertSelectedPoints = makeAssertSelectedPoints();