Should not show no index for client rendering bailout (#59531)

vercel · Dec 13, 2023 · 572a6bc · 572a6bc
1 parent 0ddc7e8
commit 572a6bc
Show file tree

Hide file tree

Showing 11 changed files with 45 additions and 38 deletions.
diff --git a/packages/next/src/client/on-recoverable-error.ts b/packages/next/src/client/on-recoverable-error.ts
@@ -1,4 +1,4 @@
-import { NEXT_DYNAMIC_NO_SSR_CODE } from '../shared/lib/lazy-dynamic/no-ssr-error'
+import { isBailoutCSRError } from '../shared/lib/lazy-dynamic/no-ssr-error'
 
 export default function onRecoverableError(err: any) {
   // Using default react onRecoverableError
@@ -13,7 +13,7 @@ export default function onRecoverableError(err: any) {
         }
 
   // Skip certain custom errors which are not expected to be reported on client
-  if (err.digest === NEXT_DYNAMIC_NO_SSR_CODE) return
+  if (isBailoutCSRError(err)) return
 
   defaultOnRecoverableError(err)
 }
diff --git a/packages/next/src/export/helpers/is-dynamic-usage-error.ts b/packages/next/src/export/helpers/is-dynamic-usage-error.ts
@@ -1,10 +1,10 @@
 import { DYNAMIC_ERROR_CODE } from '../../client/components/hooks-server-context'
 import { isNotFoundError } from '../../client/components/not-found'
 import { isRedirectError } from '../../client/components/redirect'
-import { NEXT_DYNAMIC_NO_SSR_CODE } from '../../shared/lib/lazy-dynamic/no-ssr-error'
+import { isBailoutCSRError } from '../../shared/lib/lazy-dynamic/no-ssr-error'
 
 export const isDynamicUsageError = (err: any) =>
   err.digest === DYNAMIC_ERROR_CODE ||
   isNotFoundError(err) ||
-  err.digest === NEXT_DYNAMIC_NO_SSR_CODE ||
+  isBailoutCSRError(err) ||
   isRedirectError(err)
diff --git a/packages/next/src/export/routes/pages.ts b/packages/next/src/export/routes/pages.ts
@@ -15,7 +15,7 @@ import {
   NEXT_DATA_SUFFIX,
   SERVER_PROPS_EXPORT_ERROR,
 } from '../../lib/constants'
-import { NEXT_DYNAMIC_NO_SSR_CODE } from '../../shared/lib/lazy-dynamic/no-ssr-error'
+import { isBailoutCSRError } from '../../shared/lib/lazy-dynamic/no-ssr-error'
 import AmpHtmlValidator from 'next/dist/compiled/amphtml-validator'
 import { FileType, fileExists } from '../../lib/file-exists'
 import { lazyRenderPagesPage } from '../../server/future/route-modules/pages/module.render'
@@ -106,7 +106,7 @@ export async function exportPages(
         renderOpts
       )
     } catch (err: any) {
-      if (err.digest !== NEXT_DYNAMIC_NO_SSR_CODE) {
+      if (!isBailoutCSRError(err)) {
         throw err
       }
     }
@@ -164,7 +164,7 @@ export async function exportPages(
           renderOpts
         )
       } catch (err: any) {
-        if (err.digest !== NEXT_DYNAMIC_NO_SSR_CODE) {
+        if (!isBailoutCSRError(err)) {
           throw err
         }
       }

diff --git a/packages/next/src/server/app-render/app-render.tsx b/packages/next/src/server/app-render/app-render.tsx
@@ -66,7 +66,7 @@ import { parseAndValidateFlightRouterState } from './parse-and-validate-flight-r
 import { validateURL } from './validate-url'
 import { createFlightRouterStateFromLoaderTree } from './create-flight-router-state-from-loader-tree'
 import { handleAction } from './action-handler'
-import { NEXT_DYNAMIC_NO_SSR_CODE } from '../../shared/lib/lazy-dynamic/no-ssr-error'
+import { isBailoutCSRError } from '../../shared/lib/lazy-dynamic/no-ssr-error'
 import { warn, error } from '../../build/output/log'
 import { appendMutableCookies } from '../web/spec-extension/adapters/request-cookies'
 import { createServerInsertedHTML } from './server-inserted-html'
@@ -863,7 +863,8 @@ async function renderToHTMLOrFlightImpl(
           throw err
         }
 
-        if (err.digest === NEXT_DYNAMIC_NO_SSR_CODE) {
+        const isBailoutCSR = isBailoutCSRError(err)
+        if (isBailoutCSR) {
           warn(
             `Entire page ${pagePath} deopted into client-side rendering. https://nextjs.org/docs/messages/deopted-into-client-rendering`,
             pagePath
@@ -894,7 +895,7 @@ async function renderToHTMLOrFlightImpl(
         }
 
         const is404 = res.statusCode === 404
-        if (!is404 && !hasRedirectError) {
+        if (!is404 && !hasRedirectError && !isBailoutCSR) {
           res.statusCode = 500
         }
 

diff --git a/packages/next/src/shared/lib/lazy-dynamic/no-ssr-error.ts b/packages/next/src/shared/lib/lazy-dynamic/no-ssr-error.ts
@@ -7,3 +7,7 @@ export function throwWithNoSSR() {
   ;(error as any).digest = NEXT_DYNAMIC_NO_SSR_CODE
   throw error
 }
+
+export function isBailoutCSRError(err: any) {
+  return err?.digest === NEXT_DYNAMIC_NO_SSR_CODE
+}
diff --git a/test/e2e/app-dir/app-static/app-static.test.ts b/test/e2e/app-dir/app-static/app-static.test.ts
@@ -554,15 +554,12 @@ createNextDescribe(
             'blog/styfle/second-post.rsc',
             'force-static/[slug]/page.js',
             'hooks/use-pathname/slug.rsc',
-            'hooks/use-search-params.rsc',
             'route-handler/post/route.js',
             'blog/[author]/[slug]/page.js',
             'blog/styfle/second-post.html',
             'hooks/use-pathname/slug.html',
-            'hooks/use-search-params.html',
             'flight/[slug]/[slug2]/page.js',
             'variable-revalidate/cookie.rsc',
-            'hooks/use-search-params/page.js',
             'ssr-auto/cache-no-store/page.js',
             'variable-revalidate/cookie.html',
             'api/revalidate-tag-edge/route.js',
@@ -675,7 +672,10 @@ createNextDescribe(
             'force-static/[slug]/page_client-reference-manifest.js',
             'blog/[author]/[slug]/page_client-reference-manifest.js',
             'flight/[slug]/[slug2]/page_client-reference-manifest.js',
-            'hooks/use-search-params/page_client-reference-manifest.js',
+            'hooks/use-search-params/static-bailout.html',
+            'hooks/use-search-params/static-bailout.rsc',
+            'hooks/use-search-params/static-bailout/page.js',
+            'hooks/use-search-params/static-bailout/page_client-reference-manifest.js',
             'ssr-auto/cache-no-store/page_client-reference-manifest.js',
             'gen-params-dynamic/[slug]/page_client-reference-manifest.js',
             'hooks/use-pathname/[slug]/page_client-reference-manifest.js',
@@ -994,8 +994,8 @@ createNextDescribe(
               "initialRevalidateSeconds": false,
               "srcRoute": "/hooks/use-pathname/[slug]",
             },
-            "/hooks/use-search-params": {
-              "dataRoute": "/hooks/use-search-params.rsc",
+            "/hooks/use-search-params/force-static": {
+              "dataRoute": "/hooks/use-search-params/force-static.rsc",
               "experimentalBypassFor": [
                 {
                   "key": "Next-Action",
@@ -1008,10 +1008,10 @@ createNextDescribe(
                 },
               ],
               "initialRevalidateSeconds": false,
-              "srcRoute": "/hooks/use-search-params",
+              "srcRoute": "/hooks/use-search-params/force-static",
             },
-            "/hooks/use-search-params/force-static": {
-              "dataRoute": "/hooks/use-search-params/force-static.rsc",
+            "/hooks/use-search-params/static-bailout": {
+              "dataRoute": "/hooks/use-search-params/static-bailout.rsc",
               "experimentalBypassFor": [
                 {
                   "key": "Next-Action",
@@ -1024,7 +1024,7 @@ createNextDescribe(
                 },
               ],
               "initialRevalidateSeconds": false,
-              "srcRoute": "/hooks/use-search-params/force-static",
+              "srcRoute": "/hooks/use-search-params/static-bailout",
             },
             "/hooks/use-search-params/with-suspense": {
               "dataRoute": "/hooks/use-search-params/with-suspense.rsc",
@@ -2866,9 +2866,9 @@ createNextDescribe(
     describe('useSearchParams', () => {
       describe('client', () => {
         it('should bailout to client rendering - without suspense boundary', async () => {
-          const browser = await next.browser(
-            '/hooks/use-search-params?first=value&second=other&third'
-          )
+          const url =
+            '/hooks/use-search-params/static-bailout?first=value&second=other&third'
+          const browser = await next.browser(url)
 
           expect(await browser.elementByCss('#params-first').text()).toBe(
             'value'
@@ -2880,12 +2880,15 @@ createNextDescribe(
           expect(await browser.elementByCss('#params-not-real').text()).toBe(
             'N/A'
           )
+
+          const $ = await next.render$(url)
+          expect($('meta[content=noindex]').length).toBe(0)
         })
 
         it('should bailout to client rendering - with suspense boundary', async () => {
-          const browser = await next.browser(
+          const url =
             '/hooks/use-search-params/with-suspense?first=value&second=other&third'
-          )
+          const browser = await next.browser(url)
 
           expect(await browser.elementByCss('#params-first').text()).toBe(
             'value'
@@ -2897,6 +2900,11 @@ createNextDescribe(
           expect(await browser.elementByCss('#params-not-real').text()).toBe(
             'N/A'
           )
+
+          const $ = await next.render$(url)
+          // dynamic page doesn't have bail out
+          expect($('html#__next_error__').length).toBe(0)
+          expect($('meta[content=noindex]').length).toBe(0)
         })
 
         it.skip('should have empty search params on force-static', async () => {
@@ -2947,7 +2955,9 @@ createNextDescribe(
       if (!isDev) {
         describe('server response', () => {
           it('should bailout to client rendering - without suspense boundary', async () => {
-            const res = await next.fetch('/hooks/use-search-params')
+            const res = await next.fetch(
+              '/hooks/use-search-params/static-bailout'
+            )
             const html = await res.text()
             expect(html).toInclude('<html id="__next_error__">')
           })

diff --git a/...tatic/app/hooks/use-search-params/page.js → .../use-search-params/static-bailout/page.js b/...tatic/app/hooks/use-search-params/page.js → .../use-search-params/static-bailout/page.js
@@ -1,4 +1,4 @@
-import UseSearchParams from './search-params'
+import UseSearchParams from '../search-params'
 
 export default function Page() {
   return (

diff --git a/test/e2e/app-dir/app-static/next.config.js b/test/e2e/app-dir/app-static/next.config.js
@@ -13,7 +13,7 @@ module.exports = {
       afterFiles: [
         {
           source: '/rewritten-use-search-params',
-          destination: '/hooks/use-search-params',
+          destination: '/hooks/use-search-params/static-bailout',
         },
         {
           source: '/rewritten-use-pathname',

diff --git a/test/e2e/app-dir/hooks/app/hooks/use-search-params/server/page.js b/test/e2e/app-dir/hooks/app/hooks/use-search-params/server/page.js
diff --git a/test/e2e/app-dir/hooks/app/layout.js b/test/e2e/app-dir/hooks/app/layout.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-export const revalidate = 0
+export const dynamic = 'force-dynamic'
 
 export default function Layout({ children }) {
   return (

diff --git a/test/e2e/app-dir/hooks/hooks.test.ts b/test/e2e/app-dir/hooks/hooks.test.ts
@@ -85,7 +85,7 @@ createNextDescribe(
         initialRand = $('#rand').text()
       })
 
-      it('should genenerate rand when draft mode enabled', async () => {
+      it('should generate rand when draft mode enabled', async () => {
         const res = await next.fetch('/enable')
         const h = res.headers.get('set-cookie') || ''
         const cookie = h