Images with incorrect metadata should correct their depiction in the timeline once the image has actually been loaded

[su-ex]

Steps to reproduce

As of matrix-org/matrix-react-sdk@7b6536c#diff-265bce8083cb791022167e130a59ebba99e3e974d9d3120f953ed41461b0f22a (edit: this was also a problem before with max-width and max-height in the same line which led to cut images) there's a problem with some exif rotated images due to the aspect-ratio and some clients sending swapped out w/h which makes css aspect-ratio have swapped w/h:

Some clients:

  "content": {
    "body": "left.jpg",
    "info": {
      "size": 3874,
      "mimetype": "image/jpeg",
      "w": 480,
      "h": 640,
      "xyz.amorgan.blurhash": "T3TI,axu~qofj[t7~qof00-;ayM{"
    },
    "msgtype": "m.image",
    "url": "mxc://supercable.onl/UIEMyFcdPHvVWaCpOScbCOuk"
  }

Other clients with swapped out w/h:

  "content": {
    "body": "left.jpg",
    "info": {
      "size": 3874,
      "mimetype": "image/jpeg",
      "w": 640,
      "h": 480,
      "xyz.amorgan.blurhash": "T3TI,axu~qofj[t7~qof00-;ayM{"
    },
    "msgtype": "m.image",
    "url": "mxc://supercable.onl/UIEMyFcdPHvVWaCpOScbCOuk"
  }

What happened?

What did you expect?

Right css aspect-ratio, at least after image has been loaded.

[dbkr]

I'm finding it a bit hard to tell but it looks like the image has been cropped - is that what's being demonstrated here? Probably we should letterbox it within the advertised container size?

[su-ex]

Before the mentionend commit it has been cropped, now it's size reduced and not well aligned.
In each of the screenshots is the second image the one with the swapped w/h.

[su-ex]

This is the timeline before the aforementioned commit:

[dbkr]

Reducing the size of the image seems to me to be a better way to handle this than cropping it though?

[su-ex]

Well, this doesn't change that it's misaligned.
This is fine while the image is not loaded, but it should be properly aligned when it is loaded.

[dbkr]

OK - I've tried to update the description to reflect the problem, although still not really sure I've got it right. In particular with message bubbles - if your first screenshot is with message bubbles then it looks like the image is in the centre of the bubble which seems reasonable?

[su-ex]

Yes, "incorrect metadata" probably fits best because it's likely still an issue when w and/or h are just plainly wrong instead of just swapped.
With the second part – I think I can't agree. It depends on the surrounding layout how it will look in the end.
I'd suggest "Images with incorrect (w/h) metadata should correct their depiction (in the timeline) once the image has actually been loaded" (I've avoided "size" as this is also a property of the metadata but can be ignored here).