invoke dev-404 correctly. Fix loader to handle develop mode

packages/gatsby/cache-dir/app.js

@@ -5,9 +5,8 @@ import domReady from "domready"
 import socketIo from "./socketIo"
 import emitter from "./emitter"
 import { apiRunner, apiRunnerAsync } from "./api-runner-browser"
-import loader, { setApiRunnerForLoader, postInitialRenderWork } from "./loader"
+import loader, { setApiRunnerForLoader } from "./loader"
 import syncRequires from "./sync-requires"
-import pages from "./pages.json"
 
 window.___emitter = emitter
 setApiRunnerForLoader(apiRunner)
@@ -46,19 +45,22 @@ apiRunnerAsync(`onClientEntry`).then(() => {
     ReactDOM.render
   )[0]
 
-  loader.addPagesArray(pages)
   loader.addDevRequires(syncRequires)
 
-  loader.getResourcesForPathname(window.location.pathname).then(() => {
-    const preferDefault = m => (m && m.default) || m
-    let Root = preferDefault(require(`./root`))
-    domReady(() => {
-      renderer(<Root />, rootElement, () => {
-        postInitialRenderWork()
-        apiRunner(`onInitialClientRender`)
+  loader
+    .getResourcesForPathname(window.location.pathname)
+    .then(() => {
+      loader.getResourcesForPathname(`/dev-404-page/`)
+    })
+    .then(() => {
+      const preferDefault = m => (m && m.default) || m
+      let Root = preferDefault(require(`./root`))
+      domReady(() => {
+        renderer(<Root />, rootElement, () => {
+          apiRunner(`onInitialClientRender`)
+        })
       })
     })
-  })
 })
 
 function supportsServiceWorkers(location, navigator) {

packages/gatsby/cache-dir/json-store.js

@@ -83,7 +83,7 @@ class JSONStore extends React.Component {
   render() {
     const data = this.state.pageQueryData[getPathFromProps(this.props)]
     // eslint-disable-next-line
-    const { pages, ...propsWithoutPages } = this.props
+    const { ...propsWithoutPages } = this.props
     if (!data) {
       return <div />
     }

packages/gatsby/cache-dir/loader.js

@@ -187,15 +187,7 @@ const onPostPrefetch = url => {
   }
 }
 
-/**
- * Check if we should fallback to resources for 404 page if resources for a page are not found
- *
- * We can't do that when we don't have full pages manifest - we don't know if page exist or not if we don't have it.
- * We also can't do that on initial render / mount in case we just can't load resources needed for first page.
- * Not falling back to 404 resources will cause "EnsureResources" component to handle scenarios like this with
- * potential reload
- * @param {string} path Path to a page
- */
+// TODO review to make sure this makes sense
 const shouldFallbackTo404Resources = path => path !== `/404.html`
 
 // Note we're not actively using the path data atm. There
@@ -255,15 +247,14 @@ const queue = {
       return true
     }
 
-    // TODO
-    // if (
-    //   process.env.NODE_ENV !== `production` &&
-    //   process.env.NODE_ENV !== `test`
-    // ) {
-    //   devGetPageData(page.path)
-    // }
+    if (
+      process.env.NODE_ENV !== `production` &&
+      process.env.NODE_ENV !== `test`
+    ) {
+      // Ensure latest version of page data is in the JSON store
+      devGetPageData(realPath)
+    }
 
-    // Prefetch resources.
     if (process.env.NODE_ENV === `production`) {
       const pageDataUrl = makePageDataUrl(realPath)
       prefetchHelper(pageDataUrl)
@@ -299,9 +290,12 @@ const queue = {
     )
     if (realPath in pathScriptsCache) {
       return pathScriptsCache[realPath]
-    } else if (shouldFallbackTo404Resources(realPath)) {
-      return queue.getResourcesForPathnameSync(`/404.html`)
-    } else {
+    }
+    // TODO add this back in?
+    // else if (shouldFallbackTo404Resources(realPath)) {
+    //   return queue.getResourcesForPathnameSync(`/404.html`)
+    // }
+    else {
       return null
     }
   },
@@ -363,28 +357,48 @@ const queue = {
 
       const { componentChunkName } = pageData
 
-      if (process.env.NODE_ENV !== `production`) {
+      const finalResolve = component => {
         const page = {
           componentChunkName: pageData.componentChunkName,
           path: pageData.path,
+          compilationHash: pageData.compilationHash,
+        }
+
+        const jsonData = {
+          data: pageData.data,
+          pageContext: pageData.pageContext,
         }
+
         const pageResources = {
-          component: syncRequires.components[page.componentChunkName],
+          component,
+          json: jsonData,
           page,
         }
 
         // Add to the cache.
         pathScriptsCache[realPath] = pageResources
-        devGetPageData(page.path).then(pageData => {
-          emitter.emit(`onPostLoadPageResources`, {
-            page,
-            pageResources,
-          })
-          // Tell plugins the path has been successfully prefetched
-          // TODO onPostPrefetch(makePageDataUrl(realPath))
+        resolve(pageResources)
 
-          resolve(pageResources)
+        emitter.emit(`onPostLoadPageResources`, {
+          page,
+          pageResources,
         })
+
+        // Tell plugins the path has been successfully prefetched
+        const pageDataUrl = makePageDataUrl(realPath)
+        const componentUrls = createComponentUrls(componentChunkName)
+        const resourceUrls = [pageDataUrl].concat(componentUrls)
+        onPostPrefetch({
+          path: rawPath,
+          resourceUrls,
+        })
+      }
+
+      if (process.env.NODE_ENV !== `production`) {
+        // Ensure latest version of page data is in the JSON store
+        devGetPageData(realPath)
+        const component = syncRequires.components[pageData.componentChunkName]
+        finalResolve(component)
       } else {
         console.log(`getting page component: [${componentChunkName}]`)
         cachedFetch(componentChunkName, fetchComponent)
@@ -395,59 +409,12 @@ const queue = {
               resolve(null)
               return
             }
-
-            const page = {
-              componentChunkName,
-              path: pageData.path,
-              compilationHash: pageData.compilationHash,
-            }
-
-            const jsonData = {
-              data: pageData.data,
-              pageContext: pageData.pageContext,
-            }
-
-            const pageResources = {
-              component,
-              json: jsonData,
-              page,
-            }
-
-            // TODO
-            // pageResources.page.jsonURL = createJsonURL(
-            //   jsonDataPaths[page.jsonName]
-            // )
-            pathScriptsCache[realPath] = pageResources
-            resolve(pageResources)
-
-            emitter.emit(`onPostLoadPageResources`, {
-              page,
-              pageResources,
-            })
-
-            // Tell plugins the path has been successfully prefetched
-            const pageDataUrl = makePageDataUrl(realPath)
-            const componentUrls = createComponentUrls(componentChunkName)
-            const resourceUrls = [pageDataUrl].concat(componentUrls)
-            onPostPrefetch({
-              path: rawPath,
-              resourceUrls,
-            })
+            finalResolve(component)
           })
       }
     }),
 }
 
-// TODO This doesn't make sense anymore
-export const postInitialRenderWork = () => {
-  inInitialRender = false
-  if (process.env.NODE_ENV === `production`) {
-    // We got all resources needed for first mount,
-    // we can fetch resources for all pages.
-    fetchPageResourceMap()
-  }
-}
-
 export const setApiRunnerForLoader = runner => {
   apiRunner = runner
   disableCorePrefetching = apiRunner(`disableCorePrefetching`)

packages/gatsby/cache-dir/production-app.js

@@ -12,7 +12,7 @@ import {
 import emitter from "./emitter"
 import PageRenderer from "./page-renderer"
 import asyncRequires from "./async-requires"
-import loader, { setApiRunnerForLoader, postInitialRenderWork } from "./loader"
+import loader, { setApiRunnerForLoader } from "./loader"
 import EnsureResources from "./ensure-resources"
 
 window.asyncRequires = asyncRequires
@@ -22,7 +22,6 @@ window.___compilationHash = window.pageData.compilationHash
 console.log(`compilation hash`, window.___compilationHash)
 
 loader.addPageData([window.pageData])
-// loader.addDataPaths({ [window.page.jsonName]: window.dataPath })
 loader.addProdRequires(asyncRequires)
 setApiRunnerForLoader(apiRunner)
 

packages/gatsby/cache-dir/root.js

@@ -9,7 +9,6 @@ import {
 } from "./navigation"
 import { apiRunner } from "./api-runner-browser"
 import syncRequires from "./sync-requires"
-import pages from "./pages.json"
 import loader from "./loader"
 import JSONStore from "./json-store"
 import EnsureResources from "./ensure-resources"
@@ -41,7 +40,7 @@ class RouteHandler extends React.Component {
 
     // check if page exists - in dev pages are sync loaded, it's safe to use
     // loader.getPage
-    let page = loader.getPage(location.pathname)
+    let page = loader.getResourcesForPathnameSync(location.pathname)
 
     if (page) {
       return (
@@ -52,24 +51,23 @@ class RouteHandler extends React.Component {
                 location={location}
                 shouldUpdateScroll={shouldUpdateScroll}
               >
-                <JSONStore
-                  pages={pages}
-                  {...this.props}
-                  {...locationAndPageResources}
-                />
+                <JSONStore {...this.props} {...locationAndPageResources} />
               </ScrollContext>
             </RouteUpdates>
           )}
         </EnsureResources>
       )
     } else {
-      const dev404Page = pages.find(p => /^\/dev-404-page\/?$/.test(p.path))
-      const Dev404Page = syncRequires.components[dev404Page.componentChunkName]
+      const dev404PageData = loader.getResourcesForPathnameSync(
+        `/dev-404-page/`
+      )
+      const Dev404Page =
+        syncRequires.components[dev404PageData.page.componentChunkName]
 
-      if (!loader.getPage(`/404.html`)) {
+      if (!loader.getResourcesForPathnameSync(`/404.html`)) {
         return (
           <RouteUpdates location={location}>
-            <Dev404Page pages={pages} {...this.props} />
+            <Dev404Page {...this.props} />
           </RouteUpdates>
         )
       }
@@ -79,13 +77,8 @@ class RouteHandler extends React.Component {
           {locationAndPageResources => (
             <RouteUpdates location={location}>
               <Dev404Page
-                pages={pages}
                 custom404={
-                  <JSONStore
-                    pages={pages}
-                    {...this.props}
-                    {...locationAndPageResources}
-                  />
+                  <JSONStore {...this.props} {...locationAndPageResources} />
                 }
                 {...this.props}
               />

packages/gatsby/src/commands/repl.js

@@ -18,7 +18,6 @@ module.exports = async program => {
     schema,
     config,
     babelrc,
-    jsonDataPaths,
     pages,
     components,
     staticQueryComponents,
@@ -39,7 +38,6 @@ module.exports = async program => {
   // set some globals to make life easier
   _.context.babelrc = babelrc
   _.context.components = components
-  _.context.dataPaths = jsonDataPaths
   _.context.getNode = getNode
   _.context.getNodes = getNodes
   _.context.getNodesByType = getNodesByType

packages/gatsby/src/redux/index.js

@@ -78,7 +78,6 @@ function saveState() {
     `nodes`,
     `status`,
     `componentDataDependencies`,
-    `jsonDataPaths`,
     `components`,
     `staticQueryComponents`,
   ])