Ag-grid disappears when you click the filter icon and popup opens

Question

I am using the ag-dark theme for ag-grid in react typescript.

Using floating filters is ok as they are all built into the grid, however when I click on the filter icon next to each column, it opens the popup showing the options for selecting the filter, however only the popup shows, the actual grid behind it vanishes, as if I have set div display to none. So the popup is just floating on an empty background.

When I close the popup, the grid returns.

Why might this be happening?

Answer 1

I had the same issue, I found that the ag-popup layer covered the whole grid. This CSS fixed the issue for me:

.ag-theme-balham.ag-popup {
  position: absolute;
}