VisualEditor: CSS munging causing absolutely-positioned chess diagrams(?) to break
Closed, ResolvedPublic

Description

A very common chess template on many Wikipedias recommends using '|=' , and most instances of chess boards use this syntax
https://en.wikipedia.org/wiki/Template:Chess_diagram#Standard_diagram
https://de.wikipedia.org/wiki/Vorlage:Schachbrett#Standarddiagramm

On German Wikipedia, editing the template strips the '=' signs. This article is on the parsoid topfails
https://de.wikipedia.org/wiki/Edward_Lasker?veaction=edit
http://parsoid.wmflabs.org:8001/topfails/1

There are 900 uses of these chess templates on German Wikipedia.
https://de.wikipedia.org/w/index.php?title=Spezial:Linkliste/Vorlage:Schachbrett&limit=750
https://de.wikipedia.org/w/index.php?title=Spezial:Linkliste/Vorlage:Schachbrett-klein&limit=115
A few more of
https://de.wikipedia.org/wiki/Vorlage:Schachbrett-10x10
https://de.wikipedia.org/wiki/Vorlage:Schachbrett-8x10
https://de.wikipedia.org/wiki/Vorlage:Schachbrett-Chaturanga

The syntax is used on many other WPs, incl. eswp, frwp, plwp and ruwp
https://es.wikipedia.org/wiki/Plantilla:Diagrama_de_ajedrez#Diagrama_est.C3.A1ndar
https://fr.wikipedia.org/wiki/Mod%C3%A8le:Diagramme_d%27%C3%A9checs
https://fr.wikipedia.org/wiki/Alexandre_Alekhine
https://pl.wikipedia.org/wiki/Szablon:SzachyDiagram
https://ru.wikipedia.org/wiki/%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD:%D0%A8%D0%B0%D1%85%D0%BC%D0%B0%D1%82%D0%BD%D0%B0%D1%8F_%D0%B4%D0%B8%D0%B0%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B0

On English, the VE UI can go into massive layout problems, but the UI issues may all be due to the Parsoid issue.
https://en.wikipedia.org/wiki/French_Defence?veaction=edit
The number of uses on enwp appears to be in the same ballpark as dewp
https://en.wikipedia.org/w/index.php?title=Special:WhatLinksHere/Template:Chess_diagram&limit=900


Version: unspecified
Severity: minor
See Also:
T55226: VisualEditor: CSS munging causing absolutely-positioned <div>s used to create pie charts(!) to break
T53166: VisualEditor: CSS munging causing CSS image cropping template {{Css Image Crop}} to display wrong portion of image
T73404: VisualEditor: Letters getting added and duplicated on pages featuring chess templates

bzimport set Reference to bz51932.
jayvdb created this task.Via LegacyJul 24 2013, 8:41 AM
jayvdb added a comment.Via ConduitJul 24 2013, 8:46 AM

An alternative 'pretty' syntax that doesnt cause breakages is:

https://de.wikipedia.org/w/index.php?title=Edward_Lasker&diff=120835751&oldid=120194113

The html comments are visible in the parameters of the template dialog, but it stops the dirty diffs if this |= syntax is not desirable.

ssastry added a comment.Via ConduitJul 29 2013, 10:45 PM

Hmm .. strange. When I copied both forms of the syntax into a file and parse it with Parsoid, the html renders just fine. Curious why it breaks in VE however.

Verifiable here: http://parsoid.wmflabs.org/_wikitext/

Paste this there and scroll down past the literal html and you'll see this rendered correctly there.


{{Infobox chess opening

openingname = French Defence
image = {{Chess diagram=
=
|rd|nd|bd|qd|kd|bd|nd|rd|=
|pd|pd|pd|pd|  |pd|pd|pd|=
|  |  |  |  |pd|__|__|__|=
|  |  |__|  |__|__|__|__|=
|  |  |__|  |pl|__|__|__|=
|  |  |__|__|__|__|__|__|=
|pl|pl|pl|pl|__|pl|pl|pl|=
|rl|nl|bl|ql|kl|bl|nl|rl|=
|

}}

moves=1.e4 e6
ECO=C00–C19
birth =
nameorigin = London vs. Paris correspondence match (1834–36)
parentopening = [[King's Pawn Game]]
AKA =
chessgid=39913&move=2&moves=e4.e6&nodes=21720.39913

}}

ssastry added a comment.Via ConduitJul 30 2013, 5:39 PM

Moving to visual editor in case there is something about the Parsoid output that is causing broken layout in the "|=" form of chess-board syntax. Please assign to Parsoid if there is a bug here in our output.

Jdforrester-WMF moved this task to Backlog on the VisualEditor workboard.Via WebNov 24 2014, 4:24 PM
matmarex added a subscriber: matmarex.Via WebApr 19 2015, 9:04 PM

There are no screenshots here to show how it used to be broken, but it seems to behave correctly now.

matmarex closed this task as "Resolved".Via WebApr 19 2015, 9:05 PM
matmarex set Security to None.

Add Comment