Rendering issue for "extenders" in chtml output seen also in Chrome 100. SVG output seems to avoid the issue
Issue Summary
Issues where \left|, \right|, and \overline are not appearing in chtml output at certain zoom levels have now been observed in Chrome 100.0.4896.60. At least one report seems to have been about such an issue in Chrome 99.0.4844.84.
Prior issues of this nature have been reported in the past in Firefox, and at least the \overline issue has been confirmed as a bug in Firefox.
I am not aware of any reports of this nature for Chrome in the recent past until those brought to my attention in the last few days. I suspect that some recent update to Chrome may have lead to this display issue starting to occur in Chrome only recently.
The current recommended workaround is to use the svg output mode instead of chtml. That seems to solve the problems both in Chrome and in Firefox.
Related issues for Firefox:
- https://github.com/mathjax/MathJax/issues/2795
- https://github.com/mathjax/MathJax/issues/2732
- https://github.com/mathjax/MathJax/issues/2741
- https://github.com/mathjax/MathJax/issues/2844
Firefox bug report: https://bugzilla.mozilla.org/show_bug.cgi?id=1741887
Steps to Reproduce:
The problem was seen in MathJax rendered equations in WeBWorK 2.16 (MathJax 3.1.2) for the equation
\left| \, \left( z_1 \cdot z_2 - \overline{z_3} \, \right)^3 \, \right|
with the \overline disappearing at some zoom levels, and the \left| and \right| at others. On one Windows 10 PC all were missing at the 200% zoom level.
Another formula using \left| and \right| was seen to also trigger the same issue.
Changing to SVG output works and the formula which encountered problems rendered properly at all zoom levels which were legible.
See:
- https://github.com/openwebwork/webwork2/issues/1524
Technical details:
- MathJax Version: 3.1.2 (in WeBWorK 2.16)
- Client OS: Windows 10
- Browser: Chrome 100.0.4896.60 (64-bit)