From 4b4a07df49fce25bcef9f769fd35b7a354fce439 Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Thu, 28 Jul 2022 13:39:43 -0500
Subject: [PATCH 1/2] Ensure we hard navigate for failed _next/data with
 middleware

---
 packages/next/shared/lib/router/router.ts     | 21 ++++++++-----------
 .../e2e/middleware-rewrites/app/middleware.js |  6 ++++++
 test/e2e/middleware-rewrites/app/pages/404.js |  3 +++
 .../middleware-rewrites/test/index.test.ts    | 12 +++++++++++
 4 files changed, 30 insertions(+), 12 deletions(-)
 create mode 100644 test/e2e/middleware-rewrites/app/pages/404.js

diff --git a/packages/next/shared/lib/router/router.ts b/packages/next/shared/lib/router/router.ts
index c77d38c1dc28..0c48c76398ec 100644
--- a/packages/next/shared/lib/router/router.ts
+++ b/packages/next/shared/lib/router/router.ts
@@ -481,7 +481,7 @@ function fetchNextData({
               return { dataHref, response, text, json: {} }
             }
 
-            if (response.status === 404) {
+            if (!hasMiddleware && response.status === 404) {
               if (tryToParseAsJSON(text)?.notFound) {
                 return {
                   dataHref,
@@ -490,16 +490,6 @@ function fetchNextData({
                   text,
                 }
               }
-
-              /**
-               * If there is a 404 that is not for SSG we used to fail but if
-               * there is a middleware we must respond with an empty object.
-               * For now we will return the data when there is a middleware.
-               * TODO: Update the server to success on these requests.
-               */
-              if (hasMiddleware) {
-                return { dataHref, response, text, json: {} }
-              }
             }
 
             const error = new Error(`Failed to load static props`)
@@ -2341,7 +2331,14 @@ function getMiddlewareData<T extends FetchDataOutput>(
 
   const matchedPath = response.headers.get('x-matched-path')
 
-  if (!rewriteTarget && !matchedPath?.includes('__next_data_catchall')) {
+  if (
+    matchedPath &&
+    !rewriteTarget &&
+    !matchedPath.includes('__next_data_catchall') &&
+    !matchedPath.includes('/_error') &&
+    !matchedPath.includes('/404')
+  ) {
+    // leverage x-matched-path to detect next.config.js rewrites
     rewriteTarget = matchedPath
   }
 
diff --git a/test/e2e/middleware-rewrites/app/middleware.js b/test/e2e/middleware-rewrites/app/middleware.js
index f9734bfdf9c7..d8c89b3292de 100644
--- a/test/e2e/middleware-rewrites/app/middleware.js
+++ b/test/e2e/middleware-rewrites/app/middleware.js
@@ -13,6 +13,12 @@ export async function middleware(request) {
     return NextResponse.next()
   }
 
+  if (url.pathname.includes('/to/some/404/path')) {
+    return NextResponse.next({
+      'x-matched-path': '/404',
+    })
+  }
+
   if (url.pathname.includes('/fallback-true-blog/rewritten')) {
     request.nextUrl.pathname = '/about'
     return NextResponse.rewrite(request.nextUrl)
diff --git a/test/e2e/middleware-rewrites/app/pages/404.js b/test/e2e/middleware-rewrites/app/pages/404.js
new file mode 100644
index 000000000000..cc3910106c11
--- /dev/null
+++ b/test/e2e/middleware-rewrites/app/pages/404.js
@@ -0,0 +1,3 @@
+export default function NotFound() {
+  return <p>custom 404 page</p>
+}
diff --git a/test/e2e/middleware-rewrites/test/index.test.ts b/test/e2e/middleware-rewrites/test/index.test.ts
index 2c84a9b8d978..131df7cd713e 100644
--- a/test/e2e/middleware-rewrites/test/index.test.ts
+++ b/test/e2e/middleware-rewrites/test/index.test.ts
@@ -27,6 +27,18 @@ describe('Middleware Rewrite', () => {
   testsWithLocale('/fr')
 
   function tests() {
+    it.only('should hard navigate on 404 for data request', async () => {
+      const browser = await webdriver(next.url, '/')
+      await browser.eval('window.beforeNav = 1')
+      await browser.eval(`next.router.push("/to/some/404/path")`)
+      await check(
+        () => browser.eval('document.documentElement.innerHTML'),
+        /custom 404 page/
+      )
+      expect(await browser.eval('location.pathname')).toBe('/to/some/404/path')
+      expect(await browser.eval('window.beforeNav')).not.toBe(1)
+    })
+
     // TODO: middleware effect headers aren't available here
     it.skip('includes the locale in rewrites by default', async () => {
       const res = await fetchViaHTTP(next.url, `/rewrite-me-to-about`)

From 93781bb6648bf523495c23754daab53b106dace2 Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Thu, 28 Jul 2022 13:50:39 -0500
Subject: [PATCH 2/2] fix-lint

---
 test/e2e/middleware-rewrites/test/index.test.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/e2e/middleware-rewrites/test/index.test.ts b/test/e2e/middleware-rewrites/test/index.test.ts
index 131df7cd713e..bf2420cc601c 100644
--- a/test/e2e/middleware-rewrites/test/index.test.ts
+++ b/test/e2e/middleware-rewrites/test/index.test.ts
@@ -27,7 +27,7 @@ describe('Middleware Rewrite', () => {
   testsWithLocale('/fr')
 
   function tests() {
-    it.only('should hard navigate on 404 for data request', async () => {
+    it('should hard navigate on 404 for data request', async () => {
       const browser = await webdriver(next.url, '/')
       await browser.eval('window.beforeNav = 1')
       await browser.eval(`next.router.push("/to/some/404/path")`)