Merge pull request #5181 from Yook74/master

Fix modebar not recreated when makePlotFramework called

Author: archmoj

src/plot_api/plot_api.js

@@ -3751,6 +3751,7 @@ function makePlotFramework(gd) {
         .classed('main-svg', true);
 
     fullLayout._modebardiv = fullLayout._paperdiv.append('div');
+    delete fullLayout._modeBar;
 
     fullLayout._hoverpaper = fullLayout._paperdiv.append('svg')
         .classed('main-svg', true);

test/jasmine/tests/modebar_test.js

@@ -1579,4 +1579,46 @@ describe('ModeBar', function() {
             .then(done);
         });
     });
+
+    describe('modebar html', function() {
+        var gd;
+        var traces = [
+            {type: 'scatter', x: [1, 2], y: [1, 2]},
+            {type: 'scatter3d', x: [1, 2], y: [1, 2], z: [1, 2]},
+            {type: 'surface', z: [[1, 2], [1, 2]]},
+            {type: 'heatmap', z: [[1, 2], [1, 2]]},
+        ];
+
+        beforeEach(function() {
+            gd = createGraphDiv();
+        });
+
+        afterEach(function() {
+            Plotly.purge(gd);
+            destroyGraphDiv();
+        });
+
+        function getModebarDiv() {
+            return document.getElementById('modebar-' + gd._fullLayout._uid);
+        }
+
+        traces.forEach(function(fromTrace) {
+            traces.forEach(function(toTrace) {
+                it('is still present when switching from ' + fromTrace.type + ' to ' + toTrace.type, function(done) {
+                    Plotly.plot(gd, [fromTrace], {})
+                    .then(function() {
+                        expect(getModebarDiv()).toBeTruthy();
+                        expect(getModebarDiv().innerHTML).toBeTruthy();
+                    })
+                    .then(Plotly.react(gd, [toTrace]))
+                    .then(function() {
+                        expect(getModebarDiv()).toBeTruthy();
+                        expect(getModebarDiv().innerHTML).toBeTruthy();
+                    })
+                    .then(done)
+                    .catch(failTest);
+                });
+            });
+        });
+    });
 });