From 39ceec74c07bad6370f7213ad80c58e0a787aa87 Mon Sep 17 00:00:00 2001
From: archmoj <mojtaba@plot.ly>
Date: Wed, 17 Apr 2019 21:23:11 -0400
Subject: [PATCH] fix 3787 - waterfall line width react bug in mode between

---
 src/traces/waterfall/attributes.js   |  4 +++-
 test/jasmine/tests/waterfall_test.js | 35 ++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/src/traces/waterfall/attributes.js b/src/traces/waterfall/attributes.js
index b93a131fa04..cffbd4755be 100644
--- a/src/traces/waterfall/attributes.js
+++ b/src/traces/waterfall/attributes.js
@@ -96,7 +96,9 @@ module.exports = {
     connector: {
         line: {
             color: extendFlat({}, lineAttrs.color, {dflt: Color.defaultLine}),
-            width: lineAttrs.width,
+            width: extendFlat({}, lineAttrs.width, {
+                editType: 'plot', // i.e. to adjust bars is mode: 'between'. See https://github.com/plotly/plotly.js/issues/3787
+            }),
             dash: lineAttrs.dash,
             editType: 'plot'
         },
diff --git a/test/jasmine/tests/waterfall_test.js b/test/jasmine/tests/waterfall_test.js
index 25761ac46cb..534e33c9143 100644
--- a/test/jasmine/tests/waterfall_test.js
+++ b/test/jasmine/tests/waterfall_test.js
@@ -1140,6 +1140,41 @@ describe('A waterfall plot', function() {
         .catch(failTest)
         .then(done);
     });
+
+    it('should be able to adjust bars when reacting with new connector.line.width ', function(done) {
+        Plotly.plot(gd, {
+            data: [{
+                type: 'waterfall',
+                y: [1, 2, 3],
+            }],
+            layout: {
+                width: 500,
+                height: 500
+            }
+        })
+        .then(function() {
+            var traceNodes = getAllTraceNodes(gd);
+            var waterfallNodes = getAllWaterfallNodes(traceNodes[0]);
+            var path = waterfallNodes[0].querySelector('path');
+            var d = d3.select(path).attr('d');
+            expect(d).toBe('M11.33,321V268.33H102V321Z');
+        })
+        .then(function() {
+            gd.data[0].connector = {
+                line: { width: 10 }
+            };
+            return Plotly.react(gd, gd.data);
+        })
+        .then(function() {
+            var traceNodes = getAllTraceNodes(gd);
+            var waterfallNodes = getAllWaterfallNodes(traceNodes[0]);
+            var path = waterfallNodes[0].querySelector('path');
+            var d = d3.select(path).attr('d');
+            expect(d).toBe('M11.33,325V264.33H102V325Z');
+        })
+        .catch(failTest)
+        .then(done);
+    });
 });
 
 describe('waterfall visibility toggling:', function() {