Silent validation

[EmileSpecs]

Description

Hi
I'm struggling to understand the point of silent validation.
validate ({ silent: true })

Yes, it doesn't display the errors but I would have thought that the errors would be returned or that the function would return a boolean value.
It just returns the form state with no indication of form validity.

I'm trying to determine form validity as the state changes but before the form is submitted and thought this would do it, but I'm not getting the desired or expected result.

Any advice on how to achieve it and what the point is of silent validation, as it seems to do nothing?

[benjamincanac]

@romhml Any insight on this?

[romhml]

The point of this option is to update errors on input events without throwing an error (see this example).

In your case, you can check the form's validity using the errors attribute after calling a silent validate or remove the option and catch the validation error.

I'll do a quick PR to set the result to false when a silent validation fails to make it less confusing.

[EmileSpecs]

Thanks @romhml!

I actually did try this:

try {
    await bookingForm.value.validate({ silent: true })

    const formErrors = bookingForm.value.errors
    const formGetErrors = bookingForm.value.getErrors()

    console.log('User form errors:', formErrors)
    console.log('User form getErrors:', formGetErrors)
  } catch (errors) {
    console.log('User form thrown errors:', errors)
  }

When silent option is true, no errors are populated, the error array is empty.

When silent is not on, errors are caught but still displayed in the form, which I don't want.

Hopefully this fix will be the answer!

[romhml]

When silent option is true, no errors are populated, the error array is empty.

The error array should be populated in this case, the only difference is that no error is thrown when silent is true. You need to provide the path argument like this:

await bookingForm.value.validate(null, { silent: true })

If you don't wan't the error messages to be displayed, I'd suggest validating your state with your validation library directly. Here is an example https://stackblitz.com/edit/nuxt-ui-dvyv9n?file=app.vue.