Edge Rewrite
// HTMLRewriter · presentation

This page was redesigned at the edge.

Cloudflare fetched the original article and streamed it through HTMLRewriter to apply an entirely new visual system without rebuilding the source page.

// request.cf · coarse context

A page that knows where it met you.

Only coarse request metadata is shown. This demo does not display or persist visitor IP addresses.

Country
US
Cloudflare location
CMH
Connection
HTTP/2
Language
Not provided

Ray ID: a45579fcdbeccf4e

Jump to content

Wikipedia:WikiProject Mathematics/MathFormattingBugs

From Wikipedia, the free encyclopedia

This page lists bugs and inconsistencies with the mathematical formatting system using the math extension with different preferences (server-side SVG/client-side SVG/client-side MathML).

The current default rendering mode, "server-side SVG", has been the default for many years. But a new rendering mode, "client-side SVG", is imminently scheduled to be deployed as the default, at which point "server-side SVG" will be removed as an option. In the long term, developers have a goal of making "client-side MathML" the default rendering mode.

To see every article in English Wikipedia with the new rendering mode, visit Special:Preferences § mw-prefsection-rendering and change the "Math" setting to "MathML with SVG image (client side MathJax rendering)".

To view a specific article with a particular rendering preference, without changing the global preference setting, append ?mathmode=mathml to the URL for "server-side SVG", append ?mathmode=mathjax for "client-side SVG", and append ?mathmode=native for "client-side MathML".

Yes, these names are confusing:

  • "Server-side SVG" (mathml, current default mode) means that the original LaTeX mathematics markup is converted to an SVG image on the server side using the MathJax library, version 2. This SVG image is sent directly to the reader's browser for display.
  • "Client-side SVG" (mathjax, planned new default) means that the LaTeX markup is converted to MathML on the server side using a brand new PHP library unique to mediawiki, sent in MathML format to the browser, and then converted to an SVG image using the MathJax library, version 4, running directly in the reader's browser (note that MathJax is intended to be used to ingest the original LaTeX markup, so this is non-standard use of MathJax).
  • "Client-side MathML" (native) means that the LaTeX markup is converted to MathML on the server side using the same PHP library, and then that MathML code is directly rendered by the reader's browser.

See Help:Displaying a formula for more general information about including mathematics within English Wikipedia articles. See #Formatting notes, below, for how to add entries.

Problems with client-side SVG mode

[edit]

Separate table because the breakage is absurdly wide:

Sandwich issue

[edit]

Listed on Phabricator T438945

In Vector2022 + latex-to-mathml-to-client-mathjax-svg, wide displayed math formulas that overlap a floating image are partially hidden by the image with no scrollbar to make the hidden part visible. When the formula overlaps with the caption of the image, both pieces of text are overlaid. Example from square pyramid (a div puts the following in a box to simulate a narrow window)

Client-side SVG mode:

Geometric representation of the square pyramidal number 1 + 4 + 9 + 16 = 30.

A square pyramidal number is a natural number that counts the number of stacked spheres in a square pyramid. If the pyramid has layers, then it has Pn=12+22+…+n2=∑x=1nx2=n(n+1)(2n+1)6 spheres.

Server-side SVG mode:

Geometric representation of the square pyramidal number 1 + 4 + 9 + 16 = 30.

A square pyramidal number is a natural number that counts the number of stacked spheres in a square pyramid. If the pyramid has layers, then it has spheres.

Native MathML mode:

Geometric representation of the square pyramidal number 1 + 4 + 9 + 16 = 30.

A square pyramidal number is a natural number that counts the number of stacked spheres in a square pyramid. If the pyramid has layers, then it has Pn=12+22+…+n2=∑x=1nx2=n(n+1)(2n+1)6 spheres.


Blockquote issue

[edit]

T382267 fixed and T420668 when using the parsoid parser open

See

The parser can be set via Special:Preferences#mw-prefsection-editing editing->Developer Tools->Use the new Parsoid wikitext parser set to "Always (Opt-In)" or "Never (Opt-Out)".

MathML only bugs

[edit]
Math format inconsistencies primarily affecting MathML mode
NumberLaTeX markupServer-side SVGClient-side SVGClient-side MathMLNotes
x : y : zx:y:zx:y:z

Lack of space before colon

T410843p(a|b)p(a|b)p(a|b)Pipe introduces spurious spacing in Firefox
\|pq\| = \|p\| \|q\|‖pq‖=‖p‖‖q‖‖pq‖=‖p‖‖q‖Norm introduces spurious spacing in Firefox
\begin{align} \sqrt5 \end{align}55

align environment wreaks hilarious havoc with square roots in Safari

a \xrightarrow{\cong} ba→≅ba→≅b

The ≅ symbol above the arrow is not clipped (as in server-side SVG render, which took a workaround to avoid) but in MathML mode is positioned too far to the right.

Resolved issues

[edit]

The following markup examples no longer appear to be problematic but are retained here as a convenient collection of test cases.

Formatting notes

[edit]

To add and example, use a line like

|-
|| {{phab|T1234}} status || {{/RowFormat| 1= \tbinom{n}{k} }} || Description

In one of the tables. This will automatically add four columns with the latex code,

There are some restrictions on the characters that you can use in parameters to the {{/RowFormat}} template. The character | is treated as a separator between template characters so can't be use directly, instead use the {{!}} special template that is converted to a pipe character in the template transclusion process. Double curly bracket either {{ or }} signify the start or end of a template to transclude. Here simply add a space between then, latex ignore the extra space.

Adding Phabricator tasks

[edit]

Task can be added to the Wikimedia Phabricator bug reporting system that the developers use. See mw:How to report a bug for the actual steps, how to log in and guidance on what makes a good bug report.

A few pointers for adding maths bugs

  • Go to https://phabricator.wikimedia.org/maniphest/task/edit/form/43/
  • Give a short description of the issue in the title say "\Omega rendered in italic rather than roman in Clientside SVG and MathML modes"
  • Under **Steps to replicate the issue** (include links if applicable):
    • Add details of your preference setting: MathML only/MathML with SVG image (client side MathJax rendering)/MathML with SVG image (server side MathJax rendering)
    • Add the math expression used say <math>\Omega</math>.
    • Try to find the simplest example that creates the issue.
  • Under **What happens?**:
    • Add a screenshot of the rendered equation, you can use examples from this page, its good if you can show the column headings.
    • Add text describing why this is wrong
  • Under **What should have happened instead?**:
    • Add a screenshot of the correctly rendered equation
    • Add text describing why this is correct
  • Under **Other information** (browser name/version, screenshots, etc.):
    • Say which browser you are using chrome/Firefox/safari is probably enough.
    • Link to the Wikipedia article where the bug was first seen. Copy and paste the URL.
  • Add Math to the Projects section.

After creating the task you can then add parent tasks, typically

  • T375238 Client-side MathJax rendering problems
  • T375318 "MathML only" mode formatting bugs (mathmode=native)

You can do this using the "Edit related task -> Edit parent tasks" side bar option.