our error boundaries had a bunch of logic that set `state.error = error`
and then checked `if (state.error)`, which only works correctly if
thrown value is truthy. it breaks if something does e.g. `throw
undefined`. in this case, we would incorrectly think that no error
occurred and render children again (instead of a fallback), which can
then lead to an infinite loop if the children throw again.
the fix is to wrap the thrown value, so `state.error` is either `null`
(initial/reset) or `{ thrownValue: ... }` if something errored. i
initially considered using a separate `state.hasError` boolean, but
that's a bit annoying to type, and really we want to model this as a
discriminated union, so using a pseudo-Optional thing is nicer.
### What
Display `global-error.js` along with error overlay in development. When
a runtime error occurred, you should be able to view the
`global-error.js` content by just hiding the error overlay.
### Why
Current behavior of `global-error.js` confused a lot of users that it
only renders in production build, howerver in dev it's always shows the
error overlay. This was considered "expected" before as you should focus
on fixing error in dev. But this brings a lot of inconvenience for
users, since they can't view the `global-error.js` easily in development
but production build.
#### After
The global-error content is displayed in the html with error overlay
covered
#### Before
Notice nothing displayed
Fixes#55462Fixes#52993
Closes NDX-694
## What
This fixes when the deep nested routes throws a client side error, it
can still be caught by the `global-error.js`
## How
We should always resolve global-error from root app directory instead of
current route's layout. Also fixed a bad test before where the
gloabl-error.js is not located correctly
Fixes#53756
Closes NEXT-1760
When there's a runtime error showing in root layout (server components), it should be able to catch by `global-error`.
For server components, we caught it and gonna render the error fallback components (either not-found or error page), and the response status is `200`, and since we'll display error dev overlay in developmenet mode so we only render `global-error` for production.
So that you can catch more errors with `global-error` and maybe do potential error tracking on client side.
Follow up of #52573
Closes NEXT-1442
minor refactor: move `appUsingSizeAdjust` into `Metadata` component so that we can just tune the flag as prop
Janka Uryga