DataTable/VirtualScroller: When using scrollHeight='flex", grid has no height

[mpearce9]

Describe the bug

When I attempt to use scrollHeight="flex" on the DataTable when using the VirtualScroller, I seem to get no height on my Table, the header is visible but no columns are seen, this includes the column header.

In my actual codebase, I noticed that sometimes, if the width is less than 1400px, it'll actually give height to the Datatable, but I cannot make that reproducible in the Stackblitz project

Reproducer

https://stackblitz.com/edit/xf281zjf?file=src%2FApp.jsx

System Information

npmPackages:
    primereact: 10.9.6 => 10.9.6 
    react: 18.3.1 => 18.3.1

Steps to reproduce the behavior

1. Ensure scrollHeight is set to 'flex' or '100%' etc...
2. Widen the demo to be majority of the screen
3. Run code, notice there is no height on the grid
4. Sometimes for a brief moment you can see the columns appear and then disappear

Expected behavior

I feel like with this setup, I should have height on my DataTable, but it always seems to have a height of 0.

[mpearce9]

Something else to note, is that while setting the virtualScrollerOptions classname to 'h-full' does end up showing the table, resizing the window can sometimes cause the height to shrink and when you expand the window again, never takes up the full height again until a full refresh

Screen.Recording.2025-07-31.at.9.57.03.AM.mov

As you can see, as you adjust the height of the window, the height of the virtual scroller container shrinks, and as you expand it, it'll expand as well, but sometimes it stops expanding prematurely and takes hold of that smaller height with no way to fix it without a refresh. This was not an issue in 10.6.6 but seems to be an issue in 10.9.6

I'm not seeing this issue in the StackBlitz project, but one difference is that I'm running React 19 locally

[mpearce9]

I'm also noticing this spacer that is only noticeable on the page when this issue occurs

when the grind renders as it should, it seems like it shows up below the DataTable

[sja-cslab]

@mpearce9 that whole flex thing only works if the parent works with flex too.
So the parent needs display:flex at least. In case of virtualScroll i would add overflow hidden to parent too

[mpearce9]

@mpearce9 that whole flex thing only works if the parent works with flex too. So the parent needs display:flex at least. In case of virtualScroll i would add overflow hidden to parent too

If you look in the reproducer, you can see that both parents are flex as well, I did attempt the overflow-hidden in the parent to no avail. I had to edit the reproducing steps, because I was using a wide monitor originally, and realized that width seems to play a factor in whether the rows show or not with scrollheight: flex

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you with the latest version, please leave any comment, and we will keep it open. We are sorry that we have not been able to prioritize it yet. If you have any new additional information, please include it with your comment!