Issue with tilde rendering on HTML

[mmcky]

There is an issue with current mathjax rendering of \tilde V

This could be an issue with mathjax. An preliminary look doesn't find an easy fix.

[mmcky]

If I use common-html (as a mathjax setting) rather than html-css it seems to be centered so maybe this is a css thing?

[mmcky]

@DrDrij is the css making math italic and possibly causing this issue with the off centered ~ tilde?

[mmcky]

It looks like if we specify the next version of mathjax which will be default in sphinx=4.0 then the issue is resolved

    mathjax_path: https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js

with chtml

[mmcky]

Hmm -- seems fixed locally but not when using netlify etc.

[mmcky]

So the same config gives different html -- how is that possible?

netlify build:

<span class="MathJax" id="MathJax-Element-154-Frame" tabindex="0" data-mathml="<math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot;><mrow class=&quot;MJX-TeXAtom-ORD&quot;><mover><mi>V</mi><mo stretchy=&quot;false&quot;>&amp;#x007E;</mo></mover></mrow></math>" role="presentation" style="position: relative;"><nobr aria-hidden="true"><span class="math" id="MathJax-Span-2035" style="width: 0.842em; display: inline-block;"><span style="display: inline-block; position: relative; width: 0.737em; height: 0px; font-size: 115%;"><span style="position: absolute; clip: rect(1.21em, 1000.755em, 2.417em, -1000.015em); top: -2.254em; left: 0em;"><span class="mrow" id="MathJax-Span-2036"><span class="texatom" id="MathJax-Span-2037"><span class="mrow" id="MathJax-Span-2038"><span class="munderover" id="MathJax-Span-2039"><span style="display: inline-block; position: relative; width: 0.685em; height: 0px;"><span style="position: absolute; clip: rect(3.204em, 1000.702em, 4.149em, -1000.015em); top: -3.987em; left: 0em;"><span class="mi" id="MathJax-Span-2040" style="font-family: STIXGeneral-Italic;">V<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.055em;"></span></span><span style="display: inline-block; width: 0px; height: 3.992em;"></span></span><span style="position: absolute; top: -4.249em; left: 0.265em;"><span style="height: 0em; vertical-align: 0em; width: 0.423em; display: inline-block; overflow: hidden;"></span><span class="mo" id="MathJax-Span-2041" style="font-family: STIXGeneral-Regular;">̃&nbsp;<span style="height: 0em; vertical-align: 0em; margin-left: -0.68em;"></span></span><span style="display: inline-block; overflow: hidden; height: 1px; width: 0em;"></span><span style="display: inline-block; width: 0px; height: 3.992em;"></span></span></span></span></span></span></span><span style="display: inline-block; width: 0px; height: 2.26em;"></span></span></span><span style="display: inline-block; overflow: hidden; vertical-align: -0.057em; border-left-width: 0px; border-left-style: solid; width: 0px; height: 1.15em;"></span></span></nobr><span class="MJX_Assistive_MathML" role="presentation"><math xmlns="http://www.w3.org/1998/Math/MathML"><mrow class="MJX-TeXAtom-ORD"><mover><mi>V</mi><mo stretchy="false">~</mo></mover></mrow></math></span></span>

local build:

<span id="MathJax-Element-154-Frame" class="mjx-chtml MathJax_CHTML" tabindex="0" data-mathml="<math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot;><mrow class=&quot;MJX-TeXAtom-ORD&quot;><mover><mi>V</mi><mo stretchy=&quot;false&quot;>&amp;#x007E;</mo></mover></mrow></math>" role="presentation" style="font-size: 112%; position: relative;"><span id="MJXc-Node-2067" class="mjx-math" aria-hidden="true"><span id="MJXc-Node-2068" class="mjx-mrow"><span id="MJXc-Node-2069" class="mjx-texatom"><span id="MJXc-Node-2070" class="mjx-mrow"><span id="MJXc-Node-2071" class="mjx-munderover"><span class="mjx-stack"><span class="mjx-over" style="height: 0.153em; padding-bottom: 0.06em; padding-left: 0.28em;"><span id="MJXc-Node-2073" class="mjx-mo" style="vertical-align: top;"><span class="mjx-char MJXc-TeX-main-R" style="padding-top: 0.057em; padding-bottom: 0.326em;">~</span></span></span><span class="mjx-op"><span id="MJXc-Node-2072" class="mjx-mi"><span class="mjx-char MJXc-TeX-math-I" style="padding-top: 0.434em; padding-bottom: 0.326em; padding-right: 0.186em;">V</span></span></span></span></span></span></span></span></span><span class="MJX_Assistive_MathML" role="presentation"><math xmlns="http://www.w3.org/1998/Math/MathML"><mrow class="MJX-TeXAtom-ORD"><mover><mi>V</mi><mo stretchy="false">~</mo></mover></mrow></math></span></span>

[mmcky]

The netlify build seems to be missing class="mjx-chtml MathJax_CHTML" which fixes the tilde issue

[mmcky]

ah ha -- I think I fixed it. There was a sphinx=2.4.4 being pinned for the netlify build

[mmcky]

nope -- :(

https://5faa04300e34125b7f6841eb--wonderful-lalande-528d1c.netlify.app/bcg_complete_mkts#a-consumers-problem

[AakashGfude]

@mmcky in this netlify link, it looks fixed?

[mmcky]

Yeah -- it relates mainly to inline math

Actually on my browser it shows both are an issue

[AakashGfude]

ohh. are you using safari?

[mmcky]

@AakashGfude not for me in safari -- seems ok in chrome now that I look

[mmcky]

dang it -- this is a safari vs chrome thing

https://python-advanced.quantecon.org/BCG_complete_mkts.html

[mmcky]

but @AakashGfude I don't understand why the html differs? Do you have any insight on this?

[AakashGfude]

ooh boy. you have found a bug in mathjax it seems.

can mathjax render different HTML based on browsers?

[AakashGfude]

safari is crashing on my laptop 👀 . might have to restart.

[AakashGfude]

a similar issue which was reported earlier https://github.com/mathjax/MathJax/issues/1766