hypothesis / hypothesis/client
Client sometimes scrolls to wrong annotation when creating a new annotation
- Dominant language
- Mustache
- Stars
- 730
- Forks
- 224
- PR merge metrics
- No merged PRs in 30d
Description
**Steps to reproduce:**
nb. In the steps that follow, "annotation" does not include page notes. ie. It must be an annotation with an associated quote in the page.
1. Ensure annotations in the sidebar are sorted by Location (this is the default)
2. Create several annotations on a page, enough that the sidebar has maybe two or three screens of scrollable content.
3. Create an annotation at the bottom of the page and enter some text, but don't save it.
4. Scroll the sidebar up to the top
5. Create another annotation of content that is just above the content from step (2), so that the annotation in the sidebar should appear just above the one from step (2). Again, enter text but don't save it.
**Expected result:**
When the new annotation is created in Step 5, the sidebar scrolls to the correct annotation card and focuses the input field.
**Actual result:**
The sidebar can end up scrolling to a different annotation, the one created in step 2.
**Notes:**
When a new annotation is created, two effects related to scrolling of the sidebar happen:
1. The `ThreadList` will attempt to scroll to the newly created annotation
2. When `MarkdownEditor` components are mounted, they will focus their input field if visible
Due to `ThreadList`'s virtualization, `MarkdownEditor` components get unmounted after they are scrolled off-screen. Therefore in step 5, what happens is:
1. The `ThreadList` scrolls to the location of the new annotation
2. As a side effect, this scrolls the annotation card for both new, unsaved annotations into view
3. The `MarkdownEditor` input field for the annotation created in step (5) is created first, because it is above the one from step (2). It focuses its input field on mount.
4. The `MarkdownEditor` input field for the annotation created in step (2) is focused second, stealing focus away from the input field focused in the previous step and causing the scroll position to change.
In order to resolve this, we'll need some coordination between the `ThreadList` and the `MarkdownEditor` to avoid this focus conflict.
Originally reported on Slack here: https://hypothes-is.slack.com/archives/C1M8NH76X/p1589999241398200
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.