Single-Line grid growing infinitely when footer is set to grow

[probert94]

Description

In our Vaadin Flow application, we set the grid footer to grow (instead of the body) so that the footer row is directly under the body even if the grid gets 100% height.
Since the update to Vaadin 24.6 this causes the grid to grow infinitely, when it has only one item. Grids with multiple items are not affected.
It also seems to be related to the layout in which the grid is placed, as it does not affect all grids in our application.
The issue is probably related to #7964

Expected outcome

The grid should not grow infinitely.
As a workaround you can set "--_grid-min-height: unset" on the grid

Minimal reproducible example

DataGridView.java

@PageTitle("Data Grid")
@Route("")
@Menu(order = 0, icon = LineAwesomeIconUrl.TH_SOLID)
public class DataGridView extends Div {
  record Person(String firstName, String lastName) {}
  public DataGridView() {
    setSizeFull();
    Grid<Person> grid = new Grid<>();
    grid.addThemeVariants(GridVariant.LUMO_NO_BORDER, GridVariant.LUMO_COLUMN_BORDERS);
    grid.setHeight("100%");
    grid.setItems(List.of(new Person("John", "Doe")));
    grid.addColumn(Person::firstName)
      .setHeader("Amount")
      .setFooter("Amount");
    grid.addColumn(Person::lastName)
      .setHeader("Last name")
      .setFooter("Last name");
    add(grid);
  }
}

vaadin-grid.css:

:host #items {
	flex-grow: 0;
}

:host #footer {
	flex-grow: 1;
}

A short screen recording showing the growing scrollbar
https://github.com/user-attachments/assets/de758914-4414-4bea-9dae-d3ad0f33d7cd

Steps to reproduce

1. Download a new vaadin starter
2. Copy the above Java code into the view class
3. Create the vaadin-grid.css file in frontend/themes/theme-name/component and insert the CSS code.
4. Open the application. You should now see the growing scrollbar which indicates that the grids height is increased infinitely.

Environment

Hilla: 24.6.2
Flow: 24.6.2
Vaadin: 24.6.2
Copilot: 24.6.2
Frontend Hotswap: Disabled, using pre-built bundle
OS: amd64 Windows 11 10.0
Java: Eclipse Adoptium 21.0.3
Browser: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36
Java Hotswap: Hotswap is not enabled
IDE Plugin: Not installed

Browsers

Issue is not browser related

[sissbruecker]

Very likely a regression from #7964. That adds a resize observer on the footer to update the min-height of the grid when the footer size changes. The assumption here was that the footer would usually be static rather than be configured to take up the remaining space in the flex layout. Not sure why that causes it to keep growing or why it's only reproducible with a single row.