Presumably this would also break on new or renamed sections.

This would require changes to Toggler.js to add an API (JS or CSS) to expand all/specific sections.

We have the .collapsible-headings-collapsed CSS API (which defaults to collapsed), but that can only be set on document.body. We could expand that to include .collapsible-headings-expanded and allow it to be on any ancestor.

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

[mediawiki/extensions/MobileFrontend@master] Toggler: Expand auto-expand/collapse CSS API

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

Can you expand the use case a bit more here? Right now we explicitly run the toggle code on the preview, but we don't have to do that? I'm not sure why we need an API for this.
The use of a CSS API seems a little fragile for this use case, so ideally I think the code adding the toggles would instead be told to initialize as expanded by default.

Other options to consider

1. Modify the hook so that headings are only collapsed on the first firing of the hook:

https://github.com/wikimedia/mediawiki-extensions-MobileFrontend/blob/master/src/mobile.init/toggling.js#L39

2. Use a different hook relating to the preview to expand sections.

e.g.

mw.hook( 'editPreview' ).add( function ( $container ) {
   toggler.expandAllSections();
} );

Right now we explicitly run the toggle code on the preview, but we don't have to do that?

Not quite, we run the wikipage.content hook which does many things, one of which is adding collapsible headings. We want the headings to render as collapsible by default, but be expanded.

Modify the hook so that headings are only collapsed on the first firing of the hook:

Also if the page updates dynamically after a VE save, we run wikipage.content hook again and would expect the headings to be collapsed by that. This also seems inflexible. A different preview (e.g. a full page preview) may decide it does want headings collapsed.

Use a different hook relating to the preview to expand sections.

We don't really have a way of fetching the correct toggler instance, nor are there any existing JS APIs.

Toggler already contains numerous CSS APIs, I don't think adding one more is a big problem. Converting them all to JS APIs seems like a good idea, but also much more work that we have time for right now.

Not quite, we run the wikipage.content hook which does many things, one of which is adding collapsible headings.

Also, as an aside, Toggler seems to have been written while unaware of wikipage.content possibly running multiple times on different content areas, because it currently causes id/aria-controls collisions whenever that happens.

Not quite, we run the wikipage.content hook which does many things, one of which is adding collapsible headings. We want the headings to render as collapsible by default, but be expanded.

Okay got it.

Also, as an aside, Toggler seems to have been written while unaware of wikipage.content possibly running multiple times on different content areas, because it currently causes id/aria-controls collisions whenever that happens.

I don't think we considered the case that wikipage.content was ran in other situations and we were targeting edit previews (and possibly JS page reloads - I forget if we supported those back in the day). I think it was an oversight on our part that it ran in other places.

Would it be possible to revisit the approach with the existing hook and instead create a MobileFrontend specific hook relating to the MobileFrontend editor for this situation with a parameter that allows you to decide whether to start expanded or collapsed?

FWIW The Toggler code is pretty bad technical debt for the web team, given the complexities it includes relating to "remembering" defaults and how it functions with hash fragments so we'd love to revisit this code at some later point.

Change 960099 merged by jenkins-bot:

[mediawiki/extensions/MobileFrontend@master] Toggler: Expand auto-expand/collapse CSS API

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