diff --git a/packages/next/build/entries.ts b/packages/next/build/entries.ts index a4b97bc00bd45..42492d511d853 100644 --- a/packages/next/build/entries.ts +++ b/packages/next/build/entries.ts @@ -162,7 +162,7 @@ export function createEntrypoints( page, absoluteAppPath: pages['/_app'], absoluteDocumentPath: pages['/_document'], - absoluteErrorPath: pages['/_error'], + absoluteErrorPath: pages['/500'] || pages['/_error'], absolutePagePath, isServerComponent: isFlight, buildId, diff --git a/packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts b/packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts index bf2fd5bfe8b68..096a4c06eac9b 100644 --- a/packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts +++ b/packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts @@ -16,7 +16,6 @@ export default async function middlewareRSCLoader(this: any) { const stringifiedAbsolutePagePath = stringifyRequest(this, absolutePagePath) const stringifiedAbsoluteAppPath = stringifyRequest(this, absoluteAppPath) const stringifiedAbsoluteErrorPath = stringifyRequest(this, absoluteErrorPath) - const stringified500PagePath = stringifyRequest(this, './pages/500') const stringifiedAbsoluteDocumentPath = stringifyRequest( this, absoluteDocumentPath @@ -29,13 +28,7 @@ export default async function middlewareRSCLoader(this: any) { import App from ${stringifiedAbsoluteAppPath} import Document from ${stringifiedAbsoluteDocumentPath} - - let ErrorPage - try { - ErrorPage = require(${stringified500PagePath}).default - } catch (_) { - ErrorPage = require(${stringifiedAbsoluteErrorPath}).default - } + const errorMod = require(${stringifiedAbsoluteErrorPath}) const { default: Page, @@ -125,9 +118,15 @@ export default async function middlewareRSCLoader(this: any) { result = await renderToHTML( req, errorRes, - pathname, + '/_error', query, - { ...renderOpts, Component: ErrorPage } + { + ...renderOpts, + Component: errorMod.default, + getStaticProps: errorMod.getStaticProps, + getServerSideProps: errorMod.getServerSideProps, + getStaticPaths: errorMod.getStaticPaths, + } ) } catch (err) { return new Response( diff --git a/test/integration/react-streaming-and-server-components/test/index.test.js b/test/integration/react-streaming-and-server-components/test/index.test.js index 371953a331b90..423378710db53 100644 --- a/test/integration/react-streaming-and-server-components/test/index.test.js +++ b/test/integration/react-streaming-and-server-components/test/index.test.js @@ -157,7 +157,7 @@ describe('concurrentFeatures - prod', () => { expect(html).toContain('foo.client') }) - runBasicTests(context) + runBasicTests(context, 'prod') }) describe('concurrentFeatures - dev', () => { @@ -182,7 +182,7 @@ describe('concurrentFeatures - dev', () => { expect(content).toMatchInlineSnapshot('"foo.client"') }) - runBasicTests(context) + runBasicTests(context, 'dev') }) const cssSuite = { @@ -213,7 +213,8 @@ const documentSuite = { runSuite('document', 'dev', documentSuite) runSuite('document', 'prod', documentSuite) -async function runBasicTests(context) { +async function runBasicTests(context, env) { + const isDev = env === 'dev' it('should render the correct html', async () => { const homeHTML = await renderViaHTTP(context.appPort, '/') @@ -242,7 +243,10 @@ async function runBasicTests(context) { expect(dynamicRouteHTML2).toContain('[pid]') expect(path404HTML).toContain('custom-404-page') - expect(path500HTML).toContain('custom-500-page') + // in dev mode: custom error page is still using default _error + expect(path500HTML).toContain( + isDev ? 'Internal Server Error' : 'custom-500-page' + ) expect(pathNotFoundHTML).toContain('custom-404-page') }) @@ -330,6 +334,6 @@ function runSuite(suiteName, env, { runTests, before, after }) { await killApp(context.server) }) - runTests(context) + runTests(context, env) }) }