keep _app.server and not log if not customized

vercel · Mar 29, 2022 · b3290c3 · b3290c3
1 parent 635fa20
commit b3290c3
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 20 deletions.
diff --git a/packages/next/build/entries.ts b/packages/next/build/entries.ts
@@ -98,14 +98,15 @@ export function createPagesMapping(
     pages['/_error'] = `${PAGES_DIR_ALIAS}/_error`
     pages['/_document'] = `${PAGES_DIR_ALIAS}/_document`
     if (hasServerComponents) {
-      pages['/_app.server'] = `${PAGES_DIR_ALIAS}/_app.server` || pages['/_app']
+      pages['/_app.server'] = `${PAGES_DIR_ALIAS}/_app.server`
     }
   } else {
     pages['/_app'] = pages['/_app'] || 'next/dist/pages/_app'
     pages['/_error'] = pages['/_error'] || 'next/dist/pages/_error'
-    pages['/_document'] = pages['/_document'] || `next/dist/pages/_document`
+    pages['/_document'] = pages['/_document'] || 'next/dist/pages/_document'
     if (hasServerComponents) {
-      pages['/_app.server'] = pages['/_app.server'] || pages['/_app'] // 'next/dist/pages/_app.server'
+      pages['/_app.server'] =
+        pages['/_app.server'] || 'next/dist/pages/_app.server'
     }
   }
   return pages

diff --git a/packages/next/build/utils.ts b/packages/next/build/utils.ts
@@ -144,6 +144,11 @@ export async function printTreeView(
   ]
 
   const hasCustomApp = await findPageFile(pagesDir, '/_app', pageExtensions)
+  const hasCustomAppServer = await findPageFile(
+    pagesDir,
+    '/_app.server',
+    pageExtensions
+  )
 
   pageInfos.set('/404', {
     ...(pageInfos.get('/404') || pageInfos.get('/_error')),
@@ -170,8 +175,8 @@ export async function printTreeView(
         !(
           e === '/_document' ||
           e === '/_error' ||
-          e === '/_app.server' ||
-          (!hasCustomApp && e === '/_app')
+          (!hasCustomApp && e === '/_app') ||
+          (!hasCustomAppServer && e === '/_app.server')
         )
     )
     .sort((a, b) => a.localeCompare(b))

diff --git a/packages/next/pages/_app.server.tsx b/packages/next/pages/_app.server.tsx
@@ -0,0 +1,3 @@
+export default function AppServer({ children }: { children: React.ReactNode }) {
+  return children
+}
diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx
@@ -195,9 +195,10 @@ function enhanceComponents(
 }
 
 function renderFlight(AppMod: any, ComponentMod: any, props: any) {
+  const isServerComponent = !!ComponentMod.__next_rsc__
   const App = interopDefault(AppMod)
   const Component = interopDefault(ComponentMod)
-  const AppServer = !!ComponentMod.__next_rsc__
+  const AppServer = isServerComponent
     ? (App as React.ComponentType)
     : React.Fragment
 

diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js
@@ -1829,6 +1829,13 @@ export async function pages_app(task, opts) {
     .target('dist/pages')
 }
 
+export async function pages_app_server(task, opts) {
+  await task
+    .source('pages/_app.server.tsx')
+    .swc('client', { dev: opts.dev, keepImportAssertions: true })
+    .target('dist/pages')
+}
+
 export async function pages_error(task, opts) {
   await task
     .source('pages/_error.tsx')
@@ -1843,16 +1850,9 @@ export async function pages_document(task, opts) {
     .target('dist/pages')
 }
 
-export async function pages_document_server(task, opts) {
-  await task
-    .source('pages/_document-concurrent.tsx')
-    .swc('client', { dev: opts.dev, keepImportAssertions: true })
-    .target('dist/pages')
-}
-
 export async function pages(task, opts) {
   await task.parallel(
-    ['pages_app', 'pages_error', 'pages_document', 'pages_document_server'],
+    ['pages_app', 'pages_error', 'pages_document', 'pages_app_server'],
     opts
   )
 }

diff --git a/...integration/react-streaming-and-server-components/switchable-runtime/pages/_app.server.js b/...integration/react-streaming-and-server-components/switchable-runtime/pages/_app.server.js
@@ -1,6 +1,7 @@
 export default function AppServer({ children }) {
   return (
-    <div className="app-server-component" style={{ border: '2px solid blue' }}>
+    <div className="app-server-root">
+      <style>{`.app-server-root { border: 2px solid blue; }`}</style>
       {children}
     </div>
   )

diff --git a/test/integration/react-streaming-and-server-components/test/switchable-runtime.test.js b/test/integration/react-streaming-and-server-components/test/switchable-runtime.test.js
@@ -13,7 +13,7 @@ function splitLines(text) {
     .filter(Boolean)
 }
 
-async function testRoute(appPort, url, { isStatic, isEdge }) {
+async function testRoute(appPort, url, { isStatic, isEdge, isRSC }) {
   const html1 = await renderViaHTTP(appPort, url)
   const renderedAt1 = +html1.match(/Time: (\d+)/)[1]
   expect(html1).toContain(`Runtime: ${isEdge ? 'Edge' : 'Node.js'}`)
@@ -29,6 +29,12 @@ async function testRoute(appPort, url, { isStatic, isEdge }) {
     // Should be re-rendered.
     expect(renderedAt1).toBeLessThan(renderedAt2)
   }
+  const customAppServerHtml = '<div class="app-server-root">'
+  if (isRSC) {
+    expect(html1).toContain(customAppServerHtml)
+  } else {
+    expect(html1).not.toContain(customAppServerHtml)
+  }
 }
 
 describe('Without global runtime configuration', () => {
@@ -49,62 +55,71 @@ describe('Without global runtime configuration', () => {
     await testRoute(context.appPort, '/static', {
       isStatic: true,
       isEdge: false,
+      isRSC: false,
     })
   })
 
   it('should build /node as a static page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node', {
       isStatic: true,
       isEdge: false,
+      isRSC: false,
     })
   })
 
   it('should build /node-ssr as a dynamic page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node-ssr', {
       isStatic: false,
       isEdge: false,
+      isRSC: false,
     })
   })
 
   it('should build /node-ssg as a static page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node-ssg', {
       isStatic: true,
       isEdge: false,
+      isRSC: false,
     })
   })
 
   it('should build /node-rsc as a static page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node-rsc', {
       isStatic: true,
       isEdge: false,
+      isRSC: true,
     })
   })
 
   it('should build /node-rsc-ssr as a dynamic page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node-rsc-ssr', {
       isStatic: false,
       isEdge: false,
+      isRSC: true,
     })
   })
 
   it('should build /node-rsc-ssg as a static page with the nodejs runtime', async () => {
     await testRoute(context.appPort, '/node-rsc-ssg', {
       isStatic: true,
       isEdge: false,
+      isRSC: true,
     })
   })
 
   it('should build /edge as a dynamic page with the edge runtime', async () => {
     await testRoute(context.appPort, '/edge', {
       isStatic: false,
       isEdge: true,
+      isRSC: false,
     })
   })
 
   it('should build /edge-rsc as a dynamic page with the edge runtime', async () => {
     await testRoute(context.appPort, '/edge-rsc', {
       isStatic: false,
       isEdge: true,
+      isRSC: true,
     })
   })
 
@@ -113,7 +128,9 @@ describe('Without global runtime configuration', () => {
       /^[┌├└/]/.test(line)
     )
     const expectedOutputLines = splitLines(`
-  ┌ λ /404
+  ┌   /_app
+  ├ λ /_app.server
+  ├ λ /404
   ├ ℇ /edge
   ├ ℇ /edge-rsc
   ├ ○ /node
@@ -124,9 +141,11 @@ describe('Without global runtime configuration', () => {
   ├ λ /node-ssr
   └ ○ /static
   `)
-    const isMatched = expectedOutputLines.every((line, index) =>
-      stdoutLines[index].startsWith(line)
-    )
+    const isMatched = expectedOutputLines.every((line, index) => {
+      const matched = stdoutLines[index].startsWith(line)
+      return matched
+    })
+
     expect(isMatched).toBe(true)
   })
 })