Vaadin 24.5.0 Layout issue

alexanoid commented 3 days ago

Description of the bug

I have a page that is divided into two sections: the central part and the right sidebar, which contains a Form Layout:

After the initial visit to the page, everything is displayed correctly:

normal

But if I press F5 in the browser (for example, in Google Chrome) to refresh the page, all the components in the Form Layout get clustered together:

not_normal

In Vaadin Flow versions 24.4.x, such issues do not occur

Expected behavior

After the page reloads, its appearance should not break

Minimal reproducible example

n/a

Versions

Vaadin / Flow version: 24.5.0
Java version: 17
OS version: Windows 10
Browser version (if applicable): Google Chrome

mcollovati commented 3 days ago

Unfortunately, I cannot reproduce. Please provide a reproducible example, or at least detailed information about how your view is built.

alexanoid commented 3 days ago

The view content is created in the com.vaadin.flow.router.HasUrlParameter#setParameter method.

There is a VerticalLayoutwith a central part and a right sidebar. The FormLayoutis in the right sidebar.

The content of the central part and the sidebar is delivered asynchronously via @Push(transport = Transport.WEBSOCKET_XHR, value = PushMode.MANUAL) after the initial page creation. This might be the reason...

This is FormLayout:

<vaadin-form-layout class="search-job-form search-form-hideable" style="flex-shrink: 0; width: 25em; flex-grow: 1;" id="0c756df1-6e05-4a62-b6f2-7b497ad0c8c5" dir="ltr">

@media all and (max-width: 1100px) {
  .all-jobs-view.editing .toolbar,
  .search-form-hideable {
    display: none;
  }
}

@media all and (max-width: 1100px) {
  .body-hideable {
    display: none;
  }
}

knoobie commented 1 day ago

@web-padawan Could this be related to the fix you did yesterday? https://github.com/vaadin/web-components/pull/7988

web-padawan commented 1 day ago

Yes, I suppose it's related to the same regression and should be fixed in the next patch release.

vaadin / flow