Input validation on blur should not apply to Pristine fields

[nireno]

I'm comparing the behavior I'm experiencing with ReForm to this example from react-ux-form. In the react-ux-form example notice that first name is required but simply clicking into the field and then clicking out to cause a blur doesn't activate the error message. You have to actually "dirty" the field before the error message will appear.

An example use case where this is important is for a popup newsletter form. When the popup initially appears it auto-focuses the email field input. But a user who immediately clicks the popup-dismiss button is briefly shown an input validation error message even when they didn't mean to interact with the form at all.

[vmarcosp]

Hmm, got it. Could you provide a reproducible example? Just to make sure that we're on the same page with this behaviour.

[nireno]

If we take the signup form demo, I want to validate the email field on blur. So my naive approach would be:

      <Input
        value={form.values.email}
        onChange={ReForm.Helpers.handleChange(form.handleChange(Email))}
        placeholder="Email"
        error=?{form.getFieldError(Field(Email))}
        onBlur={_ =>
          form.getFieldState(Field(Email)) != Pristine ? form.validateField(Field(Email)) : ()}
      />

but that doesn't work because the field seems to always be pristine.

So I'm forced to simply validate on blur unconditionally.

      <Input
        value={form.values.email}
        onChange={ReForm.Helpers.handleChange(form.handleChange(Email))}
        placeholder="Email"
        error=?{form.getFieldError(Field(Email))}
        onBlur={_ => form.validateField(Field(Email))}
      />

Which gives the undesirable behavior of validating the pristine field.