Page MenuHomePhabricator

Portrait images are shown as landscape image in commons widgets for mobile preview.
Closed, ResolvedPublicBUG REPORT

Description

Steps to replicate the issue (include links if applicable):

  • Open mobile preview that has commons widget
  • Scroll over to the widget

What happens?:

Portrait images are shown in landscape format.

mobile preview bug.png (2×1 px, 1 MB)

What should have happened instead?:

Each image should maintain its aspect ratio. See mock here. Image will only be cropped when its larger than the visiible space.

Software version (skip for WMF-hosted wikis like Wikipedia):

Other information (browser name/version, screenshots, etc.):

Event Timeline

Tested on master after the above Patch was merged and working as expected

image.png (297×247 px, 62 KB)

@SimoneThisDot - I'm checking on beta and the search previews still display images in landscape mode. For example - &quickView=Cat

hei Elena,

I have checked on Beta and I cannot reproduce the issue:

This is what I see from the link you pasted above (link):

image.png (1×2 px, 795 KB)

if you give me the link of some of the images that are not working, I can check it out for you

hei Elena,

I have checked on Beta and I cannot reproduce the issue:

This is what I see from the link you pasted above (link):

image.png (1×2 px, 795 KB)

if you give me the link of some of the images that are not working, I can check it out for you

Re-checked - no issues found; I guess I was checking when the fix was not fully merged.

hei Elena,

I have checked on Beta and I cannot reproduce the issue:

This is what I see from the link you pasted above (link):

image.png (1×2 px, 795 KB)

if you give me the link of some of the images that are not working, I can check it out for you

The link will display the article cards differently depending on a browser.

FF 109Chrome 109
The Responsive mode is displayed; the article card is stretched
Screen Shot 2023-01-30 at 4.54.12 PM.png (1×1 px, 456 KB)
Devtools mobile view needs to be enabled; the card is not stretched
Screen Shot 2023-01-30 at 5.00.10 PM.png (640×562 px, 127 KB)

Testing on real devices

iPhone 11 - Safari and ChromeSamsung Galaxy S8 - FirefoxSamsung Galaxy S8 Firefox - Chrome CORRECT
899A49C1-1C85-4951-88E9-78C9E01500FF.png (1×828 px, 945 KB)
Screenshot_20230130-170535_Firefox (1).jpg (2×1 px, 502 KB)
Screenshot_20230130-170608_Chrome (1).jpg (2×1 px, 479 KB)

@Etonkovidova @matthiasmullie is this a duplicate of T328095? If not, please move back to Doing so this can be addressed.

@Etonkovidova @matthiasmullie is this a duplicate of T328095? If not, please move back to Doing so this can be addressed.

The fix in T328095 might fix this issue too, but it'd be helpful to keep this task as open to check it after the T328095 fix is merged.

After checking T328095: Mobile quick view - issues with displaying article card - the issue is still present. I'll do more checking in production.

Change 885739 had a related patch set uploaded (by Simone Cuomo; author: Simone Cuomo):

[mediawiki/extensions/SearchVue@master] Portrait images are shown as landscape in commons widgets for mobile

https://gerrit.wikimedia.org/r/885739

I have investigated this further and actual development was required. I have completed the following (now in review):

  • Ensure portrait images shows correctly on Desktop (both main image and commons)
  • Ensure portrait images shows correctly on Mobile (both main image and commons)
  • Ensure landscape image shows correctly on Desktop (both main image and commons)
  • Ensure landscape image shows correctly on Mobile (both main image and commons)

The above has been replicated for:

  • chrome
  • firefox
  • safari
  • pixel 5
  • Iphone 14
  • iphone 8

Change 885739 merged by jenkins-bot:

[mediawiki/extensions/SearchVue@master] Portrait images are shown as landscape in commons widgets for mobile

https://gerrit.wikimedia.org/r/885739

Checked on pilot wikis idwiki, ptwiki, and ruwiki.