Fix scroll bugs for active work item notes

What does this MR do and why?

Fixes #481336 (closed)

  • prevent jumping back to selected note when updating notes (reacting to one, or when they are edited)
  • scroll to selected note as soon as it loads, rather than after all have loaded
  • moved the scrollTo call to a single note (only the active one), rather than calling it from the list component

Screenshots or screen recordings

Before After
jump no jump

How to set up and validate locally

  1. Go to any work item with long thread of comments
  2. Copy any note link (click on the timestamp or "copy link to comment" and open it)
  3. Check that the page scrolls to that target
  4. Now, react to any other comment/resolve any other thread, or leave a new comment.
  5. See that this does not jump the page.

Snippet to grab last work item you have and add 200 comments to it:

issue = WorkItem.last

100.times do |i|
 issue.notes.create!(
   note: "This is comment #{i + 1} with some words in it to pad out the page and try to mess with the scroll position or just to give you something to read while it loads.",
   project: issue.project,
   author: User.first
 )
end

puts "URL: #{Gitlab.config.gitlab.url}/#{issue.project.full_path}/-/work_items/#{issue.iid}"
Edited by Simon Knox

Merge request reports

Loading