[Error Overlay] Comprehensive refinement #75471

raunofreiberg · 2025-01-30T08:55:08Z

This PR adds a lot of polish to the experimental Error Overlay:

CleanShot.2025-01-30.at.13.12.34.mp4

Motion

Stacked layers transition smoothly when switching between errors
Height transition for the dialog panel to complement the stacked layers transition
Dialog contents and the backdrop fade in as per Geist Motion Guidelines (scale, opacity)

Design

New language icon based on file extension à la (app.tsx)
Shadows are clipped with translucent borders to visually be more crisp
Use backdrop-filter: blur() for backdrop to blend with application content
Use font-variant-numeric: tabular-nums for ←→ switcher to avoid layout shift
Misc alignment improvements

Interactions

Focus is now trapped in the dialog, Escape will un-trap and re-focus the last root.activeElement
Focus states for all interactive elements
Fluid reveal & collapse of ignored Call Stack items ↓

CleanShot.2025-01-30.at.21.37.30-converted.mp4

Closes NDX-711
Closes NDX-744

…rlay-polish

ijjk · 2025-01-30T11:20:39Z

Failing test suites

Commit: 8f833ec

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/development/app-dir/dynamic-error-trace/index.test.ts (PPR)

app dir - dynamic error trace > should show the error trace

Expand output

● app dir - dynamic error trace › should show the error trace

expect(received).toEqual(expected) // deep equality

- Expected  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/lib.js (4:13) @ Foo
-
    2 |
    3 | export function Foo() {
  > 4 |   useHeaders()
      |             ^
    5 |   return 'foo'

  42 |
  43 |     const codeframe = await getRedboxSource(browser)
> 44 |     expect(codeframe).toEqual(
     |                       ^
  45 |       outdent`
  46 |             app/lib.js (4:13) @ Foo
  47 |

  at Object.toEqual (development/app-dir/dynamic-error-trace/index.test.ts:44:23)

● app dir - dynamic error trace › should show the error trace

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app dir - dynamic error trace should show the error trace 1`

- Snapshot  - 0
+ Received  + 4

  Foo
  app/lib.js
+ resolveErrorDevnode_modules/.pnpm/file+..+next-repo-4fa9098264a1392a77a86cff7af777ae992b8f371e7a48eb3fe5a74853312218+packages+n_iosbgn2wsr6zbh2mfqxs7oyndy/node_modules/next/dist/compiled/react-server-dom-webpack-experimental/cjs/react-server-dom-webpack-client.browser.development.js
+ processFullStringRownode_modules/.pnpm/file+..+next-repo-4fa9098264a1392a77a86cff7af777ae992b8f371e7a48eb3fe5a74853312218+packages+n_iosbgn2wsr6zbh2mfqxs7oyndy/node_modules/next/dist/compiled/react-server-dom-webpack-experimental/cjs/react-server-dom-webpack-client.browser.development.js
+ processFullBinaryRownode_modules/.pnpm/file+..+next-repo-4fa9098264a1392a77a86cff7af777ae992b8f371e7a48eb3fe5a74853312218+packages+n_iosbgn2wsr6zbh2mfqxs7oyndy/node_modules/next/dist/compiled/react-server-dom-webpack-experimental/cjs/react-server-dom-webpack-client.browser.development.js
+ progressnode_modules/.pnpm/file+..+next-repo-4fa9098264a1392a77a86cff7af777ae992b8f371e7a48eb3fe5a74853312218+packages+n_iosbgn2wsr6zbh2mfqxs7oyndy/node_modules/next/dist/compiled/react-server-dom-webpack-experimental/cjs/react-server-dom-webpack-client.browser.development.js

  36 |     // TODO: Show useful stack
  37 |     const normalizedStack = normalizeStackTrace(stackFramesContent)
> 38 |     expect(normalizedStack).toMatchInlineSnapshot(`
     |                             ^
  39 |      "Foo
  40 |      app/lib.js"
  41 |     `)

  at Object.toMatchInlineSnapshot (development/app-dir/dynamic-error-trace/index.test.ts:38:29)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/development/app-dir/hook-function-names/hook-function-names.test.ts (PPR)

hook-function-names > should show readable hook names in stacks
hook-function-names > should show readable hook names in stacks for default-exported components

Expand output

● hook-function-names › should show readable hook names in stacks

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hook-function-names should show readable hook names in stacks 1`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/button/page.tsx (7:11) @ Button.useCallback[handleClick]
-
     5 | const Button = ({ message }: { message: string }) => {
     6 |   const handleClick = useCallback(() => {
  >  7 |     throw new Error(message)
       |           ^
     8 |   }, [message])

  27 |       `)
  28 |     } else {
> 29 |       expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
     |                                              ^
  30 |             "app/button/page.tsx (7:11) @ Button.useCallback[handleClick]
  31 |
  32 |                5 | const Button = ({ message }: { message: string }) => {

  at Object.toMatchInlineSnapshot (development/app-dir/hook-function-names/hook-function-names.test.ts:29:46)

● hook-function-names › should show readable hook names in stacks for default-exported components

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hook-function-names should show readable hook names in stacks for default-exported components 1`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/page.tsx (7:11) @ Page.useEffect
-
     5 | export default function Page() {
     6 |   useEffect(() => {
  >  7 |     throw new Error('error in useEffect')
       |           ^
     8 |   }, [])

  59 |       `)
  60 |     } else {
> 61 |       expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
     |                                              ^
  62 |               "app/page.tsx (7:11) @ Page.useEffect
  63 |
  64 |                  5 | export default function Page() {

  at Object.toMatchInlineSnapshot (development/app-dir/hook-function-names/hook-function-names.test.ts:61:46)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts (PPR)

app-dir - owner-stack-invalid-element-type > should catch invalid element from a browser only component
app-dir - owner-stack-invalid-element-type > should catch invalid element from a rsc component
app-dir - owner-stack-invalid-element-type > should catch invalid element from on ssr client component

Expand output

● app-dir - owner-stack-invalid-element-type › should catch invalid element from a browser only component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from a browser only component 1`

- Snapshot  -  0
+ Received  + 15

  at BrowserOnly (app/browser/browser-only.js (8:8))
  at Inner (app/browser/page.js (11:11))
  at Page (app/browser/page.js (15:11))
+ at createFiberFromTypeAndProps (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14544:1))
+ at createFiberFromElement (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14558:1))
+ at reconcileChildFibersImpl (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7737:1))
+ at eval (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7927:1))
+ at reconcileChildren (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8396:1))
+ at beginWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (10586:1))
+ at runWithFiberInDEV (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at performUnitOfWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16755:1))
+ at workLoopSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16587:39))
+ at renderRootSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16568:1))
+ at performWorkOnRoot (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (15928:1))
+ at performWorkOnRootViaSchedulerTask (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (17963:1))
+ at MessagePort.performWorkUntilDeadline (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/scheduler-experimental/cjs/scheduler.development.js (36:1))
+ at LoadableComponent (../src/shared/lib/lazy-dynamic/loadable.tsx (65:10))
+ at ClientPageRoot (../src/client/components/client-page.tsx (60:13))

  43 |         `)
  44 |       } else {
> 45 |         expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                    ^
  46 |          "at BrowserOnly (app/browser/browser-only.js (8:8))
  47 |          at Inner (app/browser/page.js (11:11))
  48 |          at Page (app/browser/page.js (15:11))"

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:45:36)

● app-dir - owner-stack-invalid-element-type › should catch invalid element from a browser only component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from a browser only component 2`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/browser/browser-only.js (8:8) @ BrowserOnly
-
     6 |   return (
     7 |     <div>
  >  8 |       <Foo />
       |        ^
     9 |     </div>

  48 |          at Page (app/browser/page.js (15:11))"
  49 |         `)
> 50 |         expect(source).toMatchInlineSnapshot(`
     |                        ^
  51 |          "app/browser/browser-only.js (8:8) @ BrowserOnly
  52 |
  53 |             6 |   return (

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:50:24)

● app-dir - owner-stack-invalid-element-type › should catch invalid element from a rsc component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from a rsc component 1`

- Snapshot  -  0
+ Received  + 16

  at Inner (app/rsc/page.js (5:11))
  at Page (app/rsc/page.js (11:8))
+ at createFiberFromTypeAndProps (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14544:1))
+ at createFiberFromElement (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14558:1))
+ at reconcileChildFibersImpl (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7737:1))
+ at eval (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7927:1))
+ at reconcileChildren (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8396:1))
+ at beginWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (10586:1))
+ at runWithFiberInDEV (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at performUnitOfWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16755:1))
+ at workLoopSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16587:39))
+ at renderRootSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16568:1))
+ at performWorkOnRoot (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (15928:1))
+ at performWorkOnRootViaSchedulerTask (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (17963:1))
+ at MessagePort.performWorkUntilDeadline (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/scheduler-experimental/cjs/scheduler.development.js (36:1))
+ at Router (../src/client/components/app-router.tsx (633:8))
+ at AppRouter (../src/client/components/app-router.tsx (679:8))
+ at ServerRoot (../src/client/app-index.tsx (200:6))

  86 |         `)
  87 |       } else {
> 88 |         expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                    ^
  89 |          "at Inner (app/rsc/page.js (5:11))
  90 |          at Page (app/rsc/page.js (11:8))"
  91 |         `)

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:88:36)

● app-dir - owner-stack-invalid-element-type › should catch invalid element from a rsc component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from a rsc component 2`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/rsc/page.js (5:11) @ Inner
-
    3 | // Intermediate component for testing owner stack
    4 | function Inner() {
  > 5 |   return <Foo />
      |           ^
    6 | }

  90 |          at Page (app/rsc/page.js (11:8))"
  91 |         `)
> 92 |         expect(source).toMatchInlineSnapshot(`
     |                        ^
  93 |          "app/rsc/page.js (5:11) @ Inner
  94 |
  95 |            3 | // Intermediate component for testing owner stack

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:92:24)

● app-dir - owner-stack-invalid-element-type › should catch invalid element from on ssr client component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from on ssr client component 1`

- Snapshot  -  0
+ Received  + 18

  at Inner (app/ssr/page.js (7:11))
  at Page (app/ssr/page.js (13:8))
+ at createFiberFromTypeAndProps (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14544:1))
+ at createFiberFromElement (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (14558:1))
+ at reconcileChildFibersImpl (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7737:1))
+ at eval (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7927:1))
+ at reconcileChildren (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8396:1))
+ at updateFunctionComponent (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8689:1))
+ at beginWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (10325:1))
+ at runWithFiberInDEV (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at performUnitOfWork (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16755:1))
+ at workLoopSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16587:39))
+ at renderRootSync (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16568:1))
+ at performWorkOnRoot (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (15928:1))
+ at performWorkOnRootViaSchedulerTask (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (17963:1))
+ at MessagePort.performWorkUntilDeadline (node_modules/.pnpm/file+..+next-repo-48ab8926cedc3cdc846e90dd56150bfc2d5b02313c5f7d8a7e56f889947ac02e+packages+n_5d42je6o6n2akongctnyrowsry/node_modules/next/dist/compiled/scheduler-experimental/cjs/scheduler.development.js (36:1))
+ at ClientPageRoot (../src/client/components/client-page.tsx (60:13))
+ at Router (../src/client/components/app-router.tsx (633:8))
+ at AppRouter (../src/client/components/app-router.tsx (679:8))
+ at ServerRoot (../src/client/app-index.tsx (200:6))

  128 |         `)
  129 |       } else {
> 130 |         expect(stackFramesContent).toMatchInlineSnapshot(`
      |                                    ^
  131 |          "at Inner (app/ssr/page.js (7:11))
  132 |          at Page (app/ssr/page.js (13:8))"
  133 |         `)

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:130:36)

● app-dir - owner-stack-invalid-element-type › should catch invalid element from on ssr client component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-invalid-element-type should catch invalid element from on ssr client component 2`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/ssr/page.js (7:11) @ Inner
-
     5 | // Intermediate component for testing owner stack
     6 | function Inner() {
  >  7 |   return <Foo />
       |           ^
     8 | }

  132 |          at Page (app/ssr/page.js (13:8))"
  133 |         `)
> 134 |         expect(source).toMatchInlineSnapshot(`
      |                        ^
  135 |          "app/ssr/page.js (7:11) @ Inner
  136 |
  137 |             5 | // Intermediate component for testing owner stack

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-invalid-element-type/owner-stack-invalid-element-type.test.ts:134:24)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/development/app-dir/ssr-only-error/ssr-only-error.test.ts (PPR)

ssr-only-error > should show ssr only error in error overlay

Expand output

● ssr-only-error › should show ssr only error in error overlay

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `ssr-only-error should show ssr only error in error overlay 1`

- Snapshot  - 1
+ Received  + 0

@@ -1,9 +1,8 @@
  {
    "description": "Error: SSR only error",
    "source": "app/page.tsx (5:11) @ Page
-
    3 | export default function Page() {
    4 |   if (typeof window === 'undefined') {
  > 5 |     throw new Error('SSR only error')
      |           ^
    6 |   }

  26 |       description,
  27 |       source,
> 28 |     }).toMatchInlineSnapshot(`
     |        ^
  29 |      {
  30 |        "description": "Error: SSR only error",
  31 |        "source": "app/page.tsx (5:11) @ Page

  at Object.toMatchInlineSnapshot (development/app-dir/ssr-only-error/ssr-only-error.test.ts:28:8)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts (PPR)

app-dir - owner-stack-react-missing-key-prop > should catch invalid element from on rsc component
app-dir - owner-stack-react-missing-key-prop > should catch invalid element from on ssr client component

Expand output

● app-dir - owner-stack-react-missing-key-prop › should catch invalid element from on rsc component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-react-missing-key-prop should catch invalid element from on rsc component 1`

- Snapshot  -  1
+ Received  + 23

- at span ()
+ at span (<anonymous> (0:0))
  at eval (app/rsc/page.tsx (7:10))
  at Page (app/rsc/page.tsx (6:13))
+ at createUnhandledError (../src/client/components/errors/console-error.ts (14:35))
+ at handleClientError (../src/client/components/errors/use-error-handler.ts (30:34))
+ at console.error (../src/client/components/globals/intercept-console-error.ts (32:11))
+ at eval (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (26064:1))
+ at runWithFiberInDEV (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at warnForMissingKey (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (26063:1))
+ at warnOnInvalidKey (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7377:1))
+ at reconcileChildrenArray (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7458:1))
+ at reconcileChildFibersImpl (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7810:1))
+ at eval (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7927:1))
+ at reconcileChildren (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8396:1))
+ at beginWork (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (10586:1))
+ at runWithFiberInDEV (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at performUnitOfWork (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16755:1))
+ at workLoopConcurrentByScheduler (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16749:1))
+ at renderRootConcurrent (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16731:1))
+ at performWorkOnRoot (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (15871:1))
+ at performWorkOnRootViaSchedulerTask (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (17963:1))
+ at MessagePort.performWorkUntilDeadline (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/scheduler-experimental/cjs/scheduler.development.js (36:1))
+ at Router (../src/client/components/app-router.tsx (633:8))
+ at AppRouter (../src/client/components/app-router.tsx (679:8))
+ at ServerRoot (../src/client/app-index.tsx (200:6))

  41 |               `)
  42 |       } else {
> 43 |         expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                    ^
  44 |          "at span ()
  45 |          at eval (app/rsc/page.tsx (7:10))
  46 |          at Page (app/rsc/page.tsx (6:13))"

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts:43:36)

● app-dir - owner-stack-react-missing-key-prop › should catch invalid element from on rsc component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-react-missing-key-prop should catch invalid element from on rsc component 2`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/rsc/page.tsx (7:10) @ eval
-
     5 |     <div>
     6 |       {list.map((item, index) => (
  >  7 |         <span>{item}</span>
       |          ^
     8 |       ))}

  46 |          at Page (app/rsc/page.tsx (6:13))"
  47 |         `)
> 48 |         expect(source).toMatchInlineSnapshot(`
     |                        ^
  49 |           "app/rsc/page.tsx (7:10) @ eval
  50 |
  51 |              5 |     <div>

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts:48:24)

● app-dir - owner-stack-react-missing-key-prop › should catch invalid element from on ssr client component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-react-missing-key-prop should catch invalid element from on ssr client component 1`

- Snapshot  -  3
+ Received  + 26

- at p ()
+ at p (<anonymous> (0:0))
  at eval (app/ssr/page.tsx (9:10))
- at Array.map ()
- at Page (app/ssr/page.tsx (8:13))
+ at Array.map (<anonymous> (0:0))
+ at Page (app/ssr/page.tsx (8:13))
+ at createUnhandledError (../src/client/components/errors/console-error.ts (14:35))
+ at handleClientError (../src/client/components/errors/use-error-handler.ts (30:34))
+ at console.error (../src/client/components/globals/intercept-console-error.ts (32:11))
+ at eval (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (26064:1))
+ at runWithFiberInDEV (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at warnForMissingKey (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (26063:1))
+ at warnOnInvalidKey (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7377:1))
+ at reconcileChildrenArray (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7458:1))
+ at reconcileChildFibersImpl (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7810:1))
+ at eval (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (7927:1))
+ at reconcileChildren (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (8396:1))
+ at beginWork (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (10586:1))
+ at runWithFiberInDEV (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (1474:1))
+ at performUnitOfWork (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16755:1))
+ at workLoopConcurrentByScheduler (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16749:1))
+ at renderRootConcurrent (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (16731:1))
+ at performWorkOnRoot (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (15871:1))
+ at performWorkOnRootViaSchedulerTask (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/react-dom-experimental/cjs/react-dom-client.development.js (17963:1))
+ at MessagePort.performWorkUntilDeadline (node_modules/.pnpm/next@file+..+next-repo-4fcdeeb3454e49f64407fc74ab9fb38b672fc9de9581ea9dd3c74079a214a6fc+packa_24t4esqetrb7tue4g274mwbxqi/node_modules/next/dist/compiled/scheduler-experimental/cjs/scheduler.development.js (36:1))
+ at ClientPageRoot (../src/client/components/client-page.tsx (60:13))
+ at Router (../src/client/components/app-router.tsx (633:8))
+ at AppRouter (../src/client/components/app-router.tsx (679:8))
+ at ServerRoot (../src/client/app-index.tsx (200:6))

  85 |         `)
  86 |       } else {
> 87 |         expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                    ^
  88 |          "at p ()
  89 |          at eval (app/ssr/page.tsx (9:10))
  90 |          at Array.map ()

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts:87:36)

● app-dir - owner-stack-react-missing-key-prop › should catch invalid element from on ssr client component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-react-missing-key-prop should catch invalid element from on ssr client component 2`

- Snapshot  - 1
+ Received  + 0

@@ -1,7 +1,6 @@
  app/ssr/page.tsx (9:10) @ eval
-
     7 |     <div>
     8 |       {list.map((item, index) => (
  >  9 |         <p>{item}</p>
       |          ^
    10 |       ))}

  91 |          at Page (app/ssr/page.tsx (8:13))"
  92 |         `)
> 93 |         expect(source).toMatchInlineSnapshot(`
     |                        ^
  94 |           "app/ssr/page.tsx (9:10) @ eval
  95 |
  96 |              7 |     <div>

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts:93:24)

Read more about building and testing Next.js in contributing.md.

pnpm test-start-turbo test/production/eslint-plugin-deps/index.test.ts (turbopack)

eslint plugin deps > should work

Expand output

● eslint plugin deps › should work

next build failed with code/signal 1

   98 |           if (code || signal)
   99 |             reject(
> 100 |               new Error(`next build failed with code/signal ${code || signal}`)
      |               ^
  101 |             )
  102 |           else resolve()
  103 |         })

  at ChildProcess.<anonymous> (lib/next-modes/next-start.ts:100:15)

● Test suite failed to run

TypeError: Cannot read properties of undefined (reading 'destroy')

  109 |     })
  110 |   })
> 111 |   afterAll(() => next.destroy())
      |                       ^
  112 |
  113 |   it('should work', async () => {
  114 |     const html = await renderViaHTTP(next.url, '/')

  at Object.destroy (production/eslint-plugin-deps/index.test.ts:111:23)

Read more about building and testing Next.js in contributing.md.

…ental/internal/components/errors/call-stack/call-stack.tsx Co-authored-by: Jiwon Choi <[email protected]>

ijjk · 2025-02-03T18:26:56Z

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
buildDuration	18.6s	15.5s	N/A
buildDurationCached	14.7s	12.8s	N/A
nodeModulesSize	391 MB	392 MB	⚠️ +385 kB
nextStartRea..uration (ms)	416ms	417ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
5306-HASH.js gzip	54 kB	54 kB	N/A
8276.HASH.js gzip	169 B	168 B	N/A
8377-HASH.js gzip	5.46 kB	5.46 kB	N/A
bccd1874-HASH.js gzip	52.9 kB	52.9 kB	N/A
framework-HASH.js gzip	57.5 kB	57.5 kB	N/A
main-app-HASH.js gzip	240 B	241 B	N/A
main-HASH.js gzip	34.5 kB	34.4 kB	N/A
webpack-HASH.js gzip	1.71 kB	1.71 kB	N/A
Overall change	0 B	0 B	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
polyfills-HASH.js gzip	39.4 kB	39.4 kB	✓
Overall change	39.4 kB	39.4 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
_app-HASH.js gzip	193 B	193 B	✓
_error-HASH.js gzip	193 B	193 B	✓
amp-HASH.js gzip	512 B	510 B	N/A
css-HASH.js gzip	343 B	342 B	N/A
dynamic-HASH.js gzip	1.84 kB	1.84 kB	✓
edge-ssr-HASH.js gzip	265 B	265 B	✓
head-HASH.js gzip	363 B	362 B	N/A
hooks-HASH.js gzip	393 B	392 B	N/A
image-HASH.js gzip	4.59 kB	4.58 kB	N/A
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.35 kB	2.35 kB	N/A
routerDirect..HASH.js gzip	328 B	328 B	✓
script-HASH.js gzip	397 B	397 B	✓
withRouter-HASH.js gzip	323 B	326 B	N/A
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	3.59 kB	3.59 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
_buildManifest.js gzip	748 B	747 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
index.html gzip	524 B	524 B	✓
link.html gzip	539 B	538 B	N/A
withRouter.html gzip	520 B	520 B	✓
Overall change	1.04 kB	1.04 kB	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
edge-ssr.js gzip	129 kB	129 kB	N/A
page.js gzip	210 kB	210 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
middleware-b..fest.js gzip	670 B	665 B	N/A
middleware-r..fest.js gzip	155 B	156 B	N/A
middleware.js gzip	31.3 kB	31.3 kB	N/A
edge-runtime..pack.js gzip	844 B	844 B	✓
Overall change	844 B	844 B	✓

Next Runtimes Overall increase ⚠️

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
app-page-exp...dev.js gzip	385 kB	393 kB	⚠️ +8.22 kB
app-page-exp..prod.js gzip	132 kB	132 kB	✓
app-page-tur..prod.js gzip	145 kB	145 kB	✓
app-page-tur..prod.js gzip	141 kB	141 kB	✓
app-page.run...dev.js gzip	372 kB	380 kB	⚠️ +8.24 kB
app-page.run..prod.js gzip	128 kB	128 kB	✓
app-route-ex...dev.js gzip	39.3 kB	39.3 kB	✓
app-route-ex..prod.js gzip	25.6 kB	25.6 kB	✓
app-route-tu..prod.js gzip	25.6 kB	25.6 kB	✓
app-route-tu..prod.js gzip	25.4 kB	25.4 kB	✓
app-route.ru...dev.js gzip	40.8 kB	40.8 kB	✓
app-route.ru..prod.js gzip	25.4 kB	25.4 kB	✓
dist_client_...dev.js gzip	356 B	356 B	✓
dist_client_...dev.js gzip	349 B	349 B	✓
pages-api-tu..prod.js gzip	9.69 kB	9.69 kB	✓
pages-api.ru...dev.js gzip	11.8 kB	11.8 kB	✓
pages-api.ru..prod.js gzip	9.68 kB	9.68 kB	✓
pages-turbo...prod.js gzip	21.9 kB	21.9 kB	✓
pages.runtim...dev.js gzip	31.5 kB	31.5 kB	✓
pages.runtim..prod.js gzip	21.9 kB	21.9 kB	✓
server.runti..prod.js gzip	60.2 kB	60.2 kB	✓
Overall change	1.65 MB	1.67 MB	⚠️ +16.5 kB

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js rf/errors-overlay-polish	Change
0.pack gzip	2.11 MB	2.1 MB	N/A
index.pack gzip	75.4 kB	75.5 kB	⚠️ +123 B
Overall change	75.4 kB	75.5 kB	⚠️ +123 B

Diff details

Diff for main-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js

failed to diff

Diff for app-page.runtime.dev.js

failed to diff

Commit: 8f833ec

…into rf/errors-overlay-polish

…rlay-polish

eps1lon

Until we figure out what's off with the snapshots. Removed blanklines is fine. Showing unsourcemapped stackframes is not.

raunofreiberg added 4 commits January 28, 2025 13:29

overlay wip

e76f4c0

Merge branch 'canary' of github.com:vercel/next.js into rf/errors-ove…

5aad57e

…rlay-polish

wip

c1e608a

many fixes

f3099b0

ijjk added CI approved Approve running CI for fork type: next labels Jan 30, 2025

raunofreiberg added 4 commits January 30, 2025 10:58

fix animation height

1ffd693

cleanup

fd20ef8

align turbo border

ed8066a

Update call-stack-frame.tsx

e5d531d

raunofreiberg marked this pull request as ready for review January 30, 2025 09:35

raunofreiberg requested a review from devjiwonchoi January 30, 2025 09:35

raunofreiberg added 5 commits January 30, 2025 11:36

Remove svg

12fad68

add app img

08e5e85

Update next-logo.tsx

8e83f15

add animation

d55a2ff

fix Escape

95f41b0

raunofreiberg added 2 commits January 30, 2025 13:24

Update styles.ts

ca5c636

Update dialog.tsx

0ba2599

raunofreiberg changed the title ~~[Error Overlay] End-to-end refinement~~ [Error Overlay] Comprehensive refinement Jan 30, 2025

raunofreiberg added 9 commits January 30, 2025 13:40

Update error-feedback.tsx

213f534

Fix test

8765470

oops

624d28c

test

f98dc71

call stack animate

0ad9f46

Fix Safari

e2ef6db

Unify terminal and code frame styles

9ec2d75

Cleanup dialog

2515df7

Colored icons

f9fa928

raunofreiberg and others added 18 commits February 3, 2025 18:03

Cleanup dialog

9e182bd

Colored icons

724a048

Remove unnecessary icons

dc9ae91

Remove clipping

a64298c

Only return focus to trigger when focus was previously inside menu

33e70ed

Revert icons to no color

00d4f27

add weight 500 geist mono

d36a29b

Rewrite to use dialogResizerRef instead of relying on DOM

351584e

Address feedback

9db411a

Use single loop for ignored/visible frames

ba9fb82

Hide ignored frames from tab navigation when closed

96e1384

Comment useDelayedRender

e9a9e5f

Fix TS

cc170ce

Only blur call stack frame, no opacity

0e4e7ff

Remove context

ea8d2a4

Throw min height on call stack header

be9a8da

fix: type for ErrorOverlayLayout test

72ba501

Update packages/next/src/client/components/react-dev-overlay/_experim…

df333ae

…ental/internal/components/errors/call-stack/call-stack.tsx Co-authored-by: Jiwon Choi <[email protected]>

eps1lon force-pushed the rf/errors-overlay-polish branch from 7c5f45d to df333ae Compare February 3, 2025 17:04

raunofreiberg added 3 commits February 4, 2025 10:27

Merge branch 'rf/errors-overlay-polish' of github.com:vercel/next.js …

085f210

…into rf/errors-overlay-polish

Merge branch 'canary' of github.com:vercel/next.js into rf/errors-ove…

4127f20

…rlay-polish

remove console log

ef4d179

ijjk added the tests label Feb 4, 2025

Fix broken test

0bd71a1

raunofreiberg force-pushed the rf/errors-overlay-polish branch from f1eac65 to 0bd71a1 Compare February 4, 2025 10:34

Update owner-stack-react-missing-key-prop.test.ts

ab89945

eps1lon requested changes Feb 4, 2025

View reviewed changes

raunofreiberg added 2 commits February 4, 2025 14:49

Rewrite useDelayedRender

04935cb

Fix scroll

8f833ec

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Error Overlay] Comprehensive refinement #75471

[Error Overlay] Comprehensive refinement #75471

raunofreiberg commented Jan 30, 2025 •

edited by devjiwonchoi

Loading

ijjk commented Jan 30, 2025 •

edited

Loading

ijjk commented Feb 3, 2025 •

edited

Loading

eps1lon left a comment

[Error Overlay] Comprehensive refinement #75471

Are you sure you want to change the base?

[Error Overlay] Comprehensive refinement #75471

Conversation

raunofreiberg commented Jan 30, 2025 • edited by devjiwonchoi Loading

Motion

Design

Interactions

ijjk commented Jan 30, 2025 • edited Loading

Failing test suites

ijjk commented Feb 3, 2025 • edited Loading

Stats from current PR

eps1lon left a comment

Choose a reason for hiding this comment

raunofreiberg commented Jan 30, 2025 •

edited by devjiwonchoi

Loading

ijjk commented Jan 30, 2025 •

edited

Loading

ijjk commented Feb 3, 2025 •

edited

Loading