Board Thread:Technical Updates/@comment-24006128-20200813184033/@comment-44386818-20200825213936

The new discussion feature does not seem to differentiate between a  and a. When it is used to migrate comments originally written in wiki markup, the problem gets worse.

In the comment here, there is an oversight in the code, which keeps line ending as-is in a  tag, instead of replacing them with spaces. This causes a line wrap that was not intended. The oversight also shows that there is no visual distinction (in terms of CSS style) between  (paragraph) and   (plain line ending). It’s easy to fix: Just add  to the CSS, and the problem will be gone, am I right?

Nope. It’s not that easy! I believe that the developers of this fancy discussion feature must not be wiki contributors or have paid close attention GitHub’s Markdown rendering — how can they mess up so badly:

Please refer to my message as the test case. In the discussion editor (which is a visual editor), I pressed Enter twice to make a new paragraph.

The rendered HTML looked like this:

Paragraph 1. Paragraph 2.

This is not how  works!

If you press Enter once in MediaWiki’s visual editor, a new paragraph will be made. This is programmed in accordance with the nature of wiki articles and the syntax of wiki markup, where  is seldom used.

When Fandom developers were coding the discussion feature, they took a different approach — when the user presses Enter once, it should look like a plain  is inserted. However, the developers did not do their homework. When they saw MediaWiki insert a  tag, they copied it, but the spacing looked huge, so stylesheets were adjusted to erase the margin. Now, what happens if you press enter twice?

p { margin-top: 0; margin-bottom: 0; } Paragraph 1. Paragraph 2.

With the top and bottom margins erased, the empty paragraph in the middle becomes a zero-height element. The spacing is not there when we need it! Hence, let us manually insert a  to “fix” the bug.

p { margin-top: 0; margin-bottom: 0; } Paragraph 1.

Paragraph 2.

Now, you are abusing HTML tags, which get different names for a reason. You can’t treat them like fancy DIVs!

“But... We are writing webapps in .” said an incompetent web developer. “Who cares about the semantic meaning of page elements? You can fix any visual inconsistency with CSS. We are not the W3C!”

Standards exist so that different software implementations can work with one another. Good job, whoever wrote the line wrapping code. Formatting is broken, your contributors’ hearts more so.

Talk is cheap. How do you fix the bug?
You can’t retroactively ask users to edit their comments in response to breaking changes, but one thing you know for sure is the user pressed Enter once at each paragraph boundary. Rather than counting paragraphs, it is a good idea to count the number of Enter presses.

I’m not your programmer, but here is the basic idea. Define a Finite State Transducer like this: