# Two one-sided arrows from mhchem MathJax extension do not render properly upon conversion to pdf

I am using pdfkit-pythonbased on wkhtmltopdfto convert into pdf a text that contains MathJax with mhchemextension.

All works fine on the browser, like in the case :

$$\ce{A <=> B + C}$$

where I have used $\ce{<=>}$ to draw the so-called two one-sided arrows.

However, this is what I get after conversion to pdf.

As you see, a huge space is added after the arrows, which is quite annoying. I can overcome the problem by using $\ce{\rightleftharpoons}$, which gives:

$$\ce{A \rightleftharpoons B + C}$$

and here how it appears on the pdf:

with the drawback that arrows are smaller than in the previous case with $\ce{<=>}$ .

This is just an example of problems that I have encountered: I could give you more discrepancies showing up ONLY when pdf is created.

My question is:
Is it possible to avoid the added space upon conversion to pdf when using $\ce{<=>}$ ? Or more generally, what should one do to obtain the same rendering on the pdf, as on the browser ?

Here some of the parameters I have used to perform pdf conversion:

wkhtmltopdf config:

options = {
'quiet': '',
'javascript-delay' : '5000',
'page-size': 'A4',
'margin-top': '0.75in',
'margin-right': '0.75in',
'margin-bottom': '0.75in',
'margin-left': '0.75in',
'disable-smart-shrinking': '',
'dpi': '400',
}


MathJax config:

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
TeX: {extensions: ["mhchem.js"]},
tex2jax: {
inlineMath: [['$$','$$'], ['$','$']],
displayMath: [ ['$$','$$'], ["\$","\$"] ],
processEscapes: true
}
});
</script>

<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

• Have you tried using the same version of MathJax as the site? Jul 13 '19 at 7:40
• Browsing through the DevTools for any Chem.SE webpage I found: MathJax.Ajax.config.path["mhchem"] = "https://cdnjs.cloudflare.com/ajax/libs/mathjax-mhchem/3.2.0"; so 3.2.0 seems to be the version currently in use. See if that helps. There's also a larger mathjax.hub.config (in case that's helpful) in the site Jul 13 '19 at 10:14
• Why don't you use StackPrinter? See also here: stackapps.com/q/179 Then you can just use the print dialogue of your browser to create the pdf. (Please note that this question is somewhat off topic for us and our meta, but would probably be on topic at one of the technical sites.) Jul 13 '19 at 10:48

As it has been pointed out here, the --window-statusoption should be used, instead of an arbitrary delay (given by --javascript-delay). Here below, how wkhtmltopdfconfiguration should look like:

options = {
'quiet': '',
'window-status' : 'finished',
'page-size': 'A4',
'margin-top': '0.75in',
'margin-right': '0.75in',
'margin-bottom': '0.75in',
'margin-left': '0.75in',
'disable-smart-shrinking': '',
'dpi': '400',


}

And here the MathJaxconfiguration:

     <script type="text/x-mathjax-config">
MathJax.Hub.Config({
TeX: {extensions: ["mhchem.js"]},
tex2jax: {
inlineMath: [['$$','$$'], ['$','$']],
displayMath: [ ['$$','$$'], ["\$","\$"] ],
processEscapes: true,
},
"HTML-CSS": {
scale : 100,
},
});
MathJax.Hub.Queue(["Rerender", MathJax.Hub], function () {window.status="finished"})
</script>


The windows.statusallows conversion into pdf only once MathJax is fully loaded. I have added minScaleAdjust: 110 to obtain the maths big enough compared to text.

    <script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_HTML">
</script>


A second reason of above described misbehavior was the use of CommonHTMLoutput processor (CHTML): I have switched to HTML-CSS(HTML) which seems to properly handle the two one-sides double arrow of the mhchem extension.

Here, an example of how MathJaxis rendered in pdf, using two different output processors:

HTML:

CHTML: