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

React.StrictMode throws error for all forms #412

Open
JacobGalati opened this issue Aug 12, 2021 · 4 comments
Open

React.StrictMode throws error for all forms #412

JacobGalati opened this issue Aug 12, 2021 · 4 comments

Comments

@JacobGalati
Copy link

JacobGalati commented Aug 12, 2021

Environment

  • react-advanaced-form: 1.7.2

What

When running a create-react-app with React.StrictMode (the default for React 17) an Uncaught Invariant Viloation error is thrown for all form fields.

Current behavior

An error is thrown for the first form field and the field does not function.
Example:

Uncaught Invariant Violation: Cannot register field `userEmail`, 
the field with the provided name is already registered. 
Make sure the fields on the same level of `Form` or `Field.Group` have unique names.

Expected behavior

No error would be thrown and the field would function as expected.

Why

I think it is because strict mode renders components twice to detect code issues as mentioned here

How

Steps to reproduce the issue (ideally, link to the repository/sandbox).
Here is a Sandbox of the error.

@JacobGalati
Copy link
Author

To clarify this obviously is only an issue in development since strict mode has no effect on production.

@kettanaito
Copy link
Owner

Hey, @JacobGalati. I recommend putting your use case in an isolated reproduction. That may help you spot the issues.

I don't think React's strict mode has anything to do with the error (but it may). Perhaps you're indeed registering (rendering) two fields with the same name?

@JacobGalati
Copy link
Author

Hey @kettanaito if you take a look at my sandbox I linked at the bottom of the issue you can see the errors. Commenting out <React.Strict> makes the errors go away.

@kettanaito
Copy link
Owner

Thanks for providing the sandbox, @JacobGalati!

I don't have time capacity to maintain this library right now, so feel free to investigate on your own. I can dedicate some time to do a code review and merge the fix, but I wouldn't count on anything else.

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

No branches or pull requests

2 participants