question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using yup with onChange or onBlur mode

See original GitHub issue

Describe the bug onChange and onBlur mode doesn’t work with yup validation schema or I miss something 😃

To Reproduce Steps to reproduce the behavior:

  1. Open ValidationSchema example: https://codesandbox.io/s/928po918qr
  2. Set mode: 'onBlur:
const { register, handleSubmit, errors } = useForm({
    mode: 'onBlur',
    validationSchema: SignupSchema
  });
  1. Change the firstName and/or age fields and watch stringified errors object.

It looks like that clearing error works OK, but setting error does not.

Expected behavior Expected error message for empty firstName field after leaving field.

Desktop (please complete the following information):

  • OS: macOS 10.14.4
  • Browser chrome, 73.0.3683.103

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:12 (6 by maintainers)

github_iconTop GitHub Comments

8reactions
subvertallchriscommented, Apr 1, 2020

Oh man, nothing to apologize for! My day is just starting as yours is ending. This was a great turnaround time. FYI I’ve already got your library in production and it’s going to be part of every form in the project, it’s providing a great value already. Thank you for all your hard work.

2reactions
subvertallchriscommented, Apr 1, 2020

😮!

I saw reValidationMode and assumed from the lack of plain validationMode that it handled 100% of the operation. Thanks for the clarification!

Read more comments on GitHub >

github_iconTop Results From Across the Web

react-hook-form: Validation not working when using onBlur ...
In your code, the form mode is onBlur . it means the validation is triggered on blur event (unfocus the input). When you...
Read more >
useForm | React Hook Form - Simple React forms validation
mode : onChange | onBlur | onSubmit | onTouched | all = 'onSubmit' ... This function allows you to use any external validation...
Read more >
Validation - Formik
At The Palmer Group, we use Yup for object schema validation. It has an API that's pretty similar ... It will run after...
Read more >
onblur react hook form | The AI Search Engine You Control
In your code, the form mode is onBlur . it means the validation is triggered on blur event (unfocus the input). When you...
Read more >
Creating a Controlled Form with React Hook Forms | Theodo
The use cases for React Hook Forms is how easy it is to handle event handlers such as onSubmit , onChange , onBlur...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found