Page MenuHomePhabricator

[Request] Feature parity between new collapsible buttons and NavFrames
Open, Needs TriagePublic

Description

Follow-up to T167522. All links are to enwiki.

The mw-collapsible class in MediaWiki core is supposed to replace the old collapsible class and NavFrames, both deprecated gadgets. However, there are two issues which hinder the replacement of NavFrames:

  • There is no way to align the new buttons to the left (to the right for RTL wikis), at least without some creative hacks (and even then only in tables and not in divs). (NavFrames also require a hack, but this can be done without any weird visual output most of the time and it works in divs.) Template:Routemap currently uses a hack where a fake empty header cell is placed on the left side of a table, and the JS inserts the button there instead of in the rightmost cell.
  • Centred header text in NavFrames doesn't move when the button is clicked. A separate div with a margin to the left and right was required for this in Template:Navbox (it uses a table, but same thing happens in divs; see Template:Hidden/testcases).

One blocker to the replacement of the old collapsible class was that the new button couldn't have its colour changed and didn't display well on coloured backgrounds, but this was solved by @TheDJ using this one weird trick in MediaWiki:Common.js. This is not in standard MediaWiki, but should be relatively easy to implement once TemplateStyles is enabled (some time after June 2018).

Event Timeline

Jc86035 created this task.Jun 12 2017, 10:55 AM
Jc86035 updated the task description. (Show Details)
Volker_E added a subscriber: Volker_E.EditedJun 12 2017, 3:42 PM

@Jc86035 Do you have a real-world example of the buttons failing right now?

@Volker_E the buttons are not failing right now, since the old ones have not yet been replaced.

I changed Template:Hidden begin/sandbox to use the new classes instead of NavFrame (although I haven't done any formatting like making the header bold by default). Results are at Template:Hidden/testcases.

@TheDJ has implemented another workaround in enwiki's Common.css.

TheDJ added a comment.Jun 14 2017, 7:58 AM

Hmm, the biggest problem i keep running into with this, is that it is way too hard to distinguish a simple generated [show] [hide] toggle, from any of those with custom UI but that are not 'foreign' to it and therefor do not carry the mw-customtoggle class...

I've now resulted to targeting it using .mw-parser-output .mw-collapsible-toggle.. But that doesn't seem ideal either.

Would it be possible for the new class to also make the collapsible button display on the left side of tables, like the original collapsible class? (I suppose Routemap could use mw-collapsible for right-side display and collapsible for left-side display, but that doesn't seem ideal.)

@TheDJ am seeing some JS errors on test wiki on all pages relating to this which is impacting some testing that's going on. Is this something to be worried about given the recent changes to collapsing ? cc @Volker_E @Etonkovidova

TheDJ added a comment.May 8 2018, 9:08 PM

@Jdlrobson oh woops.

Right, forgot that jquery.makeCollapsible isn't guaranteed to be preloaded. fixed

@TheDJ and @Jdlrobson - Seems to be fixed. Thx!

Jc86035 updated the task description. (Show Details)May 10 2018, 2:35 PM
stjn added a subscriber: stjn.May 19 2018, 12:23 PM