We had to downgrade to version 7.5.8 (from 7.7.8) because starting with version 7.5.9 of Vaadin IE11/Edge may display fields in the grid layout incorrectly (see below). All fields inside of a grid layout are collapsed into one line. Inspection of the HTML reveals that gridlayout slot divs are missing top/height attributes. The same JSON is sent to the client for both correctly and incorrectly rendered fields which makes us suspect the problem is entirely on the client side.
Factors that could make reproducing this issue difficult:
It happens only in Edge/IE (only tested IE 11)
It only happens when the gridlayout is rendered on the page for the first time (after either navigating to the page or full page refresh). If the gridlayout is replaced with another layout on the same page or the page is resized the fields are rendered correctly.
The problem depends on the browser window size and the height of the gridlayout. It happens quite often but not always and changing either content of the layout or size of the browser window could make it happen or go away.
Fields displayed incorrectly:
Displayed correctly:
Correct HTML:
Incorrect HTML: