FormState isValidating issues

[cyky]

I'm experiencing some weird issues with the FormState isValidating with our bit more complex form after we changed changed our custom validation resolver to async function. It doesn't happen always but our e2e test became flaky after the change.

I tried to reproduce it but it it is a bit flaky. However I managed to reproduce the issue couple times with this:
https://stackblitz.com/edit/react-ts-x44qv5?file=App.tsx

How to reproduce:

1. Insert some data into first and last name.
2. Copy part of the text attempt to copy and paste into fields by replacing all data in the fields
3. You might need to press submit button at the same time. Not always required.

=> Sometimes the isValidating stays true

I'm bit unsure if we are using the resolver in non intended way so that is why I decided to start discussion before submitting an issue.

[leapful]

@cyky : The problem might be related to your API from server-side, not from react-hook-form.

According to your stackblitz sample, there is no error handling when calling API inside your custom resolver, therefore in case rate limiting or network issue or any unexpected error from server-side, the custom validation will be crashed and cause flag validating always be true.

You should consider to put a try catch statement and add logging on error that can be synced to monitoring service like datadog, elastic stack to check if the problem is coming from server-side or not.

P.S: You might need to debounce onChange of each input field to reduce number of call to API too when validating too.

Example when always throwing error inside custom resolver: https://stackblitz.com/edit/react-ts-kravh8?file=App.tsx

[cyky]

I don't think that the issue is with error handling but rather something to do with multiple validations going through at the same time.

I've attempted to log all errors, timeouts and so on in our app but there really isn't anything unusual happening when this happens.

[cyky]

Actually I was able to reproduce the issue without async resolver: https://stackblitz.com/edit/react-ts-nwtivz?file=App.tsx

Just changing input fields fast enough couple of times causes isFormValidating to get stuck true, but reproducing this without async is quite hard.

[sebakerckhof]

I'm experiencing the same issue (with an async validator). Did you find a solution for this or was a bug reported?