Update React from 14898b6a9 to c3048aab4 (#64798)

package.json

@@ -199,16 +199,16 @@
     "random-seed": "0.3.0",
     "react": "18.2.0",
     "react-17": "npm:react@17.0.2",
-    "react-builtin": "npm:react@18.3.0-canary-14898b6a9-20240318",
+    "react-builtin": "npm:react@18.3.0-canary-c3048aab4-20240326",
     "react-dom": "18.2.0",
     "react-dom-17": "npm:react-dom@17.0.2",
-    "react-dom-builtin": "npm:react-dom@18.3.0-canary-14898b6a9-20240318",
-    "react-dom-experimental-builtin": "npm:react-dom@0.0.0-experimental-14898b6a9-20240318",
-    "react-experimental-builtin": "npm:react@0.0.0-experimental-14898b6a9-20240318",
-    "react-server-dom-turbopack": "18.3.0-canary-14898b6a9-20240318",
-    "react-server-dom-turbopack-experimental": "npm:react-server-dom-turbopack@0.0.0-experimental-14898b6a9-20240318",
-    "react-server-dom-webpack": "18.3.0-canary-14898b6a9-20240318",
-    "react-server-dom-webpack-experimental": "npm:react-server-dom-webpack@0.0.0-experimental-14898b6a9-20240318",
+    "react-dom-builtin": "npm:react-dom@18.3.0-canary-c3048aab4-20240326",
+    "react-dom-experimental-builtin": "npm:react-dom@0.0.0-experimental-c3048aab4-20240326",
+    "react-experimental-builtin": "npm:react@0.0.0-experimental-c3048aab4-20240326",
+    "react-server-dom-turbopack": "18.3.0-canary-c3048aab4-20240326",
+    "react-server-dom-turbopack-experimental": "npm:react-server-dom-turbopack@0.0.0-experimental-c3048aab4-20240326",
+    "react-server-dom-webpack": "18.3.0-canary-c3048aab4-20240326",
+    "react-server-dom-webpack-experimental": "npm:react-server-dom-webpack@0.0.0-experimental-c3048aab4-20240326",
     "react-ssr-prepass": "1.0.8",
     "react-virtualized": "9.22.3",
     "relay-compiler": "13.0.2",
@@ -218,8 +218,8 @@
     "resolve-from": "5.0.0",
     "sass": "1.54.0",
     "satori": "0.10.9",
-    "scheduler-builtin": "npm:scheduler@0.24.0-canary-14898b6a9-20240318",
-    "scheduler-experimental-builtin": "npm:scheduler@0.0.0-experimental-14898b6a9-20240318",
+    "scheduler-builtin": "npm:scheduler@0.24.0-canary-c3048aab4-20240326",
+    "scheduler-experimental-builtin": "npm:scheduler@0.0.0-experimental-c3048aab4-20240326",
     "seedrandom": "3.0.5",
     "selenium-webdriver": "4.0.0-beta.4",
     "semver": "7.3.7",

packages/next/src/build/create-compiler-aliases.ts

@@ -259,9 +259,9 @@ export function createRSCAliases(
     'react-dom/static$': `next/dist/compiled/react-dom-experimental/static`,
     'react-dom/static.edge$': `next/dist/compiled/react-dom-experimental/static.edge`,
     'react-dom/static.browser$': `next/dist/compiled/react-dom-experimental/static.browser`,
-    // optimizations to ignore the legacy build of react-dom/server in `server.browser` build
-    'react-dom/server.edge$': `next/dist/build/webpack/alias/react-dom-server-edge${bundledReactChannel}.js`,
-    'react-dom/server.browser$': `next/dist/build/webpack/alias/react-dom-server-browser${bundledReactChannel}.js`,
+    // TODO: restore optimizations to ignore the legacy build of react-dom/server in `server.browser` build
+    'react-dom/server.edge$': `next/dist/compiled/react-dom${bundledReactChannel}/server.edge`,
+    'react-dom/server.browser$': `next/dist/compiled/react-dom${bundledReactChannel}/server.browser`,
     // react-server-dom-webpack alias
     'react-server-dom-webpack/client$': `next/dist/compiled/react-server-dom-webpack${bundledReactChannel}/client`,
     'react-server-dom-webpack/client.edge$': `next/dist/compiled/react-server-dom-webpack${bundledReactChannel}/client.edge`,

packages/next/src/client/app-index.tsx

@@ -19,7 +19,12 @@ import { HMR_ACTIONS_SENT_TO_BROWSER } from '../server/dev/hot-reloader-types'
 // Since React doesn't call onerror for errors caught in error boundaries.
 const origConsoleError = window.console.error
 window.console.error = (...args) => {
-  if (isNextRouterError(args[0])) {
+  // See https://github.com/facebook/react/blob/d50323eb845c5fde0d720cae888bf35dedd05506/packages/react-reconciler/src/ReactFiberErrorLogger.js#L78
+  if (
+    process.env.NODE_ENV !== 'production'
+      ? isNextRouterError(args[1])
+      : isNextRouterError(args[0])
+  ) {
     return
   }
   origConsoleError.apply(window.console, args)

packages/next/src/client/components/react-dev-overlay/internal/helpers/use-error-handler.ts

@@ -19,16 +19,11 @@ const errorHandlers: Array<ErrorHandler> = []
 const rejectionHandlers: Array<ErrorHandler> = []
 
 if (typeof window !== 'undefined') {
-  // These event handlers must be added outside of the hook because there is no
-  // guarantee that the hook will be alive in a mounted component in time to
-  // when the errors occur.
-  window.addEventListener('error', (ev: WindowEventMap['error']): void => {
-    if (isNextRouterError(ev.error)) {
-      ev.preventDefault()
-      return
+  function handleError(error: unknown) {
+    if (isNextRouterError(error)) {
+      return false
     }
 
-    const error = ev?.error
     if (
       !error ||
       !(error instanceof Error) ||
@@ -60,18 +55,39 @@ if (typeof window !== 'undefined') {
         '\nSee more info here: https://nextjs.org/docs/messages/react-hydration-error'
     }
 
-    const e = error
     // Only queue one hydration every time
     if (isCausedByHydrationFailure) {
       if (!hasHydrationError) {
-        errorQueue.push(e)
+        errorQueue.push(error)
       }
       hasHydrationError = true
     }
     for (const handler of errorHandlers) {
-      handler(e)
+      handler(error)
+    }
+  }
+  // These event handlers must be added outside of the hook because there is no
+  // guarantee that the hook will be alive in a mounted component in time to
+  // when the errors occur.
+  // uncaught errors go through reportError
+  window.addEventListener(
+    'error',
+    (event: WindowEventMap['error']): void | boolean => {
+      if (handleError(event.error) === false) {
+        event.preventDefault()
+        return false
+      }
+    }
+  )
+  // caught errors go through console.error
+  const origConsoleError = window.console.error
+  window.console.error = (...args) => {
+    // See https://github.com/facebook/react/blob/d50323eb845c5fde0d720cae888bf35dedd05506/packages/react-reconciler/src/ReactFiberErrorLogger.js#L78
+    const error = process.env.NODE_ENV !== 'production' ? args[1] : args[0]
+    if (handleError(error) !== false) {
+      origConsoleError.apply(window.console, args)
     }
-  })
+  }
   window.addEventListener(
     'unhandledrejection',
     (ev: WindowEventMap['unhandledrejection']): void => {