Integration with Elm

[jxxcarlson]

I am interested in integrating MathJax with Elm and will be speaking with the developer Evan Czaplicki in a few days. I currently have a very poor way of doing this. Elm uses a virtual DOM. Thus the ideal would be to pass a DOM node from Elm to MathJax and to receive a beautifully rendered DOM back from MathJax. Is this possible? (hope, hope) If so, how??

Thanks so much in advance.

Note added. Would the sort of code listed below work? The idea is that model.tex holds the text to be rendered, and div is a div "containing" the rendered text.

...

var MathJax = require('MathJax');

...

function render(model)
{
  var div = MathJax.HTML.Element(
  "div",
  {id: "MathDiv", style:{border:"1px solid", padding:"5px"}},
  [model.tex]
);

[pkra]

Elm uses a virtual DOM. Thus the ideal would be to pass a DOM node from Elm to MathJax and to receive a beautifully rendered DOM back from MathJax. Is this possible? (hope, hope) If so, how??

I'm not 100% sure what you're after but the answer is very likely "not really" or "not at this time".

The main problem is what DOM should mean here. With "returning a rendered DOM" I'm guessing you mean a something that fits into Elm's virtual DOM.

On the one hand, MathJax v2.x requires a real DOM to work with so it cannot support this use case. Luckily, this will change in https://github.com/mathjax/mathjax-v3 but that's still under heavy construction, i.e., not at this time.

On the other hand, since a virtual DOM object is not only not a real DOM but not well defined (given the many different libraries for this kind of thing) it would be a moving target if we tried to support this. So we have no plans. But a simple string might be sufficient anyway.

Still, you could use mathjax-node server-side to get string-to-string conversion but this requires a nodejs environment.

Finally, you could also write a small wrapper around MathJax (client-side) to move its processing "off screen" and generate SVG or CommonHTML output like mathjax-node does. That's somewhat terrible in terms of performance as it will create an offscreen (real) DOM node and you end upd serializing that (only to inject it into the DOM at a later time), but it can obviously be done. Here's an example that does something more elaborate, https://codepen.io/pkra/pen/oWjwNM?editors=1011.

[jxxcarlson]

Thanks so much for the detailed answer. I will look into your suggestions -- and continue to await MathJax 3.0 with great enthusiasm.