fix: handle errors during KaTeX rendering in MathBlockNode and MathInlineNode components

Author: Simon-He95

src/components/MathBlockNode/MathBlockNode.vue

@@ -95,15 +95,19 @@ async function renderMath() {
           katex = await getKatex()
         }
         if (katex) {
-          const html = katex.renderToString(props.node.content, {
-            throwOnError: false,
-            displayMode: true,
-          })
-          mathBlockElement.value.innerHTML = html
-          hasRenderedOnce = true
-          renderingLoading.value = false
-          // populate worker client cache so future calls hit cache
-          setKaTeXCache(props.node.content, true, html)
+          try {
+            const html = katex.renderToString(props.node.content, {
+              throwOnError: props.node.loading,
+              displayMode: true,
+            })
+            mathBlockElement.value.innerHTML = html
+            hasRenderedOnce = true
+            renderingLoading.value = false
+            // populate worker client cache so future calls hit cache
+            setKaTeXCache(props.node.content, true, html)
+          }
+          catch {
+          }
           return
         }
       }

src/components/MathInlineNode/MathInlineNode.vue

@@ -85,12 +85,17 @@ async function renderMath() {
           katex = await getKatex()
         }
         if (katex) {
-          const html = katex.renderToString(props.node.content, { throwOnError: false, displayMode: false })
-          renderingLoading.value = false
-          mathElement.value.innerHTML = html
-          hasRenderedOnce = true
-          // populate worker client cache for inline as well
-          setKaTeXCache(props.node.content, false, html)
+          try {
+            const html = katex.renderToString(props.node.content, { throwOnError: props.node.loading, displayMode: false })
+            renderingLoading.value = false
+            mathElement.value.innerHTML = html
+            hasRenderedOnce = true
+            // populate worker client cache for inline as well
+            setKaTeXCache(props.node.content, false, html)
+          }
+          catch {
+          }
+
           return
         }
       }