Fix scroll position while loading comments

What does this MR do and why?

Fix scroll position while loading comments

If you link directly to a comment we load that first. Keeps track of scroll position so content can be loaded above.

It still jumps a little, especially if you are scrolling at the moment new notes are loading in.

Code changes summary

  1. Removed shouldScrollToNote prop, all scrolling is handled by the listener
  2. Adding a cleanup function to remove listeners when all notes are loaded
  3. Reworked scrollToTargetOnResize function. It used to stop listening if user interacted with the page. This was to prevent hijacking scrolling. Now it tracks scroll changes, then adds an offset when sticking the element to the top, which keeps it in (approx..) the same place when content is added above it.

Screenshots or screen recordings

scrol

How to set up and validate locally

  1. add lots of comments to an issue or work item (helpful scripts)
  2. click on the timestamp of one to link to it directly
  3. refresh the page
  4. scroll up and down a bit while it is loading
  5. When page finishes loading, try adding/editing a comment and make sure we aren't still stealing scroll position
Edited by Simon Knox

Merge request reports

Loading