From 6d7f839b1d06ac1a5623e902886d26f301517fdf Mon Sep 17 00:00:00 2001 From: zeripath Date: Mon, 16 Jan 2023 10:25:46 +0000 Subject: [PATCH] Fix environments for KaTeX and error reporting (#22453) Backport #22453 In #22447 it was noticed that display environments were not working correctly. This was due to the setting displayMode not being set. Further it was noticed that the error was not being displayed correctly. This PR fixes both of these issues by forcibly setting the displayMode setting and corrects an error in displayError. Fix #22447 Signed-off-by: Andrew Thornton --- web_src/js/markup/math.js | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/web_src/js/markup/math.js b/web_src/js/markup/math.js index 5790a327a51f6..cfd058c93cc8e 100644 --- a/web_src/js/markup/math.js +++ b/web_src/js/markup/math.js @@ -1,6 +1,6 @@ function displayError(el, err) { const target = targetElement(el); - target.remove('is-loading'); + target.classList.remove('is-loading'); const errorNode = document.createElement('div'); errorNode.setAttribute('class', 'ui message error markup-block-error mono'); errorNode.textContent = err.str || err.message || String(err); @@ -23,12 +23,16 @@ export async function renderMath() { for (const el of els) { const source = el.textContent; - const options = {display: el.classList.contains('display')}; + const displayMode = el.classList.contains('display'); + const nodeName = displayMode ? 'p' : 'span'; try { - const markup = katex.renderToString(source, options); - const tempEl = document.createElement(options.display ? 'p' : 'span'); - tempEl.innerHTML = markup; + const tempEl = document.createElement(nodeName); + katex.render(source, tempEl, { + maxSize: 25, + maxExpand: 50, + displayMode, + }); targetElement(el).replaceWith(tempEl); } catch (error) { displayError(el, error);