Page MenuHomePhabricator

Parsoid breaks html div in template if this is used with indentation (i.e. in a description list)
Closed, DuplicatePublicBUG REPORT


Steps to replicate the issue:

I do not know. Probably some template and a page using this template has to be created in a test wiki.

What happens?:

In German Wikipedia there is the template Vorlage:FNBox (link to most recent version at time of writing). This contains essentially this code (slightly shortened):

<div class="fussnoten-box">
<div class="fussnoten-linie"></div>

Actually, TemplateStyles are loaded before, but I’ve checked that this is unimportant for the issue.

When this template is used with indentation, so in fact inside of a description list, Parsoid adds a spurious ending </div> tag in first line after <div class="fussnoten-box">, adds the description list end tags behind this, and discards the existing </div> tag at template end. This breaks the intended template usage and provokes lint error messages.

Confer this real example: Live at the Greek Theater 2019 (latest version before my change). This is the wiki source:

:{{FNBox|{{FN|∗}} Richard Starkey ist der Geburtsname von Ringo Starr}}

The produced web source is this (remember: TemplateStyles included):

<dl><dd><link rel="mw-deduplicated-inline-style" href="mw-data:TemplateStyles:r233473749"/><div class="fussnoten-box"></div></dd></dl>
<div class="fussnoten-linie" aria-hidden="true" role="presentation"></div>
<p><link rel="mw-deduplicated-inline-style" href="mw-data:TemplateStyles:r233473749"/>&#8288;<sup class="fussnoten-marke reference" id="FN_∗_back"><a href="#FNZ_∗"></a></sup> Richard Starkey ist der Geburtsname von Ringo Starr

There is no ending div tag after the paragraph end where it belongs and which is existent in the template code.

The content of FNBox, here another template followed be some inline text, is actually not important here. This may have been different in former template versions. Putting the content in a paragraph here is wanted Parsoid behaviour.

Until very recently the empty div, now called “fussnoten-linie“, came before the box div:

<div class="fussnoten-linie"></div>
<div class="fussnoten-box">

The description list tags had been added after this empty div which just creates a line (now by TemplateStyles CSS, until about a month ago by inline styles) and left the box div alone. Hence this issue very probably had not been recognized by people, because this just caused the line to be indented and did not let the pages appear on Special:LintErrors. Note that here also was no line break between the divs. This had to be changed, though, due to another behaviour issue in combination with floating contents.

For what it's worth: Just before publishing I noticed that the same issue occurs with <poem>. Try this and look at the generated html source:

A Hard Day’s Night
Tomorrow never knows.

But <syntaxhighlight> works:

:<syntaxhighlight lang="c">
main(){return!puts("Hello, World!");}

This caused me to test the template code directly:

:<div class="fussnoten-box">
<div class="fussnoten-linie"></div>
Test text.

And it breaks, too.

This would work, but is not an option as workaround for the template due to the actual varying content:

:<div class="fussnoten-box"><div class="fussnoten-linie"></div>Test text.</div>

What should have happened instead?:

I’d expect that the end tags for description lists would be placed after the template content or more general after the existent div end tag, not in the middle of the code.

Other information (browser name/version, screenshots, etc.):

I am actively using Firefox, at time of writing in versions 112.0.2 and 113.0, but noticed the same issue also with Chromium based Microsoft Edge, therefore I presume the issue is not browser engine related.