Scroll to first erroneous input field and open every parent?

Flow
1

Hi, my situation is this with Vaadin 14.1.5:
There is a large input form with 100 to 150 input fields, buttons, …
All fields have their own input (rapid testing) validators.
And then there is some “lazy validation”: the save buttons activate some additional (computational intensive) overall validators (button executes the validation on the bean, button writes the bean-validation-results into an error pool, button triggers all field validators (by calling binder.writeBeanIfValid), field validators read errors from the error pool and show them; use case is e.g. checking the combination of fieldvalues A, B and C against a database → fields A, B and C are marked erroneous).
Some fields are within a (maybe closed) Details-component, some fields are always visible in the form (but maybe out of visible scope).

Problem to get solved: when the user clicks on a button, then he/she does not always see the erroneous field(s).

Desired behaviour: the input form should scroll to the first erroneous input field and open all parent elements (i.e. Details-component).

First thought:

  1. Scrolling to an element could be done within a validator with context.getComponent().get().getElement().callJsFunction(“scrollIntoView”);
    like described in https://vaadin.com/forum/thread/17467755/equivalent-of-scrollintoview-component-in-vaadin-flow
  2. Getting all parent Details-components could be done with something like context.getComponent().get().getParent().get() instanceof Details
  3. Opening could be done with Details.setOpened(true).

The dark side of that approach is that every single validator (even whose code I do not own) has to implement (or at least call) that scroll-and-open-behavior.

Question: Is there an easier / a correct / a preferred way to do above?

2

An implementation for the steps described above could be like this (it works):

@Override
public ValidationResult apply(BigDecimal value, ValueContext context) {
	ValidationResult validationResult = getTheOverallValidationResultForThisField();
	if (validationResult.isError()) {
		Optional<Component> optionalComponent = context.getComponent();
		Component formElement = optionalComponent.isPresent() ? optionalComponent.get() : null;
		if (formElement != null) {
			
			//Search and open the parent-Details-element
			Optional<Component> optionalParent = formElement.getParent();
			while (optionalParent != null && optionalParent.isPresent()) {
				Component parent = optionalParent.get();
				if (parent instanceof Details) {
					((Details) parent).setOpened(true);
					optionalParent = null;
				} else {
					optionalParent = parent.getParent();
				}
			}
			
			// Scroll to the form element
			formElement.getElement().callJsFunction("scrollIntoView");
			
			// Set focus into the form element - increases the probability that the browser really shows this form element
			if (formElement instanceof Focusable<?>) {
				((Focusable<?>) formElement).focus();
			}
		}
	}
	return validationResult;
}

Question is still whether there is an easier / a correct / a preferred way to do above…