[EuiDataGrid] Issues with minimal height when browser zoom lower than 100%

[dej611]

This issue is particularly bad when there's only 1 row to visualize on the data grid as the header takes up the full space. As a user who always keep the zoom level at 80% during regular navigation this can be very annoying.

As an example in the Kibana Vega debug inspector the initial data grid contains only 1 row which is shown as follow with 100% zoom:

If I set the browser zoom at 80% within the same session then I get this (which seems correct to me):

If I refresh and reopen the same inspector page, then I get this instead:

The general behaviour with 80% zoom set I see is a N-1 rows in the table which is not super bad, but with the 1 row this is really a bad issue. Perhaps a minimal height can be provided in this case? Or maybe take into account the devicePixelRatio when computing the grid height?

Kibana linked issue: https://github.com/elastic/kibana/issues/148877

[cee-chen]

Hey @dej611! I can confirm/repro this issue - I actually normally browse on Firefox with a larger devPixelsPerPx than the default and have def run into this in the past in EUI's datagrid docs.

As a heads up, EuiDataGrid is currently lower on our priorities and roadmap, so I just wanted to let you know that we have no ETA for a fix and are unlikely to pick up this issue in the near future, but we'd absolutely welcome a PR for it. I think your point on using devicePixelRatio is right on the money.

[tkajtoch]

Adding needs validation label back as we need to look into this issue again and understand if it's still happening