silevis / reactgrid

Add spreadsheet-like behavior to your React app

Home Page:https://reactgrid.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Chevron unfolding produces blank table portion until further interaction

steve-ochoa opened this issue · comments

Describe the bug
This bug occurs when using a Chevron cell grid. When a Chevron is unfolded, the table is sized correctly but a number of rows at the bottom of the table appear blank. When another interaction occurs, e.g. another chevron is unfolded, user scrolls horizontally, or window resized, then the blank rows magically appear.

Current behavior
I produced the behavior using the ReactGrid website Budget Planner example here.
I added many child rows at several levels in the hierarchy of the grid. When I click the Chevron icon to unfold a cell and display its children, there is a large portion left blank at the bottom of the table. The table is sized correctly, so it is clear that the rows are not supposed to be blank.
Then when using the scroll bar, resizing the window, or interacting with other Chevrons, the blank rows at the bottom of the table magically appear.
Unfolding and folding Chevrons produces similar blank portion at the bottom of the table with further interactions. Likewise, scrolling/chevron unfolding/window resize causes the blank rows to magically appear. So it appears it's not just a one-time initial render issue.
It may be in the helper functions for that specific Budget Planner example, I'm unsure.

Expected behavior
When clicking a Chevron to unfold, all rows in the table should be rendered. There should be no blank portion at the bottom.

Screenshots or gifs
render_bug_ex4

Your environment details

  • Device: Desktop
  • OS: macOS
  • Browser: Chrome

Hi! I investigated the issue and, as you've reported, some rows stay invisible after toggling the chevron on the examples page. Unfortunately I couldn't reproduce it outside our website. I copied that example's source to our project and it works as intended.

chrome_C6Xwe40n2C

Have you experienced similar problems outside our page? If so please let us know.