Page MenuHomePhabricator

Long captions are being displayed differently than short captions
Closed, ResolvedPublicBUG REPORT

Description

User story: N/A

We have this:

Long captions are being handled in a different way than shorter ones, as you can see in this screenshot.

Screenshot 2019-04-26 12.28.54.png (462×1 px, 80 KB)

The language label being positioned on the line above the caption should only be applicable to smaller widths (i.e., mobile screens).

We want this:

Long captions should be handled on wider widths just the same as shorter captions. In the screenshot above, the long caption should start at the same position as the shorter one.

Acceptance Criteria:

  • Long captions should be handled the same as short captions.

QA Results

QA Results - Production

Event Timeline

Change 562621 had a related patch set uploaded (by Anne Tomasevich; owner: Anne Tomasevich):
[mediawiki/extensions/WikibaseMediaInfo@master] Ensure caption layout is consistent regardless of caption length

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

Change 562621 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Ensure caption layout is consistent regardless of caption length

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

Edtadros subscribed.

Test Result

Status: ✅ PASS
OS: macOS Catalina
Browser: Chrome
Device: MBP
Emulated Device: iPhoneX

Test Artifact(s):

QA Steps: Long captions should be handled the same as short captions. Test in Beta, test short and long caption. Should test on both mobile and desktop. Test RTL as well.

✅ AC1: Mobile:

T221975-1.png (2×1 px, 536 KB)

✅ AC2: Desktop:

T221975-2.png (2×1 px, 969 KB)

✅ AC3: RTL Mobile:

T221975-3.png (2×1 px, 260 KB)

✅ AC4: RTL Desktop:

T221975-4.png (2×1 px, 704 KB)

This is ready to be tested on production Commons.

Test Result - Prod

Status: ✅ PASS
OS: macOS Catalina
Browser: Chrome
Device: MBP
Emulated Device: iPhoneX

Test Artifact(s):

QA Steps: Long captions should be handled the same as short captions. Test in production, test short and long caption. Should test on both mobile and desktop. Test RTL as well.

✅ AC1: Mobile:

commons.m.wikimedia.org_wiki_File_Malibu-superbloom.jpg(iPhone X).png (2×1 px, 1 MB)

✅ AC2: Desktop:

commons.wikimedia.org_wiki_File_Malibu-superbloom.jpg(iPad Pro).png (2×2 px, 2 MB)

✅ AC3: RTL Mobile:

commons.m.wikimedia.org_wiki_File_Malibu-superbloom.jpg_uselang=he(iPhone X).png (2×1 px, 1 MB)

✅ AC4: RTL Desktop:

commons.wikimedia.org_wiki_File_Malibu-superbloom.jpg_uselang=he(iPad Pro).png (1×864 px, 1002 KB)

Tested on production (desktop and mobile) and it's ready to go.