Vaadin form layout, different behavior in constructor and in regular method

General
1

Hello, I have simple FormLayout, constructed from Java API.

In constructor I set the exactly one colunt for it. And add some fields. All works fine there.

	public MyClass() {
        gridForm.setResponsiveSteps(
                new FormLayout.ResponsiveStep("0", 1, FormLayout.ResponsiveStep.LabelsPosition.ASIDE)
        );

       for (...) {
     		FormLayout.FormItem component = ....;
            gridForm.add(component);
}       }

Then in some event listeners I want to change the content (fields) of my FormLayout. And I just do this:

    private void rebuildGridForm() {
        gridForm.removeAll();
        for (...) {
            FormLayout.FormItem component = ...;
            gridForm.add(component);
        }
    }

In second case fields created and added to layout, BUT form layout seems like it totally ignore ResponsiveStep preference.
My form contains many columns. From html inspect I also see this difference:

first case:

<vaadin-form-layout style="width: 100%; height: 100%;" id="gridForm">
   <vaadin-form-item style="width: calc(99.9% - 0rem); margin-left: 0px; margin-right: 0px;">...</vaadin-form-item>
   <vaadin-form-item style="width: calc(99.9% - 0rem); margin-left: 0px; margin-right: 0px;">...</vaadin-form-item>
   ...
   <vaadin-form-item style="width: calc(99.9% - 0rem); margin-left: 0px; margin-right: 0px;">...</vaadin-form-item>
</vaadin-form-layout>

second case:

<vaadin-form-layout style="width: 100%; height: 100%;" id="gridForm">
   <vaadin-form-item>...</vaadin-form-item>
   <vaadin-form-item>...</vaadin-form-item>
   ...
   <vaadin-form-item>...</vaadin-form-item>
</vaadin-form-layout>

I’m miss some critical part in documentation? Or this is just a bug?

2

Looks like a bug to me. If you can reproduce the behavior in a simple project, you should file a ticket at https://github.com/vaadin/vaadin-form-layout-flow/issues

-Olli

3

done