[NEXT-733] global-error.tsx issues #46572

jazzypants1989 · 2023-02-28T18:30:33Z

Verify canary release

I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
Platform: win32
Arch: x64
Version: Windows 10 Pro
Binaries:
Node: 16.17.1
npm: N/A
Yarn: N/A
pnpm: N/A
Relevant packages:
next: 13.2.2-canary.3
eslint-config-next: 13.2.1
react: 18.2.0
react-dom: 18.2.0

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true)

Link to the code that reproduces this issue

https://github.com/jazzypants1989/nextjs-test

To Reproduce

1.) Add a .env file with these variables:
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=whatever
MONGODB_URI=whatever

2.) Run local dev server

3.) Create a user

4.) Go to admin page

5.) Go to other page

6.) Go back to admin page

Describe the Bug

The entire server breaks and gives me this stack trace:

Uncaught TypeError: Cannot read properties of undefined (reading '')
at resolveClientReferenceMetadata (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:189:70)
at serializeClientReference (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1425:47)
at resolveModelToJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1856:28)
at Object.toJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1132:28)
at stringify ()
at processModelChunk (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:162:24)
at retryTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1979:38)
at performWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:2017:21)
at eval (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1372:28)
at scheduleWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:47:13)
at pingTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1371:17)
at ping (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1384:28)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
resolveErrorDev @ react-server-dom-webpack-client.browser.development.js?7de2:755
processFullRow @ react-server-dom-webpack-client.browser.development.js?7de2:800
processBinaryChunk @ react-server-dom-webpack-client.browser.development.js?7de2:835
progress @ react-server-dom-webpack-client.browser.development.js?7de2:893
react-server-dom-webpack-client.browser.development.js?7de2:755 Uncaught TypeError: Cannot read properties of undefined (reading '')
at resolveClientReferenceMetadata (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:189:70)
at serializeClientReference (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1425:47)
at resolveModelToJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1856:28)
at Object.toJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1132:28)
at stringify ()
at processModelChunk (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:162:24)
at retryTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1979:38)
at performWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:2017:21)
at eval (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1372:28)
at scheduleWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:47:13)
at pingTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1371:17)
at ping (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1384:28)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
resolveErrorDev @ react-server-dom-webpack-client.browser.development.js?7de2:755
processFullRow @ react-server-dom-webpack-client.browser.development.js?7de2:800
processBinaryChunk @ react-server-dom-webpack-client.browser.development.js?7de2:835
progress @ react-server-dom-webpack-client.browser.development.js?7de2:893
react-dom.development.js?5198:20605 The above error occurred in the component:

at ServerRoot (webpack-internal:///(app-client)/./node_modules/next/dist/client/app-index.js:126:11)
at RSCComponent
at Root (webpack-internal:///(app-client)/./node_modules/next/dist/client/app-index.js:143:11)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
logCapturedError @ react-dom.development.js?5198:20605
update.callback @ react-dom.development.js?5198:20631
callCallback @ react-dom.development.js?5198:15106
commitCallbacks @ react-dom.development.js?5198:15153
commitLayoutEffectOnFiber @ react-dom.development.js?5198:26427
commitLayoutEffects @ react-dom.development.js?5198:27872
commitRootImpl @ react-dom.development.js?5198:30955
commitRoot @ react-dom.development.js?5198:30809
finishConcurrentRender @ react-dom.development.js?5198:29668
performConcurrentWorkOnRoot @ react-dom.development.js?5198:29549
workLoop @ index.js?10c5:10
flushWork @ index.js?10c5:10
performWorkUntilDeadline @ index.js?10c5:10
index.js?10c5:10 Uncaught TypeError: Cannot read properties of undefined (reading '')
at resolveClientReferenceMetadata (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:189:70)
at serializeClientReference (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1425:47)
at resolveModelToJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1856:28)
at Object.toJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1132:28)
at stringify ()
at processModelChunk (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:162:24)
at retryTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1979:38)
at performWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:2017:21)
at eval (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1372:28)
at scheduleWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:47:13)
at pingTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1371:17)
at ping (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1384:28)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
resolveErrorDev @ react-server-dom-webpack-client.browser.development.js?7de2:755
processFullRow @ react-server-dom-webpack-client.browser.development.js?7de2:800
processBinaryChunk @ react-server-dom-webpack-client.browser.development.js?7de2:835
progress @ react-server-dom-webpack-client.browser.development.js?7de2:893
admin:1 The resource http://localhost:3000/_next/static/chunks/polyfills.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.

Expected Behavior

The entire server not breaking.

Which browser are you using? (if relevant)

Brave v1.48.171, but I tested in Chrome and Firefox and got the same issue.

How are you deploying your application? (if relevant)

I can't even get to deployment because I have ridiculous bugs every single day.

_NEXT-733

The text was updated successfully, but these errors were encountered:

jazzypants1989 · 2023-02-28T18:38:50Z

So, the error goes away (most of the time) when you delete global-error.tsx, but that's obviously not ideal.

I'm fairly certain this is a caching error because it works perfectly on the first load every time, but telling NextJS to not cache the file doesn't make a difference.

marysmech · 2023-03-03T17:56:52Z

I have same problem after update from 13.1.6 to 13.2.3. I tried to delete global-error.tsx and since then everything seems fine (at least so far).

audriuiv · 2023-03-06T21:19:20Z

I have the this problem too, in my project without global-error.tsx file.

samuelcotterall · 2023-03-07T12:44:03Z

I am also experiencing a similar issue in 13.2.3, with the warning The resource http://localhost:3000/_next/static/chunks/polyfills.js was preloaded using link preload but not used within a few seconds from the window's load event [...] being shown in the browser’s console.

The build seems to be unaffected, there are no warnings/errors in the Node console, and I do not have a global-error.tsx file.

I’ll be looking into it further today.

shuding · 2023-03-08T18:42:19Z

Hey could you provide a simpler reproduction? I tried [email protected]:jazzypants1989/nextjs-test.git and got this locally:

error - ReferenceError: authOptions is not defined
    at getSession (./src/Auth/session.ts:9:83)
    at getCurrentUser (./src/Auth/session.ts:12:27)
    at AdminLayout (./src/app/admin/layout.tsx:22:85)
    at runMicrotasks (<anonymous>)
    at async Promise.all (index 0)
   5 |
   6 | export async function getSession() {
>  7 |   return await getServerSession(authOptions)
     |                                ^
   8 | }
   9 |

Which is an obvious mistake. After fixing it everything worked fine:

jazzypants1989 · 2023-03-08T19:54:32Z

I apologize. I accidentally broke the demo. It's fixed now and the error is still there. Make sure that you click between pages after the first successful load of the admin page. You need the admin page to be cached at least once before the error will occur.

I'm not going to make a simpler demo because it's impossible for me to know how to recreate the error otherwise and this is the one that I need you to fix. I get lots of other errors, but they don't completely break my site like this one.

shuding · 2023-03-23T15:37:37Z

I'm now seeing this error with that repo:

Can someone else create a reproduction?

coopernewby · 2023-04-05T01:33:42Z

I got this issue too upgrading from 13.1.6 to 13.2.4.
error - SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse (<anonymous>)
I used the exact code in the beta docs.

When I deleted global-error.tsx, the error resolved. not really sure how to add back global error but just leaving it out for now

JohnnyCarreiro · 2023-06-15T11:39:23Z

I'm facing a different error, i have may global error boundary configured and also a error route in app root dir according with Next Docs. When i throw a error on pages, they are handled by error boundary as expected, but when some error occurs on root layout, the expected behavior is to this error be handled by global error boundary, which is not happening

aliawanai · 2023-06-27T20:03:44Z

i'm using next.js 13.4.4. i have setup my global-error.tsx file as mentioned in docs. i tried to simulate the global-error.tsx by throwing an error on root layout.tsx but still my global-error.tsx is not catching the errors. is it an issue with next.js? or am i making some mistake. @JohnnyCarreiro have you figured it out?

priya-jain-dingg · 2023-07-09T13:56:51Z

i'm using next.js 13.4.4. i have setup my global-error.tsx file as mentioned in docs. i tried to simulate the global-error.tsx by throwing an error on root layout.tsx but still my global-error.tsx is not catching the errors. is it an issue with next.js? or am i making some mistake. @JohnnyCarreiro have you figured it out?

I am facing same issue. Did anyone find any solution

Previously `global-error` only caught the error on client side, this PR adds the support for catching the errors thrown during client components SSR or server components RSC rendering. Closes #46572 Closes #50119 Closes #50723

KristineTrona · 2023-07-20T08:56:03Z

I am on version 13.4.10 and throwing an error in root layout still does not show the global-error.tsx

zy0228 · 2023-07-25T07:30:41Z

v13.4.12 still exist this issue

timneutkens · 2023-07-27T09:25:14Z

Please open a new issue with a reproduction.

jazzypants1989 added the bug Issue was opened via the bug report template. label Feb 28, 2023

timneutkens added the linear: next Confirmed issue that is tracked by the Next.js team. label Mar 1, 2023

timneutkens changed the title ~~global-error.tsx issues~~ [NEXT-733] global-error.tsx issues Mar 1, 2023

kaisergeX mentioned this issue Jul 10, 2023

🪲 global-error.tsx is not catching the errors kaisergeX/note-next#10

Closed

1 task

huozhi mentioned this issue Jul 11, 2023

Support global-error for ssr fallback #52573

Merged

kodiakhq bot closed this as completed in #52573 Jul 12, 2023

vercel locked and limited conversation to collaborators Jul 27, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[NEXT-733] global-error.tsx issues #46572

[NEXT-733] global-error.tsx issues #46572

jazzypants1989 commented Feb 28, 2023 •

edited by timneutkens

Loading

jazzypants1989 commented Feb 28, 2023 •

edited

Loading

marysmech commented Mar 3, 2023

audriuiv commented Mar 6, 2023

samuelcotterall commented Mar 7, 2023

shuding commented Mar 8, 2023

jazzypants1989 commented Mar 8, 2023 •

edited

Loading

shuding commented Mar 23, 2023

coopernewby commented Apr 5, 2023

JohnnyCarreiro commented Jun 15, 2023

aliawanai commented Jun 27, 2023

priya-jain-dingg commented Jul 9, 2023

KristineTrona commented Jul 20, 2023

zy0228 commented Jul 25, 2023

timneutkens commented Jul 27, 2023

[NEXT-733] global-error.tsx issues #46572

[NEXT-733] global-error.tsx issues #46572

Comments

jazzypants1989 commented Feb 28, 2023 • edited by timneutkens Loading

Verify canary release

Provide environment information

Which area(s) of Next.js are affected? (leave empty if unsure)

Link to the code that reproduces this issue

To Reproduce

Describe the Bug

Expected Behavior

Which browser are you using? (if relevant)

How are you deploying your application? (if relevant)

jazzypants1989 commented Feb 28, 2023 • edited Loading

marysmech commented Mar 3, 2023

audriuiv commented Mar 6, 2023

samuelcotterall commented Mar 7, 2023

shuding commented Mar 8, 2023

jazzypants1989 commented Mar 8, 2023 • edited Loading

shuding commented Mar 23, 2023

coopernewby commented Apr 5, 2023

JohnnyCarreiro commented Jun 15, 2023

aliawanai commented Jun 27, 2023

priya-jain-dingg commented Jul 9, 2023

KristineTrona commented Jul 20, 2023

zy0228 commented Jul 25, 2023

timneutkens commented Jul 27, 2023

jazzypants1989 commented Feb 28, 2023 •

edited by timneutkens

Loading

jazzypants1989 commented Feb 28, 2023 •

edited

Loading

jazzypants1989 commented Mar 8, 2023 •

edited

Loading