search

marchaos / react-virtualized-sticky-tree

A React component for efficiently rendering tree like structures with support for position: sticky
MIT License
151 stars 12 forks source link

The last node from list does not render in DOM #16

Closed sanketjo96 closed 4 years ago

sanketjo96 commented 4 years ago

Observed the issue where last node does not render in DOM.

As per my observation in spacial cases like above, during forwardSearch this.currentPos stays at same value which then prevents call to this.storeRenderTree to trigger re-render.

Things which are causing render of last node -

Not sure of any better way to handle this so that it will work for all cases. Please add your thoughts as well. It might be related to the issue [https://github.com/marchaos/react-virtualized-sticky-tree/issues/15]()

sanketjo96 commented 4 years ago

@marchaos Updated the sandbox to showcase the issue

sanketjo96 commented 4 years ago

Hey, just wanted to check, did you look at this. currentPos stays at same value during scrolling.

marchaos commented 4 years ago

Hey, sorry for the late reply. I've been trying to fix this, but realised that the heights of your nodes don't look right, due to borders, which is confusing the library. When you specify the heights of nodes, this needs to include border height as well, unless you use box-sizing: border-box. So you can either specify the node height including borders, or make sure you're usng border-box syling for nodes.

I had a quick play with it and it does seem much better.

sanketjo96 commented 4 years ago

Sorry for late comment. I've removed borders, but still issue exists. Last node does not render 7 out of 10 times when you scroll to bottom.

https://codesandbox.io/s/frosty-shadow-nnghy?fontsize=14&hidenavigation=1&theme=dark

Can you see blank space in place of child 10 after scrolling ?

sanketjo96 commented 4 years ago

@marchaos Hey Marc, please have a look once you get chance. I know this has been closed. But wanted above example to run by you.