diff options
Diffstat (limited to 'app/assets/javascripts/behaviors/markdown/render_math.js')
-rw-r--r-- | app/assets/javascripts/behaviors/markdown/render_math.js | 21 |
1 files changed, 11 insertions, 10 deletions
diff --git a/app/assets/javascripts/behaviors/markdown/render_math.js b/app/assets/javascripts/behaviors/markdown/render_math.js index b2348cf0bad..7525fc76d16 100644 --- a/app/assets/javascripts/behaviors/markdown/render_math.js +++ b/app/assets/javascripts/behaviors/markdown/render_math.js @@ -66,16 +66,12 @@ class SafeMathRenderer { el.removeAttribute('style'); if (!forceRender && (this.totalMS >= MAX_RENDER_TIME_MS || text.length > MAX_MATH_CHARS)) { // Show unrendered math code - const wrapperElement = document.createElement('div'); const codeElement = document.createElement('pre'); codeElement.className = 'code'; codeElement.textContent = el.textContent; codeElement.dataset.mathStyle = el.dataset.mathStyle; - const { parentNode } = el; - parentNode.replaceChild(wrapperElement, el); - let message; if (text.length > MAX_MATH_CHARS) { message = sprintf( @@ -103,11 +99,11 @@ class SafeMathRenderer { </div> `; - if (!wrapperElement.classList.contains('lazy-alert-shown')) { + if (!el.classList.contains('lazy-alert-shown')) { // eslint-disable-next-line no-unsanitized/property - wrapperElement.innerHTML = html; - wrapperElement.append(codeElement); - wrapperElement.classList.add('lazy-alert-shown'); + el.innerHTML = html; + el.append(codeElement); + el.classList.add('lazy-alert-shown'); } // Render the next math @@ -125,6 +121,12 @@ class SafeMathRenderer { } try { + if (displayContainer.dataset.mathStyle === 'inline') { + displayContainer.classList.add('math-content-inline'); + } else { + displayContainer.classList.add('math-content-display'); + } + // eslint-disable-next-line no-unsanitized/property displayContainer.innerHTML = this.katex.renderToString(text, { displayMode: el.dataset.mathStyle === 'display', @@ -169,8 +171,7 @@ class SafeMathRenderer { render() { // Replace math blocks with a placeholder so they aren't rendered twice this.elements.forEach((el) => { - const placeholder = document.createElement('span'); - placeholder.style.display = 'none'; + const placeholder = document.createElement('div'); placeholder.dataset.mathStyle = el.dataset.mathStyle; placeholder.textContent = el.textContent; el.parentNode.replaceChild(placeholder, el); |