element-hq / element-hq/element-web
Uploading an image jumps the timeline erratically
- Dominant language
- TypeScript
- Stars
- 13.5k
- Forks
- 2.8k
- PR merge metrics
- PR metrics pending
Description
#### Description
Whenever im sending a picture, and i've scrolled to the bottom, the timeline jumps up and down late into the "uploading process"
#### Steps to reproduce
- scroll to bottom
- upload image
- observe jumping
#### Video
Videos
First one, though this one is a bit confusing, as the same image is uploaded as is lately visible in the timeline.
https://user-images.githubusercontent.com/22740616/125939334-3a034dd0-6e7d-4bcb-b41d-f5b563b04380.mp4
Second one, which takes a bit longer, and has the effect dimmed somewhat at the start.
https://user-images.githubusercontent.com/22740616/125940533-4bc465d8-a1b9-4307-9976-a09080b4faa5.mp4
#### Describe how what happens differs from what you expected.
Currently the timeline has to jump up when the image is starting to get uploaded (often with a delay), and then jump down when it's done and sent.
The jump up is disorienting because first a bottom part of the timeline is covered before the whole timeline moves up somewhat,
And the jump down is disorienting because, after viewing messenger timelines for ages and ages, jump-downs are associated with message deletion, and i've found myself often instinctively panicking when an image finally uploads, after the timeline moves down, as i thought that someone had deleted a message i havent read yet.
#### Describe an alternative
Maybe something like discord, which encapsulates the upload progress into one pseudo-message (one jump-up, as that message is getting placed), and then shows the media in full if it's displayable (another jump-up, as the message is finished);
Video
https://user-images.githubusercontent.com/22740616/125941175-e5d8596a-b0c4-41eb-b903-1a40a1fc320d.mp4
#### Version information
- **Platform**: desktop
- **OS**: Linux
- **Version**: 1.7.32
Contributor guide
Research direction
Reproduce the issue on the desktop client using the listed scroll-to-bottom and image-upload steps, then trace the timeline rendering during the upload lifecycle. Done means uploading an image no longer causes the timeline to jump erratically or move unexpectedly when the upload completes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100