multiline environment (with tags) rendering issues

[pkra]

(This came up while testing 2.7.4 but is also present in 2.7.3 and probably ealier.)

I ran into 2-3 issues around multline; I'm not sure how to split them.

Minimal example:

$$\begin{multline}xxxxxxxxxx\tag{1} \\ yyyyyyyyyy\end{multline}$$

(default) equation label alignment

IIUC, the equation label should align with the first line of the expression.

However, with its default (labels on right), the label aligns with the second line; furthermore, using the CommonHTML output the row overlaps the label (SVG and HTML-CSS are fine).

This matches toMathML which has the label in the second row / mlabeledtr.

left-aligned equation labels

When equation labels are left-aligned, both SVG and CommonHTML align the label at the first row. (I didn't check HTML-CSS).

SVG with small container size

If the container size is small (e.g., 0), the SVG output renders poorly (and differently from CommonHTML; I didn't check HTML-CSS): the second row ends below the beginning of the first row (excluding the left-aligned label).

Sample output (via mathjax-node with width:0 but happens in the client as well):

<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="20.75ex" height="6.259ex" style="vertical-align: -2.531ex; margin-left: -5.832ex; margin-right: -10.352ex;" viewBox="-2511.1 -1605.1 8934 2695" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" aria-labelledby="MathJax-SVG-1-Title">
<title id="MathJax-SVG-1-Title">\begin{multline} xxxxxxxxxx \tag{1}\\ yyyyyyyyyy \end{multline}</title>
<defs aria-hidden="true">
<path stroke-width="0" id="E1-STIXWEBMAIN-28" d="M304 -161l-12 -16c-158 90 -244 259 -244 429c0 185 87 329 247 424l9 -16c-139 -119 -170 -212 -170 -405c0 -186 30 -299 170 -416Z"></path>
<path stroke-width="0" id="E1-STIXWEBMAIN-31" d="M394 0h-276v15c74 4 95 25 95 80v449c0 34 -9 49 -30 49c-10 0 -27 -5 -45 -12l-27 -10v14l179 91l9 -3v-597c0 -43 20 -61 95 -61v-15Z"></path>
<path stroke-width="0" id="E1-STIXWEBMAIN-29" d="M29 660l12 16c153 -92 244 -259 244 -429c0 -185 -88 -327 -247 -424l-9 16c142 117 170 211 170 405c0 187 -25 302 -170 416Z"></path>
<path stroke-width="0" id="E1-STIXWEBMAINI-78" d="M243 355l12 -57c70 107 107 143 151 143c24 0 41 -15 41 -37c0 -21 -14 -36 -34 -36c-19 0 -28 17 -52 17c-18 0 -54 -44 -98 -121c0 -7 2 -21 8 -45l32 -134c7 -28 16 -41 30 -41c13 0 24 10 47 40c9 12 13 18 21 28l15 -9c-58 -90 -84 -114 -122 -114 c-32 0 -47 18 -59 68l-29 119l-88 -119c-44 -59 -64 -68 -95 -68s-50 16 -50 42c0 20 14 36 34 36c9 0 19 -4 32 -11c10 -6 20 -9 26 -9c11 0 30 19 51 49l82 116l-28 124c-14 60 -21 68 -46 68c-8 0 -20 -2 -39 -7l-18 -5l-3 16l11 4c61 22 94 29 117 29 c25 0 37 -18 51 -86Z"></path>
<path stroke-width="0" id="E1-STIXWEBMAINI-79" d="M243 186l21 -110c85 141 122 213 122 257c0 14 -7 20 -26 32c-20 13 -26 23 -26 39c0 22 17 37 40 37c30 0 52 -25 52 -55c0 -57 -48 -167 -131 -305c-104 -172 -211 -287 -268 -287c-30 0 -51 17 -51 43c0 22 17 40 39 40c35 0 35 -28 61 -28c13 0 25 8 48 33 c18 19 63 78 71 91c6 12 10 24 10 35c0 40 -55 264 -82 332c-19 49 -37 64 -77 64c-11 0 -20 -1 -31 -4v17c11 2 22 4 32 6c20 4 53 10 107 18h4c15 0 68 -166 85 -255Z"></path>
</defs>
<g stroke="currentColor" fill="currentColor" stroke-width="0" transform="matrix(1 0 0 -1 0 0)" aria-hidden="true">
<g id="mjx-eqn-1" transform="translate(0,703)">
 <use xlink:href="#E1-STIXWEBMAIN-28"></use>
 <use xlink:href="#E1-STIXWEBMAIN-31" x="333" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAIN-29" x="833" y="0"></use>
</g>
<g transform="translate(1966,0)">
<g transform="translate(-14,0)">
<g transform="translate(0,703)">
 <use xlink:href="#E1-STIXWEBMAINI-78" x="0" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="447" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="894" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="1341" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="1788" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="2235" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="2682" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="3129" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="3576" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-78" x="4023" y="0"></use>
</g>
<g transform="translate(-4440,-797)">
 <use xlink:href="#E1-STIXWEBMAINI-79" x="0" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="444" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="888" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="1332" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="1776" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="2220" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="2664" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="3108" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="3552" y="0"></use>
 <use xlink:href="#E1-STIXWEBMAINI-79" x="3996" y="0"></use>
</g>
</g>
</g>
</g>
</svg>

[pkra]

Just to clarify (since using h3/h4 is probably not enough): I only checked 'SVG with small container size' while using left-aligned labels.

[dpvc]

IIUC, the equation label should align with the first line of the expression.

This is not correct. When equation numbers are on the right using \documentstyle[reqno]{amsart}, LaTeX places the tag for multline on the last line regardless of which line has the \tag{}. MathJax preserves that behavior with right-sided tags. With left equation numbers, the tag is placed on the first line (and MathJax does that as well, as you point out).

using the CommonHTML output the row overlaps the label (SVG and HTML-CSS are fine).

OK, that's a bug. The 85% width for multline is not being set properly. One can change
lines 412 and 413 of the CommonHTML/autoload/mtable.js file from

        this.CHTML.pwidth = values.width; this.CHTML.mwidth = CHTML.Em(TW);
        node.style.width = node.firstChild.style.width = "100%";

to

        node.style.width = this.CHTML.pwidth = "100%";
        this.CHTML.mwidth = CHTML.Em(TW);
        node.firstChild.style.width = values.width;
        node.firstChild.style.margin = "auto";

to fix that.

As for the 0-width SVG, that turns out to be due to not taking the minimum width of the table into account (as is done by CommonHTML and HTML-CSS). That can be done at line 229 of SVG/autoload/mtable.js by replacing

          WW = SVG.length2em(values.width,mu);

by

          WW = Math.max(Wt + Wp, SVG.length2em(values.width,mu));

Unfortunately, there is no easy patch to work around it until these changes are made. Too bad these were not included in the 2.7.4 release.

[pkra]

Thanks for looking into this!

This is not correct. When equation numbers are on the right using \documentstyle[reqno]{amsart}, LaTeX places the tag for multline on the last line regardless of which line has the \tag{}. MathJax preserves that behavior with right-sided tags. With left equation numbers, the tag is placed on the first line (and MathJax does that as well, as you point out).

Ah, sorry! I didn't expect there to be a difference here. Thanks for correcting me.

And thanks for confirming the other issues. Since I only noticed this during visual regression testing with 2.7.4 I unfortunately couldn't report it earlier.

[dpvc]

Since I only noticed this during visual regression testing with 2.7.4 I unfortunately couldn't report it earlier.

I wasn't complaining. I was only saying "How typical: we find this just a day after making a release."

[pkra]

On the bright side, this was the only issue I found while testing ~75,000 equations 😄

[dpvc]

That is nice to know. Thanks for making the tests.

[dpvc]

==> In testsuite
MathMLToDisplay/Presentation/TablesAndMatrices/issue1974-1.html
MathMLToDisplay/Presentation/TablesAndMatrices/issue1974-2.html