fix: manually triggered notFound pages in page-router for older versions of next (#541)

* test: update simple-app fixture to have clearer route and to use custom 404

* fix: improve parallel route matching when building server cache

---------

Co-authored-by: Michal Piechowiak <[email protected]>

Author: mrstork

src/build/content/prerendered.ts

@@ -57,7 +57,13 @@ const buildAppCacheValue = async (path: string): Promise<CachedPageValue> => {
     readFile(`${path}.prefetch.rsc`, 'utf-8'),
   )
 
-  if (!meta.status && meta.headers['x-next-cache-tags'].includes('_N_T_/not-found/layout')) {
+  // Next < v14.2.0 does not set meta.status when notFound() is called directly on a page
+  // Exclude Parallel routes, they are 404s when visited directly
+  if (
+    !meta.status &&
+    rsc.includes('NEXT_NOT_FOUND') &&
+    !meta.headers['x-next-cache-tags'].includes('/@')
+  ) {
     meta.status = 404
   }
 

tests/e2e/simple-app.test.ts

@@ -213,7 +213,7 @@ test('requesting a non existing page route that needs to be fetched from the blo
   const headers = response?.headers() || {}
   expect(response?.status()).toBe(404)
 
-  expect(await page.textContent('h1')).toBe('404')
+  expect(await page.textContent('h1')).toBe('404 Not Found')
 
   expect(headers['netlify-cdn-cache-control']).toBe(
     'private, no-cache, no-store, max-age=0, must-revalidate',
@@ -225,11 +225,11 @@ test('requesting a non existing page route that needs to be fetched from the blo
   page,
   simple,
 }) => {
-  const response = await page.goto(new URL('not-found', simple.url).href)
+  const response = await page.goto(new URL('route-resolves-to-not-found', simple.url).href)
   const headers = response?.headers() || {}
   expect(response?.status()).toBe(404)
 
-  expect(await page.textContent('h1')).toBe('404')
+  expect(await page.textContent('h1')).toBe('404 Not Found')
 
   expect(headers['netlify-cdn-cache-control']).toBe(
     's-maxage=31536000, stale-while-revalidate=31536000',

tests/fixtures/simple/app/not-found.js

@@ -0,0 +1,8 @@
+export default function NotFound() {
+  return (
+    <div>
+      <h1>404 Not Found</h1>
+      <p>Custom Not Found Page</p>
+    </div>
+  )
+}

tests/fixtures/simple/app/not-found/page.js tests/fixtures/simple/app/route-resolves-to-not-found/page.js

@@ -65,10 +65,10 @@ test<FixtureTestContext>('Test that the simple next app is working', async (ctx)
     '/image/remote-pattern-1',
     '/image/remote-pattern-2',
     '/index',
-    '/not-found',
     '/other',
     '/redirect',
     '/redirect/response',
+    '/route-resolves-to-not-found',
     '404.html',
     '500.html',
   ])
@@ -82,13 +82,13 @@ test<FixtureTestContext>('Test that the simple next app is working', async (ctx)
   expect(other.statusCode).toBe(200)
   expect(load(other.body)('h1').text()).toBe('Other')
 
-  const notFound = await invokeFunction(ctx, { url: 'not-found' })
+  const notFound = await invokeFunction(ctx, { url: 'route-resolves-to-not-found' })
   expect(notFound.statusCode).toBe(404)
   expect(notFound.body).toContain('NEXT_NOT_FOUND')
 
   const notExisting = await invokeFunction(ctx, { url: 'non-exisitng' })
   expect(notExisting.statusCode).toBe(404)
-  expect(load(notExisting.body)('h1').text()).toBe('404')
+  expect(load(notExisting.body)('h1').text()).toBe('404 Not Found')
 })
 
 describe('verification', () => {