element-hq / element-hq/element-web

Sticker label position with "Default" "Image size in the timeline"

Open
#22,624 0 comments 0 reactions 0 assignees View on GitHub
A-Media A-Timeline O-Uncommon S-Tolerable T-Defect X-Needs-Investigation
Dominant language
TypeScript
Stars
13.5k
Forks
2.8k
PR merge metrics
PR metrics pending

Description

### Steps to reproduce

This happens for one certain sticker that exceeds the "default" image size in the timeline.

1. Send a custom sticker using https://github.com/maunium/stickerpicker
```json
"content": {
"body": "Possibly",
"info": {
"h": 306,
"mimetype": "image/jpeg",
"size": 38952,
"thumbnail_info": {
"h": 306,
"mimetype": "image/jpeg",
"size": 38952,
"w": 300
},
"thumbnail_url": "redacted",
"w": 300
},
"url": "redacted"
}
```

Here is the mediainfo of the image in question:
```
Image
Format : JPEG
Width : 300 pixels
Height : 306 pixels
Color space : YUV
Chroma subsampling : 4:4:4
Bit depth : 8 bits
Compression mode : Lossy
Stream size : 38.0 KiB (100%)
ColorSpace_ICC : RGB
```

In particular, the image is displayed smaller (narrower) than another sticker that has a width of 265 px. The "default" setting of appearance -> "image size in the timeline" scales it down.

Inspecting both stickers with chrome devtools reveals an element gets inserted on hover. It has a `style=left: 300px` set for the broken sticker, and 265 px for the working sticker, apparently matching the `w` field from the event. It appears that this does not get scaled down to match the scaling of the image itself.

### Outcome

#### What did you expect?
usually, the label appears right next to the sticker.

this is with "large" "image size in the timeline" setting:
![image](https://user-images.githubusercontent.com/2803622/174624892-ab315484-18eb-490f-9687-bd670ac3ec6b.png)

#### What happened instead?

https://user-images.githubusercontent.com/2803622/174624983-d2e14945-a74c-4e47-86af-8ca9926d423c.mp4

(recording is sluggish due to open dev tools)

### Operating system

arch

### Application version

Element Nightly version: 2022061501 Olm version: 3.2.8

### How did you install the app?

aur

### Homeserver

_No response_

### Will you send logs?

No

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.