Add latest changes from gitlab-org/security/gitlab@16-4-stable-ee

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);