Page MenuHomePhabricator

Inserting the English Wikipedia {{won}} template into a table cell using VisualEditor shows unnecessary code
Open, LowPublic

Description

Hi,

The English Wikipedia template {{won}} is supposed to be used in table cells.

To reproduce:

  1. Go to https://en.wikipedia.org/wiki/User:Amire80/T124934
  2. Click Edit.
  3. Double-click the empty cell Oscar/Status
  4. Click Insert -> Template in the toolbar.
  5. Type won in the field.
  6. Select "Won" in the dropdown.
  7. Click "Add template".
  8. Click "Insert".

Result:

T124934 - editing.png (473×907 px, 41 KB)

Now save the page. Result:

T124934 - saved.png (335×1 px, 29 KB)

As you can see, it's possible to insert it into a table using VE, it does the right the thing eventually and the page is saved correctly, but it shows a lot of wiki syntax during editing.

It would be nice to get rid of that.

Event Timeline

Amire80 raised the priority of this task from to Needs Triage.
Amire80 updated the task description. (Show Details)
Amire80 added a project: VisualEditor.
Amire80 subscribed.
Esanders set Security to None.
Esanders subscribed.

That template is unbalanced. It essentially consists of:

style="background:green">Won

in HTML. I doubt Parsoid will ever support such a template...

@Esanders, The template does not have the closing > char which we would indeed not support. It is the "standard" mixed-attributes-and-content template which we had to support since there are a vast number of such templates out there. It has been supported for a while now.

Example wikitext:

{|
|{{won}}
|}

HTML:

[subbu@earth tools] echo '{|\n|{{won}}\n|}' | parse.js
...
<table data-parsoid='{"dsr":[0,14,2,2]}'>
<tbody data-parsoid='{"dsr":[3,12,0,0]}'><tr data-parsoid='{"autoInsertedEnd":true,"autoInsertedStart":true,"dsr":[3,11,0,0]}'><td style="background: #99FF99; color: black; vertical-align: middle; text-align: center; " class="yes table-yes2" typeof="mw:Transclusion" about="#mwt1" data-parsoid='{"autoInsertedEnd":true,"dsr":[3,11,1,0],"pi":[[]]}' data-mw='{"parts":["|",{"template":{"target":{"wt":"won","href":"./Template:Won"},"params":{},"i":0}}]}'>Won</td></tr>
</tbody></table>
...

So, what is the bug report here? @Amire80, can you provide a test page with some instructions to reproduce this?

@Esanders, The template does not have the closing > char which we would indeed not support. It is the "standard" mixed-attributes-and-content template which we had to support since there are a vast number of such templates out there. It has been supported for a while now.

Example wikitext:

{|
|{{won}}
|}

HTML:

[subbu@earth tools] echo '{|\n|{{won}}\n|}' | parse.js
...
<table data-parsoid='{"dsr":[0,14,2,2]}'>
<tbody data-parsoid='{"dsr":[3,12,0,0]}'><tr data-parsoid='{"autoInsertedEnd":true,"autoInsertedStart":true,"dsr":[3,11,0,0]}'><td style="background: #99FF99; color: black; vertical-align: middle; text-align: center; " class="yes table-yes2" typeof="mw:Transclusion" about="#mwt1" data-parsoid='{"autoInsertedEnd":true,"dsr":[3,11,1,0],"pi":[[]]}' data-mw='{"parts":["|",{"template":{"target":{"wt":"won","href":"./Template:Won"},"params":{},"i":0}}]}'>Won</td></tr>
</tbody></table>
...

So, what is the bug report here? @Amire80, can you provide a test page with some instructions to reproduce this?

Here you go:

  1. Go to https://en.wikipedia.org/wiki/User:Amire80/T124934
  2. Click Edit.
  3. Double-click the empty cell Oscar/Status
  4. Click Insert -> Template in the toolbar.
  5. Type won in the field.
  6. Select "Won" in the dropdown.
  7. Click "Add template".
  8. Click "Insert".

Result:

T124934 - editing.png (473×907 px, 41 KB)

Now save the page. Result:

T124934 - saved.png (335×1 px, 29 KB)

So the saved result is correct, but the display while editing is broken.

I now see what is going on.

[subbu@earth tools] echo '{{won}}' | parse.js
...
<p about="#mwt1" typeof="mw:Transclusion" data-parsoid='{"dsr":[0,7,0,0],"pi":[[]]}' data-mw='{"parts":[{"template":{"target":{"wt":"won","href":"./Template:Won"},"params":{},"i":0}}]}'>style="background: #99FF99; color: black; vertical-align: middle; text-align: center; " class="yes table-yes2"|Won</p>
...

The problem is that for these templates, the inserted template cannot be parsed in isolation when it is inserted. I imagine VE tries to get parsed output in isolation and insert it in place (and that is what you get above and is what you see in the editor). But, on save, it works because the data-mw contents are correct.

This is a known problem and part of the motivation of reforming templates to return DOM structures. See this section about incremental parsing which is effectively the problem that VE would have to solve as well (similar more detailed notes from earlier) in the face of template insertions that don't always return well-formed or well-balanced DOM output.

Not sure what the strategy VE uses and how they should modify this, but I suspect unless VE decides to ask Parsoid to reparse the entire table whenever a cell is edited, this problem cannot be fixed. And, going down that route is very inefficient (imagine a large table). In the longer run, once T114445 is resolved and enough templates migrate over, this will be a non-issue, but in terms of timeline, I imagine that is going to be a while.