Page MenuHomePhabricator

In vector-2022 large TOCs in the hidden menu are unusable when collapsed
Closed, ResolvedPublic3 Estimated Story PointsBUG REPORT

Description

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

What happens?:

  • The page layout rearranges when the TOC is scrolled toward the bottom of the screen, closing the TOC and preventing you from ever getting to the bottom
  • ADDITIONALLY, even if you reopen the TOC from the now-relocated section, the TOC extends past the viewport on the bottom of the screen, preventing you from ever being able to scroll down to the items lower on the TOC

What should have happened instead?:

  • Not sure what the "best" fix is, but suggest that dynamic section scrolling happen in the TOC, such as how the sidebar will produce a vertical scroll bar when needed

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

Other information (browser name/version, screenshots, etc.):
Originally reported on enwiki by Steue, see https://en.wikipedia.org/w/index.php?title=Wikipedia:Village_pump_(technical)&oldid=1188674279#Hidden_ToC_dis-appeares_on_it's_own_during_scrolling

QA steps

  • QA this task
  • QA T352851 and determine whether the fix here addresses that one.

QA Results - Beta

AC Status Details
1 T352930#9395326

Event Timeline

ovasileva triaged this task as High priority.Dec 7 2023, 9:10 AM

Change 981343 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/skins/Vector@master] Fix dropdown ToC not scrollable

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

This looks like a duplicate of T352851 to me.

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

[mediawiki/skins/Vector@master] Fix scrolling behavior in dropdowns

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

ovasileva set the point value for this task to 3.
Xaosflux renamed this task from In vector-2022 large TOCs that in the hidden menu are unusable when collapsed to In vector-2022 large TOCs in the hidden menu are unusable when collapsed.Dec 7 2023, 6:05 PM

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

[mediawiki/skins/Vector@master] Fix scrolling behavior in dropdowns

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

Change 981365 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Fix scrolling behavior in dropdowns

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

Jdlrobson updated the task description. (Show Details)
Jdlrobson moved this task from Code Review to QA on the Web-Team-Backlog (FY2023-24 Q2 Sprint 5) board.
Jdlrobson added a subscriber: bwang.
Edtadros subscribed.

Test Result - Beta

Status: ✅ PASS
Environment: beta
OS: macOS Sonoma
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

Go to a page that has many sections, such that the table of content expands past the body view port (on most resolutions this may be seen here: https://test.wikipedia.org/w/index.php?title=BigDockedTOC&oldid=584288&useskin=vector-2022 OR https://en.wikipedia.beta.wmflabs.org/wiki/T352930?useskin=vector-2022)
Assuming the TOC is on the sidebar, click HIDE next to it
Open the TOC from the menu next to the article title
Attempt to scroll down to see items towards the bottom of the TOC
✅ AC1: TOC should be scrollable

screenshot 190.mov.gif (1×546 px, 3 MB)

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

[mediawiki/skins/Vector@wmf/1.42.0-wmf.7] [Zebra] Fix scrolling behavior in dropdowns

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

Change 981740 merged by jenkins-bot:

[mediawiki/skins/Vector@wmf/1.42.0-wmf.7] [Zebra] Fix scrolling behavior in dropdowns

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

@RoyZuo perhaps a non zebra cached version? Does it work for you if you use this link: https://en.wikipedia.org/wiki/Quality_assurance?useskin=vector-2022&vectorzebradesign=1 ?

Though my loading in that may have reset the cache too

Test Result - Beta

Status: ✅ PASS
Environment: beta
OS: macOS Sonoma
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

Go to a page that has many sections, such that the table of content expands past the body view port (on most resolutions this may be seen here: https://test.wikipedia.org/w/index.php?title=BigDockedTOC&oldid=584288&useskin=vector-2022 OR https://en.wikipedia.beta.wmflabs.org/wiki/T352930?useskin=vector-2022)
Assuming the TOC is on the sidebar, click HIDE next to it
Open the TOC from the menu next to the article title
Attempt to scroll down to see items towards the bottom of the TOC
✅ AC1: TOC should be scrollable

❓ AC2: QA T352851 and determine whether the fix here addresses that one.

@Jdlrobson , I'm not sure this satisfies it. there is an odd behavior that if you scroll, at some point the scroll stops. If you wait a moment and resume scrolling without moving your cursor, so the TOC hasn't lost focus, it will then scroll. You can see the pause in the screen shot above. You can see the replay.io here.

ovasileva subscribed.

@bwang to create a new ticket for remaining issues and sign this off