react-final-form icon indicating copy to clipboard operation
react-final-form copied to clipboard

Reproduced the bug with async validation on filed when resolve promise immediately

Open BataevDaniil opened this issue 4 years ago • 8 comments

I reproduced in test error when async validation on field when resolve promise immediately when add new field. I don`t know how this fix.

BataevDaniil avatar Jul 22 '21 09:07 BataevDaniil

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 3b800e9d2a5e27a985fb0aa10aeebdab50a8402b:

Sandbox Source
React Final Form - Simple Example Configuration
React Final Form - Synchronous Record Level Validation Configuration
React Final Form - Synchronous Field Level Validation Configuration
React Final Form - Submission Errors Configuration
React Final Form - Subscriptions Example Configuration

codesandbox-ci[bot] avatar Jul 22 '21 09:07 codesandbox-ci[bot]

This test is not expecting anything. I don't really understand the problem. Can you make it fail?

erikras avatar Jul 23 '21 08:07 erikras

This test is not expecting anything. I don't really understand the problem. Can you make it fail?

I didn't find an opportunity to catch "unhandled promise rejection" in jest. You can see the log in the terminal. Example

(node:47480) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'active' of undefined
(Use `node --trace-warnings ...` to show where the warning was created)
(node:47480) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:47480) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:47480) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'active' of undefined
(node:47480) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)

still locally on the second render component I get the error validating get from undefined. This is happens here https://github.com/final-form/final-form/blob/fca83cba96e6a84aee40ca2c693319d2054ed119/src/FinalForm.js#L332

I create yet example https://codesandbox.io/s/react-final-form-asynchronous-field-level-validation-example-forked-pndej?file=/index.js

Interestingly, there was no such error on version final-form 4.16.1 and react-final-form 6.3.0

Thank you very much for your responsiveness

BataevDaniil avatar Jul 23 '21 13:07 BataevDaniil

Hello, @erikras

BataevDaniil avatar Aug 05 '21 09:08 BataevDaniil

Hello, @erikras

BataevDaniil avatar Aug 17 '21 11:08 BataevDaniil

What am I supposed to see when I load up your codesandbox? Clicking the button makes the other fields appear. I'm not seeing any errors.

erikras avatar Sep 25 '21 08:09 erikras

Hello @erikras & @BataevDaniil

Im getting this error in versions:

  • final-form: 4.20.6
  • react-final-form: 6.5.8

The codesandbox: https://codesandbox.io/s/react-final-form-asynchronous-field-level-validation-example-forked-v1ktoy?file=/index.js

If the <Form /> or the <Field /> have the validation prop with an async function then the registerField fails on runValidation

The issue in the final form repo: https://github.com/final-form/final-form/issues/411

jarnaiz avatar Feb 25 '22 10:02 jarnaiz

Hello again!

Here you have a workaround: https://codesandbox.io/s/react-final-form-asynchronous-field-level-validation-example-workaround-po5eq1

Pausing the validation process before register the new Field and resume it after the rerender, should fix the problem.

jarnaiz avatar Apr 07 '22 22:04 jarnaiz

This bug is fixed with final-form: 4.20.9 :D

jarnaiz avatar Jan 26 '23 23:01 jarnaiz

Closing as per @jarnaiz

This bug is fixed with final-form: 4.20.9 :D

Feel free to reopen if the issue has not been resolved

gertdreyer avatar Mar 02 '23 20:03 gertdreyer