[backport] PR #8371 to 5.x

src/ui/public/vislib/lib/resize_checker.js

@@ -184,6 +184,10 @@ export default function ResizeCheckerFactory(Private, Notifier, $rootScope) {
     }, ms));
   };
 
+  ResizeChecker.prototype.stopSchedule = function () {
+    clearTimeout(this._timerId);
+  };
+
   /**
    * Signal that the ResizeChecker should shutdown.
    *

src/ui/public/vislib/vis.js

@@ -68,7 +68,7 @@ export default function VisFactory(Private) {
     }
 
     this.handler = handlerTypes[chartType](this) || handlerTypes.column(this);
-    this._runOnHandler('render');
+    this._runWithoutResizeChecker('render');
   };
 
   /**
@@ -89,6 +89,14 @@ export default function VisFactory(Private) {
     }
   };
 
+  Vis.prototype._runWithoutResizeChecker = function (method) {
+    this.resizeChecker.stopSchedule();
+    this._runOnHandler(method);
+    this.resizeChecker.saveSize();
+    this.resizeChecker.saveDirty(false);
+    this.resizeChecker.continueSchedule();
+  };
+
   Vis.prototype._runOnHandler = function (method) {
     try {
       this.handler[method]();

src/ui/public/vislib_vis_type/__tests__/_vislib_renderbot.js

@@ -134,10 +134,11 @@ describe('renderbot', function exportWrapper() {
       let buildStub = sinon.stub(renderbot, 'buildChartData', _.constant(football));
       let renderStub = sinon.stub(renderbot.vislibVis, 'render');
 
-      renderbot.render('flat data', persistedState);
-      expect(renderStub.callCount).to.be(1);
-      expect(buildStub.callCount).to.be(1);
-      expect(renderStub.firstCall.args[0]).to.be(football);
+      return renderbot.render('flat data', persistedState).then(() => {
+        expect(renderStub.callCount).to.be(1);
+        expect(buildStub.callCount).to.be(1);
+        expect(renderStub.firstCall.args[0]).to.be(football);
+      });
     });
   });
 

src/ui/public/vislib_vis_type/vislib_renderbot.js

@@ -46,7 +46,12 @@ module.exports = function VislibRenderbotFactory(Private) {
   VislibRenderbot.prototype.buildChartData = buildChartData;
   VislibRenderbot.prototype.render = function (esResponse) {
     this.chartData = this.buildChartData(esResponse);
-    this.vislibVis.render(this.chartData, this.uiState);
+    // to allow legend to render first (wait for angular digest cycle to complete)
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        resolve(this.vislibVis.render(this.chartData, this.uiState));
+      });
+    });
   };
 
   VislibRenderbot.prototype.destroy = function () {