error

packages/next/build/webpack/loaders/next-middleware-ssr-loader/index.ts

@@ -162,7 +162,7 @@ export default async function middlewareRSCLoader(this: any) {
           const transformStream = new TransformStream()
           const writer = transformStream.writable.getWriter()
           const encoder = new TextEncoder()
-
+          
           try {
             const result = await renderToHTML(
               { url: pathname },
@@ -175,6 +175,7 @@ export default async function middlewareRSCLoader(this: any) {
               write: str => writer.write(encoder.encode(str)),
               end: () => writer.close()
             })
+            .catch(() => writer.close())
           } catch (err) {
             return new Response(
               (err || 'An error occurred while rendering ' + pathname + '.').toString(),

packages/next/server/render.tsx

@@ -1450,19 +1450,24 @@ function renderToReadableStream(
     const reader = readable.getReader()
     const decoder = new TextDecoder()
     const process = () => {
-      reader.read().then(({ done, value }: any) => {
-        if (!done) {
-          const s = typeof value === 'string' ? value : decoder.decode(value)
-          if (shellCompleted) {
-            res.write(s)
+      reader.read().then(
+        ({ done, value }: any) => {
+          if (!done) {
+            const s = typeof value === 'string' ? value : decoder.decode(value)
+            if (shellCompleted) {
+              res.write(s)
+            } else {
+              bufferedString += s
+            }
+            process()
           } else {
-            bufferedString += s
+            next()
           }
-          process()
-        } else {
-          next()
+        },
+        (err: any) => {
+          next(err)
         }
-      })
+      )
     }
     process()
   }

test/integration/react-streaming-and-server-components/app/pages/500.js

@@ -0,0 +1,3 @@
+export default function Page500() {
+  return 'custom-500-page'
+}

test/integration/react-streaming-and-server-components/app/pages/err/render.js

@@ -0,0 +1,7 @@
+let did = false
+export default function Error() {
+  if (!did && typeof window === 'undefined') {
+    did = true
+    throw new Error('oops')
+  }
+}

test/integration/react-streaming-and-server-components/app/pages/err/suspense.js

@@ -0,0 +1,20 @@
+import { Suspense } from 'react'
+
+let did = false
+function Error() {
+  if (!did && typeof window === 'undefined') {
+    did = true
+    throw new Error('broken page')
+  }
+}
+
+export default function page() {
+  return (
+    <>
+      <h1>Hey Error</h1>
+      <Suspense>
+        <Error />
+      </Suspense>
+    </>
+  )
+}