The behaviour of how input elements in a form triggers validation changed between Vaadin 23 and 24. By validation I mean either the chain of a form, a bean with Bean Validation API annotations and a connecting BeanValidationBinder or some constraints for the input field.
In V24 a blur event instantly triggers a validation, before it only validated initially upon a changed value.
Examples using BeanValidationBinder in ValidationView forms:
In the live demo examples of field contraints in the Vaadin documentation this is also reproducible:
In this demos there is no BeanValidationBinder involved but the principle should be the same.
See how the text field becomes red in V24 without any input. In previous version it only gets red if you input something wrong before leaving.
Issue https://github.com/vaadin/platform/issues/3066 seems to be the relevant place of this change.
I can't find any mentions of this in various places of changes on V24.
Whether this new behaviour is better from a UX perspective might be debatable. It can however break existing applications with complex forms.
Consider a form with N inputs, a bean with string fields and @NotEmpty annotations and a BeanValidationBinder initialized with bindInstanceFields() method. On load the first input has the focus. As long as things are entered in order everything is fine. But if a user directly clicks the third input in the form, an error message of the first input is shown which might look unintuitive.
Or if you are using custom inputs, for example an input with search button where a click on the button pulls the focus from the input and triggers validation with an "empty value" error before the user even has the chance to pick something. Another scenario, dependencies in forms where a button further down the tab-order should trigger validation of some previous inputs. Depending where the focus sits when clicking the button this might trigger unexpected errors.
Looking mainly on com.vaadin.flow.component.textfield.TextField I don't see any general way of avoiding the validation upon on-blur. Overwriting all necessary web components or providing a custom BeanValidationBinder might be possible but feels just wrong.
There seems to be demand for deactivation of on-blur validation in https://github.com/vaadin/web-components/issues/354 from a non flow usage perspective which might be useful if it's ever gets picked up and implemented.
Questions, can the "old" validation behaviour be achieved somehow in a V24 application? Are there plans to implement some kind of backward compatibility for this? Could it be considered as a bug and an issue would be appropriate?
This is a known issue that arose after aligning the server-side validation timing with the web component, where eager validation on blur has been considered the expected behavior as of today.
We are currently considering a proposal to change the default behavior so that the field will only validate on blur after the user has actually interacted with it, for example, by typing something. For further updates, please follow https://github.com/vaadin/web-components/issues/6146.