From c0dae27db93b330c33e4d47076cd3d6cbf07d1fc Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Tue, 11 Jan 2022 14:05:39 -0600
Subject: [PATCH] Add better error for null case as well

---
 errors/threw-undefined.md                     | 18 ++++++++++--
 packages/next/lib/is-error.ts                 |  7 +++++
 .../acceptance/ReactRefreshLogBox.test.ts     | 28 +++++++++++++++++++
 3 files changed, 50 insertions(+), 3 deletions(-)

diff --git a/errors/threw-undefined.md b/errors/threw-undefined.md
index 0d4129ef4f115..4804488cafc49 100644
--- a/errors/threw-undefined.md
+++ b/errors/threw-undefined.md
@@ -1,9 +1,21 @@
-# Threw undefined in render
+# Threw `undefined`/`null`
 
 #### Why This Error Occurred
 
-Somewhere in your code you `throw` an `undefined` value. Since this isn't a valid error there isn't a stack trace. We show this error instead to let you know what to look for.
+Somewhere in your code you `throw` an `undefined` or `null` value. Since this isn't a valid error there isn't a stack trace. We show this error instead to let you know what to look for.
+
+```js
+function getData() {
+  let error
+  throw error
+}
+
+function Page() {
+  const error = data?.error || null
+  throw error
+}
+```
 
 #### Possible Ways to Fix It
 
-Look in your pages and find where an error could be throwing `undefined`
+Look in your pages and find where an error could be throwing `undefined` or `null` values and ensure `new Error()` is used instead.
diff --git a/packages/next/lib/is-error.ts b/packages/next/lib/is-error.ts
index 5fa38c7576876..4560fa7e928e9 100644
--- a/packages/next/lib/is-error.ts
+++ b/packages/next/lib/is-error.ts
@@ -28,6 +28,13 @@ export function getProperError(err: unknown): Error {
           'see here for more info: https://nextjs.org/docs/messages/threw-undefined'
       )
     }
+
+    if (err === null) {
+      return new Error(
+        'A null error was thrown, ' +
+          'see here for more info: https://nextjs.org/docs/messages/threw-undefined'
+      )
+    }
   }
 
   return new Error(isPlainObject(err) ? JSON.stringify(err) : err + '')
diff --git a/test/development/acceptance/ReactRefreshLogBox.test.ts b/test/development/acceptance/ReactRefreshLogBox.test.ts
index 49c33a01cf9f6..f730ed3b6113d 100644
--- a/test/development/acceptance/ReactRefreshLogBox.test.ts
+++ b/test/development/acceptance/ReactRefreshLogBox.test.ts
@@ -982,6 +982,34 @@ describe('ReactRefreshLogBox', () => {
       `"Error: string error"`
     )
 
+    // fix previous error
+    await session.patch(
+      'index.js',
+      `
+        export default () => {
+          return (
+            <div>hello</div>
+          )
+        }
+      `
+    )
+    expect(await session.hasRedbox(false)).toBe(false)
+    await session.patch(
+      'index.js',
+      `
+        export default () => {
+          throw null
+          return (
+            <div>hello</div>
+          )
+        }
+      `
+    )
+    expect(await session.hasRedbox(true)).toBe(true)
+    expect(await session.getRedboxDescription()).toContain(
+      `Error: A null error was thrown`
+    )
+
     await cleanup()
   })
 })