Skip to content

Commit 04d8005

Browse files
committed
no need for mocking API v2 to handle both chtml & svg outputs
1 parent 4ba005f commit 04d8005

File tree

2 files changed

+35
-120
lines changed

2 files changed

+35
-120
lines changed

devtools/test_dashboard/index-mathjax3chtml.html

Lines changed: 13 additions & 102 deletions
Original file line numberDiff line numberDiff line change
@@ -23,136 +23,47 @@
2323

2424
<script>
2525
window.MathJax = window.MathJax || {
26-
// mocking v2 API as suggested by https://github.com/akhmerov namely to handle both chtml output on the page as well as svg outputs for plotly
27-
2826
startup: {
29-
//
30-
// Mapping of old extension names to new ones
31-
//
32-
requireMap: {
33-
AMSmath: 'ams',
34-
AMSsymbols: 'ams',
35-
AMScd: 'amscd',
36-
SVG: 'svg',
37-
noErrors: 'noerrors',
38-
noUndefined: 'noundefined'
39-
},
4027
ready() {
41-
// Here and later using recipe from https://github.com/mathjax/MathJax/issues/2705
4228
//
4329
// Get the MathJax modules that we need.
4430
//
4531
const {mathjax} = MathJax._.mathjax;
4632
const {SVG} = MathJax._.output.svg_ts;
47-
48-
// Now using https://docs.mathjax.org/en/v3.2-latest/upgrading/v2.html#version-2-compatibility-example
4933
//
50-
// Replace the require command map with a new one that checks for
51-
// renamed extensions and converts them to the new names.
34+
// Do the normal setup
5235
//
53-
var CommandMap = MathJax._.input.tex.SymbolMap.CommandMap;
54-
var requireMap = MathJax.config.startup.requireMap;
55-
var RequireLoad = MathJax._.input.tex.require.RequireConfiguration.RequireLoad;
56-
var RequireMethods = {
57-
Require: function (parser, name) {
58-
var required = parser.GetArgument(name);
59-
if (required.match(/[^_a-zA-Z0-9]/) || required === '') {
60-
throw new TexError('BadPackageName', 'Argument for %1 is not a valid package name', name);
61-
}
62-
if (requireMap.hasOwnProperty(required)) {
63-
required = requireMap[required];
64-
}
65-
RequireLoad(parser, required);
66-
}
67-
};
68-
new CommandMap('require', {require: 'Require'}, RequireMethods);
69-
MathJax.Callback = function (args) {
70-
if (Array.isArray(args)) {
71-
if (args.length === 1 && typeof(args[0]) === 'function') {
72-
return args[0];
73-
} else if (typeof(args[0]) === 'string' && args[1] instanceof Object &&
74-
typeof(args[1][args[0]]) === 'function') {
75-
return Function.bind.apply(args[1][args[0]], args.slice(1));
76-
} else if (typeof(args[0]) === 'function') {
77-
return Function.bind.apply(args[0], [window].concat(args.slice(1)));
78-
} else if (typeof(args[1]) === 'function') {
79-
return Function.bind.apply(args[1], [args[0]].concat(args.slice(2)));
80-
}
81-
} else if (typeof(args) === 'function') {
82-
return args;
83-
}
84-
throw Error("Can't make callback from given data");
85-
};
86-
//
87-
// Add a replacement for MathJax.Hub commands
88-
//
89-
MathJax.Hub = {
90-
Queue: function () {
91-
for (var i = 0, m = arguments.length; i < m; i++) {
92-
var fn = MathJax.Callback(arguments[i]);
93-
MathJax.startup.promise = MathJax.startup.promise.then(fn);
94-
}
95-
return MathJax.startup.promise;
96-
},
97-
Typeset: function (element, callback) {
98-
var promise = MathJax.typesetSVGPromise([element]).then(
99-
() => {
100-
element.firstElementChild.classList.add("MathJax_SVG");
101-
}
102-
);
103-
if (callback) {
104-
promise = promise.then(callback);
105-
}
106-
return promise;
107-
},
108-
Config: function () {},
109-
Configured: function () {console.log('MathJax cannot be configured like this')},
110-
config: {menuSettings: {renderer: "SVG"}}
111-
};
112-
11336
MathJax.startup.defaultReady();
114-
115-
// Continuing from https://github.com/mathjax/MathJax/issues/2705
11637
//
11738
// Create an SVG output jax and a new MathDocument that uses it.
11839
//
11940
const svgOutput = new SVG(MathJax.config.svg);
12041
const svgDocument = mathjax.document(document, {
121-
...MathJax.config.options,
122-
InputJax: MathJax.startup.input,
123-
OutputJax: svgOutput
42+
...MathJax.config.options,
43+
InputJax: MathJax.startup.input,
44+
OutputJax: svgOutput
12445
});
12546
//
12647
// Define the SVG-based conversion methods
12748
//
128-
MathJax.svgStylesheet = () => svgOutput.styleSheet(svgDocument);
129-
MathJax.typesetSVGPromise = (elements) => {
130-
svgDocument.options.elements = elements;
131-
svgDocument.reset();
132-
return mathjax.handleRetriesFor(() => {
133-
svgDocument.render();
134-
});
49+
MathJax.tex2svg = (math, options = {}) => {
50+
options.format = svgDocument.inputJax[0].name;
51+
return svgDocument.convert(math, options);
52+
};
53+
MathJax.tex2svgPromise = (math, options = {}) => {
54+
options.format = svgDocument.inputJax[0].name;
55+
return mathjax.handleRetriesFor(() => svgDocument.convert(math, options));
13556
};
57+
MathJax.svgStylesheet = () => svgOutput.styleSheet(svgDocument);
13658
}
13759
},
13860
loader: {load: ["output/svg"]},
13961
tex: {
140-
inlineMath: [["\\(", "\\)"], ["$", "$"]],
141-
displayMath: [["\\[", "\\]"], ["$$", "$$"]],
142-
processEscapes: true,
143-
processEnvironments: true,
144-
autoload: {
145-
color: [], // don't autoload the color extension
146-
colorv2: ['color'], // do autoload the colorv2 extension
147-
}
62+
inlineMath: [["\\(", "\\)"], ["$", "$"]],
14863
}
14964
};
15065
</script>
15166
<script src="../../node_modules/mathjax-v3/es5/tex-mml-chtml.js"></script>
152-
<script>
153-
// let plotly.js know that v2 API is mocked
154-
window.MathJax._mockedV2API = true;
155-
</script>
15667
<script charset="utf-8" id="source" type="module">import "../../build/plotly.js"</script>
15768
<script charset="utf-8" src="../../build/test_dashboard-bundle.js"></script>
15869
</body>

src/lib/svg_text_utils.js

Lines changed: 22 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -178,15 +178,6 @@ function texToSVG(_texString, _config, _callback) {
178178
(MathJax.version || '').split('.')[0]
179179
) || -1;
180180

181-
if(MathJax._mockedV2API) {
182-
MathJaxVersion = 2;
183-
} else if(
184-
MathJaxVersion === 3 &&
185-
MathJax.config.startup.output === 'chtml'
186-
) {
187-
Lib.warn('To use both chtml and svg outputs on the page you may consider mocking MathJax-v2 API as illustrated in devtools/test_dashboard/index-mathjax3chtml.html');
188-
}
189-
190181
if(!MathJaxVersion) {
191182
Lib.warn('No MathJax version:', MathJax.version);
192183
}
@@ -214,11 +205,16 @@ function texToSVG(_texString, _config, _callback) {
214205
});
215206
};
216207

217-
var v2SetRenderer = function() {
208+
var setRenderer = function() {
218209
// Get original renderer
219-
originalRenderer = MathJax.Hub.config.menuSettings.renderer;
220-
if(originalRenderer !== 'SVG') {
221-
return MathJax.Hub.setRenderer('SVG');
210+
if(MathJaxVersion < 3) {
211+
originalRenderer = MathJax.Hub.config.menuSettings.renderer;
212+
if(originalRenderer !== 'SVG') {
213+
return MathJax.Hub.setRenderer('SVG');
214+
}
215+
} else {
216+
originalRenderer = MathJax.config.startup.output;
217+
MathJax.config.startup.output = 'svg';
222218
}
223219
};
224220

@@ -260,9 +256,15 @@ function texToSVG(_texString, _config, _callback) {
260256
tmpDiv.remove();
261257
};
262258

263-
var v2ResetRenderer = function() {
264-
if(originalRenderer !== 'SVG') {
265-
return MathJax.Hub.setRenderer(originalRenderer);
259+
var resetRenderer = function() {
260+
if(MathJaxVersion < 3) {
261+
if(originalRenderer !== 'SVG') {
262+
return MathJax.Hub.setRenderer(originalRenderer);
263+
}
264+
} else {
265+
if(originalRenderer !== 'svg') {
266+
MathJax.config.startup.output = originalRenderer;
267+
}
266268
}
267269
};
268270

@@ -276,18 +278,20 @@ function texToSVG(_texString, _config, _callback) {
276278
if(MathJaxVersion < 3) {
277279
MathJax.Hub.Queue(
278280
v2SetConfig,
279-
v2SetRenderer,
281+
setRenderer,
280282
initiateMathJax,
281283
finalizeMathJax,
282-
v2ResetRenderer,
284+
resetRenderer,
283285
v2ResetConfig
284286
);
285287
} else {
288+
setRenderer();
286289
MathJax.startup.defaultReady();
287290
MathJax.startup.promise.then(function() {
288291
initiateMathJax();
289292
finalizeMathJax();
290293
});
294+
resetRenderer();
291295
}
292296
}
293297

0 commit comments

Comments
 (0)