Mathjax on linkedom...

[swamidass]

Has anyone figured out how to use MathJax on a linkedom object?

There are some tools for applying it to a jsdom (e.g. https://github.com/pkra/mathjax-node-page/), but I'd prefer to use linkedom. https://github.com/WebReflection/linkedom

Linkedom is a much faster alternative to jsdom, https://webreflection.medium.com/linkedom-a-jsdom-alternative-53dd8f699311 , with nearly the same functionality.

I'm hoping to have a way to use Mathjax in a serverside node process on a linkedom object, modifying the dom in place to render the math. Less useful, but also valuable, would be a commandline utility like mjpage to do the same, but using a linkedom object internally for speed.

[dpvc]

MathJax v3 is set up to allow you to use alternative DOM implementations, and so it is not hard to get it to work with linkedom. MathJax uses a "DOM adaptor" to concert the actions it needs into the corresponding actions on whatever DOM is being used, so one only needs to supply the DOM adaptor. Since linkedom implements much of the browser DOM API, you can piggyback off the current HTMLadaptor to do most of the work, just like the jsdom adaptor does.

In this case, there are a couple of additional issues to take into account (like if you pass an empty string to linkedom's parseHTML(), you don't get a fully instantiated DOM, and it doesn't implement the HTMLCollection class), but these can be handled by overriding the appropriate methods in the adaptor.

I have pushed a version that seems to work (but I haven't tested it much) in the issue2833 branch of mathjax/MathJax-src. You can check out that branch and compile the adaptor using npm run -s compile. Then you can use the new adaptor in place of the jsdom adaptor in the jsdom examples in the MathJax node demos repository.

To do so, replace

const {jsdomAdaptor} = require('mathjax-full/js/adaptors/jsdomAdaptor.js');

with

const {linkedomAdaptor} = require('mathjax-full/js/adaptors/linkedomAdaptor.js');

and

const {JSDOM} = require('jsdom');

with

const {parseHTML} = require('linkedom');

and finally

const adaptor = jsdomAdaptor(JSDOM);

with

const adaptor = linkedomAdaptor(parseHTML);

and that should allow any fo the jsdom examples to run, including the ones that process a whole page at once.

[swamidass]

Thanks for this. I'll look into it and see. When do you think that will be merged into main branch of MathJax?

[dpvc]

I expect it to be in the next release, but I don't think that will be for several months yet. There is a lot still to go into it.

[swamidass]

Thanks @dpvc . It looks like this will likely be a step in the right direction. But I don't know enough about how MathJax works to get this working. Let me explain my use case.

This is a server-side rendering script that is doing several tasks.

1. Source HTML is read in and converted to linkedom DOM in a node script.
2. Several rendering tasks are executed on the linkedom DOM.
3. Mathjax executed on the linkedom DOM.
4. Linkedom DOM converted to HTML and saved to disk.

So the task I'm unclear on is 3. How do I pass a DOM object to Mathjax to modify and output back nothing (certainly not HTML).

There has to be a straightforward way to do this, or at least I imagine so, because Mathjax usually runs in the browser. So how do I get this to work? Rather, what's the most simple way to run MathJax on a DOM?

[dpvc]

The jsdom examples that I pointed you to earlier show how to work both on a single expression and on a complete DOM. The latter are the examples whose names end in -page.

The only difference to make it work on an existing DOM (rather than a file, like in the examples), is to pass the linkedom Document as the first argument to mathjax.document() rather than the HTML string. I gave you the other needed changes in my response above.

Give that a try.

[swamidass]

Great thanks. I'll see if that works.