when the option of new CHTML adaptiveCSS set false,the project throws an error.Base on [email protected]
const { mathjax } = require('mathjax-full/cjs/mathjax.js'); const { MathML } = require('mathjax-full/cjs/input/mathml.js'); const { CHTML } = require('mathjax-full/cjs/output/chtml.js'); const { liteAdaptor } = require('mathjax-full/cjs/adaptors/liteAdaptor.js'); const { RegisterHTMLHandler } = require('mathjax-full/cjs/handlers/html.js'); const { AssistiveMmlHandler } = require('mathjax-full/js/a11y/assistive-mml.js');
const chtml = new CHTML({ adaptiveCSS:false, }) const html = mathjax.document('', { InputJax: mml, OutputJax: chtml, });
const node = html.convert(mathml, {
display: true,
em: 16,
ex: 8,
containerWidth: 80 * 16,
scale: 1,
});
const chtmlString = adaptor.outerHTML(node);
//The line will throws an error const styleSheet = adaptor.textContent(chtml.styleSheet(html))
This is actually not a bug. With MathJax version 4, the fonts now have much greater character coverage, and so their data are broken down into smaller pieces so the initial download is smaller, and less-used character ranges are loaded only when needed. In your case, since you have turned off the adaptive CSS option, that means you are asking for data on all the characters in the font, and so MathJax needs to load all the various font data files dynamically in order to provide their definitions.
When MathJax has to load a file dynamically, it has to wait for that file to load. MathJax manages this process by throwing a "MathJax retry" error, which is supposed to be trapped by higher-up code in order to tell it to wait for the file to load and then try its command again. The promise-based functions like MathJax.typesetPromise() and MathJax.tex2chtmlPromise() handle the retry errors internally, and their promises are not resolved until the dynamic files are loaded.
Synchronous calls, like MathJax.typeset() that don't return promises, can't handle the asynchronous calls, and rely on the caller to do so. The chtml.styleSheet() command turns out to be one of those in v4, since it amy cause font files to load. That is what is happening in your case.
MathJax provides a function mathjax.handleRetriesFor() that can be used to wrap a synchronous function with the code for processing the retry errors caused by dynamic file loading. It returns a promise that is resolved when the function it is passed completes. So you should be able to do something like
mathjax.handleRetriesFor(() => chtml.styleSheet(chtml))
.then((styles) => console.log(adaptor.textContent(styles)));
to get the full style sheet. But I think you will find that it is larger than you really want to deal with, as it will contain definitions for thousands of characters. It also requires you work with promises. Note that the chtml.convert() command is also a synchronous one that can throw retry errors if the output needs characters from a dynamically loaded font data file. (The next beta will include a convertPromise() command that will handle the retries for you.)
The only v4 font that doesn't have any dynamically loaded files is the original mathjax-tex font. So if you load that and pass it to the CHTML constructor, you should be able to work without having to deal with the promises, but at the cost of having less character coverage than the other v4 fonts.
There is more information about this in the v4.0.0-alpha.1 release notes.