From 7527993bb575563d54918b7ea90939d7bc9e4975 Mon Sep 17 00:00:00 2001
From: Blaine Kasten <blainekasten@gmail.com>
Date: Sat, 29 Feb 2020 10:45:14 -0600
Subject: [PATCH] fix(gatsby): Improve error message when EnsureResources fails
 to ensure a resource (#21429)

* fix(gatsby): Ensure that EnsureResources ensures resources

* test

* Throw error if the pageResource fails to load

* fix lint

* add jsx flag to allow test to pass

* Update packages/gatsby/cache-dir/ensure-resources.js

Co-Authored-By: Ward Peeters <ward@coding-tech.com>

Co-authored-by: Ward Peeters <ward@coding-tech.com>
Co-authored-by: GatsbyJS Bot <mathews.kyle+gatsbybot@gmail.com>
---
 .../cache-dir/__tests__/ensure-resources.tsx  | 33 +++++++++++++++++++
 packages/gatsby/cache-dir/ensure-resources.js |  8 +++++
 tsconfig.json                                 |  3 +-
 3 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 packages/gatsby/cache-dir/__tests__/ensure-resources.tsx

diff --git a/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx b/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx
new file mode 100644
index 0000000000000..0613effcbdb04
--- /dev/null
+++ b/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx
@@ -0,0 +1,33 @@
+import React from "react"
+import EnsureResources from "../ensure-resources"
+import { render, getNodeText, cleanup } from "@testing-library/react"
+
+jest.mock(`../loader`, () => {
+  return {
+    loadPageSync(path: string): { loadPageSync: boolean; path: string } {
+      return { loadPageSync: true, path }
+    },
+    loadPage(path: string): Promise<{ loadPage: boolean; path: string }> {
+      return Promise.resolve({ loadPage: true, path })
+    },
+  }
+})
+
+afterAll(cleanup)
+
+describe(`EnsureResources`, () => {
+  it(`loads pages synchronously`, () => {
+    const location = {
+      pathname: `/`,
+    }
+    const { container } = render(
+      <EnsureResources location={location}>
+        {(data: any): string => JSON.stringify(data.pageResources)}
+      </EnsureResources>
+    )
+
+    expect(getNodeText(container)).toMatchInlineSnapshot(
+      `"{\\"loadPageSync\\":true,\\"path\\":\\"/\\"}"`
+    )
+  })
+})
diff --git a/packages/gatsby/cache-dir/ensure-resources.js b/packages/gatsby/cache-dir/ensure-resources.js
index 2c67ce2619857..e67c6b1423b9e 100644
--- a/packages/gatsby/cache-dir/ensure-resources.js
+++ b/packages/gatsby/cache-dir/ensure-resources.js
@@ -74,6 +74,14 @@ class EnsureResources extends React.Component {
   }
 
   render() {
+    if (process.env.NODE_ENV !== `production` && !this.state.pageResources) {
+      throw new Error(
+        `EnsureResources was not able to find resources for path: "${this.props.location.pathname}"
+This typically means that an issue occurred building components for that path.
+Run \`gatsby clean\` to remove any cached elements.`
+      )
+    }
+
     return this.props.children(this.state)
   }
 }
diff --git a/tsconfig.json b/tsconfig.json
index 0b0873225b647..866b23e3c91b6 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -12,7 +12,8 @@
     "strictPropertyInitialization": true,
     "noFallthroughCasesInSwitch": true,
     "resolveJsonModule": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "jsx": "preserve"
   },
   "exclude": ["peril/*", "examples/*"]
 }