Revalidation on yup's .when() condition change

[chornbec]

Hello! I'm not sure I'm right on this.
I'm using yup as a validation scheme. Yup has a .when( 'inputName', { is: 'someValue', then: yup.string().required() } ) feature, but when the inputName is no longer 'someValue' the error message is still shown. I'm guessing it's because react-hook-form only triggers a watch() of some sort on the required input name... at least until the validation is satisfied.

In this codesandbox, if the lastName is "hello", the firstName is required, but when lastName is not 'hello', error message still exists. Maybe something I have to do in RHF's validationResolver?
Codesandbox

[bluebill1049]

Is this depend field validation? React Hook Form focus at a input at a time. you will need to triggerValidation (trigger in V6) for other deepened fields.

[bluebill1049]

we can trigger the entire form validation all the time, and let you to manage each field's dirty/touched and show error message accordingly, but then why not just use controlled? it defeats the purpose of this lib.

[chornbec]

oh I see, thanks! I figured I'd have to manually triggerValidation for this specific yup schema. I tried putting triggerValidation in a useEffect(..., [errors]) whenever errors obj is not blank, but that wouldn't make sense if the errors obj only changes based on the single input's 'onChange' and not when the input it depends on changes
I thought I saw somewhere in the docs that showed this single input at a time could be turned off? Or maybe I'm imagining since I can't find it right now.

[bluebill1049]

is this what you refer to onChange={() => trigger(['input1', 'input2'])} ?

[chornbec]

Yes, I believe so. If input1 is required because input2 is "hello", an onChange of input2 would trigger re-validation in case input1 is still required.

[bluebill1049]

you probably want to write some logic inside the onChange then.