Hi. The customizable collapsible elements are broken now. I was told that maybe it's because of hidden="until-found" introduction patch. I'm starting with more complicated example to show why it's impossible to work this way, the minimal example is later below.
- Create a small example. It has interchangeable button "show"/"hide" and hidden line in a table, that can be shown or hidden again. A custom mark is "mark".
<div><span class="mw-customtoggle-mark mw-collapsible" id="mw-customcollapsible-mark">show them </span><span class="mw-customtoggle-mark mw-collapsible mw-collapsed" id="mw-customcollapsible-mark">hide them</span></div> {| class="wikitable mw-collapsible" ! name |- | A |- class="mw-collapsible mw-collapsed" id="mw-customcollapsible-mark" | B |- | C |}
- Expected: You can see a "show" button, click on it and get a "hide" button instead, and vice versa.
- Got: You always see a "showhide" compound button, that works like both interchangeably.
To fix this, it's enough to add "mw-collapsible" class to the div in the beginning of the code:
<div class=mw-collapsible><span class="mw-customtoggle-mark mw-collapsible" ...
But it creates a collapsing button to the collapsing button. I needed to add templatestyles to the wanted button with display:none to unwanted button.
The other way to fix it is replacing span by div. For example, the code
<span class="mw-customtoggle-mark mw-collapsible">button</span> <span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-mark">Text</span>
does not work, but the code
<span class="mw-customtoggle-mark mw-collapsible">button</span> <div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-mark">Text</div>
does, just like the code
<span class="mw-customtoggle-mark mw-collapsible">button</span> <span class="mw-collapsible"><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-mark">Text</span></span>
Thank you.