bug: registered field count is +1 after server side rendered redux state rehydration
See original GitHub issueThis is bug report following the changes in #2470
To reproduce this bug:
- Have a server side rendered form
- Have the server side redux state serialized and sent to the client as an initial state
- Hydrate the redux state on the client
- Mount the same form
Expected behavior is a correct count
of registered fields. Assuming the field is mounted once, it should be 1 - instead it’s 1 + 1 = 2.
This occurs on any environment - regardless.
Root cause of this problem is the previous assumption of the library that when a REGISTER_FIELD
event is raised - it will do an “upsert” of the field to the registeredField
list. Since now there is a sort of reference counting going on - this +1 the current state.
A solution, unfortunately would be to indicate the state is server generated and prevent the initial redundant increment. Otherwise, differentiation between new registrations and additional registrations.
What is not a solution:
- Ignore SSR scenarios
- Reset the entire form state on the client - Sometimes we have initial values rendered on the server or other state which could be important.
Issue Analytics
- State:
- Created 6 years ago
- Reactions:6
- Comments:13 (6 by maintainers)
Top Results From Across the Web
registered field count is +1 after server side rendered redux ...
This issue is causing redux form to put a field into an invalid state even when the field that is invalid is no...
Read more >Redux Server Side Rendering: Actions - reactjs - Stack Overflow
The issue I'm having is: the {renderToString} from 'react-dom/server' renders only the pristine version of the store, if something changes the ...
Read more >How to use Redux in Next.js - LogRocket Blog
Learn how to incorporate Redux, the most popular state management tool, into Next.js quickly and easily in this full tutorial.
Read more >Usage Guide - Redux Toolkit
Usage Guide. The Redux core library is deliberately unopinionated. It lets you decide how you want to handle everything, like store setup, ...
Read more >hydration failed because the initial ui does not match what was ...
Open side panel. Error: Hydration failed because the initial UI does not match what was rendered on the server with useSession() and react-bootstrap....
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Because this issue saw almost no activity for a few months, I’m closing it.
This issue is affecting me as well. I am able to “fix” it by modifying the reducer to skip the
REGISTER_FIELD
action when running on the serveras @yoadsn pointed out there is a precedent for libraries changing behavior when running on the server to support SSR. (you can see that glamor does something similar here)
I’d be willing to try and take this further if this is something that redux form would be willing to accept.
Either way thanks for the great lib…