Page MenuHomePhabricator

Table of contents code does not show on Timeless on mobile domain in tablet mode
Closed, ResolvedPublic

Description

The contents headline show up, but there's no link to show the TOC. I can reproduce this on Firefox (57.0.1 on both Ubuntu and Android) and Chrome (Ubuntu, 62.0.3202.94).

Developer notes

  • There are styles in skins.minerva.tablet.styles and skins.minerva.base.styles relating to 'toc-mobile' in Minerva. Move these to a new style module in MobileFrontend called "mobile.init.styles" that loads on page load for all mobile pages (including Timeless mobile) and remove them in Minerva
  • Move skins.minerva.tablet.scripts/toc.js to MobileFrontend's mobile.init module so it runs on Timeless mobile.

Details

Related Gerrit Patches:
mediawiki/extensions/MobileFrontend : masterRemove table of contents handling
mediawiki/extensions/MobileFrontend : masterMove Toggling and TableOfContents from Minerva to MobileFrontend

Event Timeline

Isarra added a subscriber: Isarra.Dec 5 2017, 4:36 PM

What project is this on?

Isarra added a comment.Dec 5 2017, 5:08 PM

Thank you, looks like it's a compatibility issue with mobilefrontend.

Isarra added a comment.Dec 5 2017, 5:11 PM

(The issue does not occur on mobile resolutions without going through MF. See: https://en.wikipedia.org/wiki/Yellowhammer?useskin=timeless which does not have the ToC issue, but also lacks all the other MF content improvements.)

Jdlrobson added a subscriber: Jdlrobson.

Yeh this is done by the MobileFormatter inside MobileFrontend and done purposely as the desktop table of contents doesn't make sense in this medium and detracts from the reading experience by pushing content down. A placeholder is left for skins to do as they wish. A section collapsing or a JavaScript based approach is encouraged there instead but is up to skin developer.

It will only happen for the mobile version of the skin (the '.m' domain).

Based on what we discussed, is it actually possible to do it without js currently?

Not right now, but we're still actively trying to find a good solution for table of contents on mobile. T193772 is making some progress in this area right now.

I think this is an unfortunate biproduct of MobileFrontend and Minerva being split. In current state toc-mobile should be optional and opt-in. It should be hidden by default and revealed by skinStyles. My advice here would be to make the MobileFrontend mobile.toc hide ".client-js .toc-mobile {" by default and add a skinStyle for Minerva that reveals this. This would hide the table of contents from Timeless. I could also do this, but it might get done quicker if you want to submit a patch.

Once that's done, I'd advise waiting for us solve this across all mobile skins - this doesn't seem like a Minerva/Timeless-only problem. You should of course feel free to add table of contents handling via JavaScript if you so wish.

Jdlrobson updated the task description. (Show Details)Oct 31 2018, 4:54 PM
Jdlrobson added a subscriber: Volker_E.

this came up today in a code review with @Volker_E
The issue here is that MobileFrontend should be shipping a stylesheet (and loading the table of contents code) for all skins on the mobile design, since it strips the desktop table of contents.

Currently that responsibility is being split between Minerva and MobileFrontend.

Jdlrobson renamed this task from No way to show TOC in mobile view to Table of contents code does not show on Timeless on mobile domain in tablet mode.Nov 2 2018, 3:17 PM
Prod added a subscriber: Prod.Dec 8 2018, 8:56 PM
Isarra moved this task from Backlog to Compatibility on the Timeless board.Aug 16 2019, 8:16 PM

Change 533356 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Move Toggling and TableOfContents from Minerva to MobileFrontend

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

Change 533356 abandoned by Jdlrobson:
Move Toggling and TableOfContents from Minerva to MobileFrontend

Reason:
While doing this inspired by a new idea..

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

Change 533363 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Remove table of contents handling

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

Change 533363 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Remove table of contents handling

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