Merge pull request #3806 from plotly/bar-selection-with-rangeslider

Fix bar selection on subplots with rangeslider

Author: etpinard

src/traces/bar/plot.js

@@ -70,17 +70,11 @@ module.exports = function plot(gd, plotinfo, cdModule, traceLayer) {
                 y1 = ya.c2p(di.p1, true);
                 x0 = xa.c2p(di.s0, true);
                 x1 = xa.c2p(di.s1, true);
-
-                // for selections
-                di.ct = [x1, (y0 + y1) / 2];
             } else {
                 x0 = xa.c2p(di.p0, true);
                 x1 = xa.c2p(di.p1, true);
                 y0 = ya.c2p(di.s0, true);
                 y1 = ya.c2p(di.s1, true);
-
-                // for selections
-                di.ct = [(x0 + x1) / 2, y1];
             }
 
             var isBlank = di.isBlank = (

src/traces/bar/select.js

@@ -12,6 +12,7 @@ module.exports = function selectPoints(searchInfo, selectionTester) {
     var cd = searchInfo.cd;
     var xa = searchInfo.xaxis;
     var ya = searchInfo.yaxis;
+    var trace = cd[0].trace;
     var selection = [];
     var i;
 
@@ -21,10 +22,15 @@ module.exports = function selectPoints(searchInfo, selectionTester) {
             cd[i].selected = 0;
         }
     } else {
+        var getCentroid = trace.orientation === 'h' ?
+            function(d) { return [xa.c2p(d.s1, true), (ya.c2p(d.p0, true) + ya.c2p(d.p1, true)) / 2]; } :
+            function(d) { return [(xa.c2p(d.p0, true) + xa.c2p(d.p1, true)) / 2, ya.c2p(d.s1, true)]; };
+
         for(i = 0; i < cd.length; i++) {
             var di = cd[i];
+            var ct = 'ct' in di ? di.ct : getCentroid(di);
 
-            if(selectionTester.contains(di.ct, false, i, searchInfo)) {
+            if(selectionTester.contains(ct, false, i, searchInfo)) {
                 selection.push({
                     pointNumber: i,
                     x: xa.c2d(di.x),

test/jasmine/tests/select_test.js

@@ -2232,16 +2232,7 @@ describe('Test select box and lasso per trace:', function() {
         .then(function() {
             return Plotly.relayout(gd, 'dragmode', 'select');
         })
-        .then(function() {
-            // For some reason we need this to make the following tests pass
-            // on CI consistently. It appears that a double-click action
-            // is being confused with a mere click. See
-            // https://github.com/plotly/plotly.js/pull/2135#discussion_r148897529
-            // for more info.
-            return new Promise(function(resolve) {
-                setTimeout(resolve, 100);
-            });
-        })
+        .then(delay(100))
         .then(function() {
             return _run(
                 [[350, 200], [370, 220]],
@@ -2261,6 +2252,30 @@ describe('Test select box and lasso per trace:', function() {
                 null, BOXEVENTS, 'bar select'
             );
         })
+        .then(function() {
+            // mimic https://github.com/plotly/plotly.js/issues/3795
+            return Plotly.relayout(gd, {
+                'xaxis.rangeslider.visible': true,
+                'xaxis.range': [0, 6]
+            });
+        })
+        .then(function() {
+            return _run(
+                [[350, 200], [360, 200]],
+                function() {
+                    assertPoints([
+                        [0, 2.5, -0.429], [1, 2.5, -1.015], [2, 2.5, -1.172],
+                    ]);
+                    assertSelectedPoints({
+                        0: [25],
+                        1: [25],
+                        2: [25]
+                    });
+                    assertRanges([[2.434, 2.521], [-1.4355, 2.0555]]);
+                },
+                null, BOXEVENTS, 'bar select (after xaxis.range relayout)'
+            );
+        })
         .catch(failTest)
         .then(done);
     });