Page MenuHomePhabricator

Page scrolls horizontally when AMC is enabled
Closed, ResolvedPublic0 Estimated Story Points

Description

The -12px right margin on .minerva-user-navigation renders beyond the page area, triggering horizontal scroll:

image.png (238×433 px, 16 KB)

QA Results - Beta

ACStatusDetails
1T343908
2T343908#9081336
3T343908#9085304

Event Timeline

Esanders triaged this task as High priority.Aug 9 2023, 3:52 PM

This has a knock-on effect on position:sticky content, like the new topic button in DiscussionTools, which is now too low:

image.png (873×431 px, 68 KB)

Looks related to current web team work so moving onto board for investigation.

Change 947420 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/MinervaNeue@master] Any header overflow should be hidden

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

Jdlrobson lowered the priority of this task from High to Medium.Aug 9 2023, 7:10 PM

Change 947420 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Any header overflow should be hidden

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

Status:❌ Fail
Environment: Beta
OS: macOS Ventura
Browser: Chrome
Device: MBP
Emulated Device: via Developer Tools
Test Links:
https://en.m.wikipedia.beta.wmflabs.org/wiki/Talk:Main_Page
https://en.m.wikipedia.beta.wmflabs.org/w/index.php?title=Special:MobileOptions&returnto=Bear

❌ AC1: T343908- Horizontal scroll beyond the page area at random times when moving left/right. Though horizontal scrolling was on my mouse side scroller, not touch so not sure how you want to proceed with that.
https://en.m.wikipedia.beta.wmflabs.org/wiki/Talk:Main_Page

T343908_PageScroll_Minerva.png (824×833 px, 79 KB)

❌ AC2: T343908#9081336- Add Topic not centered
https://en.m.wikipedia.beta.wmflabs.org/w/index.php?title=Special:MobileOptions&returnto=Bear

T343908_PageScroll_Minerva_AddTopic.png (844×766 px, 104 KB)

Change 947444 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):

[mediawiki/skins/MinervaNeue@master] Fix header overflow style causing header buttons from being cut off

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

Change 947420 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Any header overflow should be hidden

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

The first thing to consider when adding overflow:hidden is if the elements has any popups attached that break the bounding box. In this case the user menu popup will get completely truncated.

Change 947455 had a related patch set uploaded (by Esanders; author: Esanders):

[mediawiki/skins/MinervaNeue@master] Revert "Any header overflow should be hidden"

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

Change 947455 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Revert "Any header overflow should be hidden"

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

Change 947444 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Fix header overflow style causing header buttons from being cut off

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

Status:✅ PASS
Environment: Beta
OS: macOS Ventura
Browser: Chrome
Device: MBP
Emulated Device: via Developer Tools
Test Links:
https://en.m.wikipedia.beta.wmflabs.org/wiki/Talk:Main_Page
https://en.m.wikipedia.beta.wmflabs.org/w/index.php?title=Special:MobileOptions&returnto=Bear

✅ AC1: T343908- Horizontal scroll beyond the page area at random times when moving left/right. Though horizontal scrolling was on my mouse side scroller, not touch so not sure how you want to proceed with that.
https://en.m.wikipedia.beta.wmflabs.org/w/index.php?title=Special:MobileOptions&returnto=Bear

T343908_PageScroll_Minerva1.png (996×863 px, 94 KB)

✅ AC2: T343908#9081336- Add Topic not centered
https://en.m.wikipedia.beta.wmflabs.org/wiki/Talk:Main_Page

T343908_PageScroll_Minerva2.png (871×720 px, 79 KB)

✅AC3: Fix header overflow style causing header buttons from being cut off

Advance Mode: OnAdvance Mode: Off

Possible Issue @Jdlrobson : When logged in, "Discussion" appears. Would you want it to be horizontally centered too?

T343908_PageScroll_Minerva3.png (871×792 px, 77 KB)

Jdlrobson added a subscriber: ppelberg.

LGTM Sorry for the disruption here @ppelberg and @Esanders