From 3c3a407a0d36baf867e7a0d6bf0d7dbd381af2c5 Mon Sep 17 00:00:00 2001
From: Andrew Razumovsky <grimones00@gmail.com>
Date: Wed, 2 May 2018 03:00:44 +0300
Subject: [PATCH] Fix render order in preview

---
 app/angular/src/client/preview/render.js | 2 +-
 app/mithril/src/client/preview/render.js | 2 +-
 app/polymer/src/client/preview/render.js | 3 ++-
 app/react/src/client/preview/render.js   | 2 +-
 app/vue/src/client/preview/render.js     | 2 +-
 5 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/app/angular/src/client/preview/render.js b/app/angular/src/client/preview/render.js
index de207f044ea9..9b0b027d0c38 100644
--- a/app/angular/src/client/preview/render.js
+++ b/app/angular/src/client/preview/render.js
@@ -1,6 +1,6 @@
 import { renderNgApp } from './angular/helpers';
 
 export default function render({ story, showMain }) {
-  renderNgApp(story);
   showMain();
+  renderNgApp(story);
 }
diff --git a/app/mithril/src/client/preview/render.js b/app/mithril/src/client/preview/render.js
index be4cc02ff0e1..39b14981cda4 100644
--- a/app/mithril/src/client/preview/render.js
+++ b/app/mithril/src/client/preview/render.js
@@ -21,6 +21,6 @@ export default function renderMain({ story, selectedKind, selectedStory, showMai
     return;
   }
 
-  m.mount(rootEl, { view: () => m(element) });
   showMain();
+  m.mount(rootEl, { view: () => m(element) });
 }
diff --git a/app/polymer/src/client/preview/render.js b/app/polymer/src/client/preview/render.js
index bedc43362574..201966de513b 100644
--- a/app/polymer/src/client/preview/render.js
+++ b/app/polymer/src/client/preview/render.js
@@ -17,6 +17,8 @@ export default function renderMain({ story, selectedKind, selectedStory, showMai
     });
     return;
   }
+
+  showMain();
   if (typeof component === 'string') {
     rootElement.innerHTML = component;
   } else if (component instanceof TemplateResult) {
@@ -28,5 +30,4 @@ export default function renderMain({ story, selectedKind, selectedStory, showMai
     rootElement.innerHTML = '';
     rootElement.appendChild(component);
   }
-  showMain();
 }
diff --git a/app/react/src/client/preview/render.js b/app/react/src/client/preview/render.js
index 82d60b2dcbb6..2094cc207b91 100644
--- a/app/react/src/client/preview/render.js
+++ b/app/react/src/client/preview/render.js
@@ -43,6 +43,6 @@ export default function renderMain({ story, selectedKind, selectedStory, showMai
   // This could leads to issues like below:
   //    https://github.com/storybooks/react-storybook/issues/81
   ReactDOM.unmountComponentAtNode(rootEl);
-  render(element, rootEl);
   showMain();
+  render(element, rootEl);
 }
diff --git a/app/vue/src/client/preview/render.js b/app/vue/src/client/preview/render.js
index 9f7128801de7..7c865949b656 100644
--- a/app/vue/src/client/preview/render.js
+++ b/app/vue/src/client/preview/render.js
@@ -32,11 +32,11 @@ export default function render({
     return;
   }
 
+  showMain();
   renderRoot({
     el: '#root',
     render(h) {
       return h('div', { attrs: { id: 'root' } }, [h(component)]);
     },
   });
-  showMain();
 }