Add domready to ensure dom ready before trying to render fixes #1712 (#…

…1804)
gatsbyjs · Aug 14, 2017 · 6ee4b74 · 6ee4b74
1 parent 390fd60
commit 6ee4b74
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 17 deletions.
diff --git a/packages/gatsby/cache-dir/app.js b/packages/gatsby/cache-dir/app.js
@@ -3,6 +3,8 @@ const apiRunner = require(`./api-runner-browser`)
 import React from "react"
 import ReactDOM from "react-dom"
 import { AppContainer as HotContainer } from "react-hot-loader"
+import domReady from "domready"
+
 import socketIo from "./socketIo"
 
 window.___emitter = require(`./emitter`)
@@ -36,14 +38,16 @@ if (Root.default) {
   Root = Root.default
 }
 
-ReactDOM.render(
-  <HotContainer>
-    <Root />
-  </HotContainer>,
-  rootElement,
-  () => {
-    apiRunner(`onInitialClientRender`)
-  }
+domReady(() =>
+  ReactDOM.render(
+    <HotContainer>
+      <Root />
+    </HotContainer>,
+    rootElement,
+    () => {
+      apiRunner(`onInitialClientRender`)
+    }
+  )
 )
 
 if (module.hot) {

diff --git a/packages/gatsby/cache-dir/production-app.js b/packages/gatsby/cache-dir/production-app.js
@@ -10,7 +10,8 @@ import {
 } from "react-router-dom"
 import { ScrollContext } from "react-router-scroll"
 import createHistory from "history/createBrowserHistory"
-// import invariant from "invariant"
+import domReady from "domready"
+
 import emitter from "./emitter"
 window.___emitter = emitter
 // emitter.on(`*`, (type, e) => console.log(`emitter`, type, e))
@@ -148,13 +149,15 @@ loader.getResourcesForPathname(window.location.pathname, () => {
     )
 
   const NewRoot = apiRunner(`wrapRootComponent`, { Root }, Root)[0]
-  ReactDOM.render(
-    <NewRoot />,
-    typeof window !== `undefined`
-      ? document.getElementById(`___gatsby`)
-      : void 0,
-    () => {
-      apiRunner(`onInitialClientRender`)
-    }
+  domReady(() =>
+    ReactDOM.render(
+      <NewRoot />,
+      typeof window !== `undefined`
+        ? document.getElementById(`___gatsby`)
+        : void 0,
+      () => {
+        apiRunner(`onInitialClientRender`)
+      }
+    )
   )
 })
diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json
@@ -38,6 +38,7 @@
     "css-loader": "^0.26.1",
     "debug": "^2.6.0",
     "detect-port": "^1.2.1",
+    "domready": "^1.0.8",
     "dotenv": "^4.0.0",
     "eventemitter2": "^4.1.0",
     "express": "^4.14.0",