Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Instances of Error: This Suspense boundary received an update before it finished hydrating #92

Open
Rodeoclash opened this issue Jul 11, 2023 · 4 comments

Comments

@Rodeoclash
Copy link

I'm currently on v1.02 and recently tried to upgrade to v2.01. This went fine (and a ton of boilerplate was removed, well done!) but my automated tests started to get the error Error: This Suspense boundary received an update before it finished hydrating.

I didn't notice this error in development when using the site normally and I suspect that it might have something to do with how aggressively playwright controls the browser (i.e. it will navigate to another page very quickly after the first page has rendered some HTML).

I don't understand the internals of relay-nextjs very well but it it possible that something changed in the new version that might be related to suspense boundaries?

I found some details around how hard it is to debug where this occurring (facebook/react#25625) and some other users that have tracked this to a useEffect hook problem, however the stack trace is not very useful for figuring out exactly where it went wrong.

Just curious if anyone else has run into this!

React version 18.2.0
Next 13.3.0

@rrdelaney
Copy link
Member

@Rodeoclash Sorry for the late response here! We started to see this issue a lot in development with the React 18 upgrade and it hasn't really impacted us since. We're under the impression this is a somewhat misleading error message and don't plan to fix it.

@rrdelaney
Copy link
Member

Following up here and to be clear, I mean that this has not impacted production for us and the application continues to work as expected. This is annoying in development mode, but this is an issue with React we cannot fix without substantially altering our code to be less efficient. Please see this discussion surrounding the issue on Reddit: https://www.reddit.com/r/nextjs/comments/yxa87v/im_glad_im_not_the_only_one_that_thinks_this/

If there are ideas on a workaround for the error we would be very happy to incorporate them into the library and welcome contribution.

@Rodeoclash
Copy link
Author

@rrdelaney Interesting, I was getting rehydration issues in production as well (and have basically turned off SSR until I find some time to get to the bottom of what's going on) but it seems that this problem is tangentially related to SSR right? I think I might have an underlying issue going on which is also occurring alongside this issue.

@FINDarkside
Copy link
Contributor

FINDarkside commented Feb 13, 2024

Just for some context, as of my understanding the error was already removed in 2022. See: facebook/react#25692

The big change here is that we consider this a bug of React that we should fix. Therefore it's not actionable to users today because it should just get fixed. So we're removing the error early. Although anyone that has fixed these issues already are probably better off for it.

The latest stable React release is almost 2 years old though which is why we're still seeing this error.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

3 participants