Issue a warning on equations if those cannot be rendered

Hi there,
I’d like to request a warning if a Katex equaltion or formula cannot be rendered.
That would be helpful to see in advance.
Let me know, what you think of that.

markdown,

the conversion is usually done at runtime, so you will have to access all pages to check.

with the transform.ToMath (experimental) it’s compile time.

For both options there’s a ThrowOnError to tell KaTex to fail. see docs.

asciidoc

have you tried to raise the failurelevel?

Hello irkode,
thank you for looking into - I tried with --logLevel debug but this gives me only file based granularity, no info about a single equation
And, yes,l use asciidoc…

How are you inserting mathematical markup into your content? Directly? With a shortcode? Please provide an example of your .adoc file.

Here is an example

==== Der Ringoszillator
Eine weitere gängige Taktgeberquelle ist der Ringoszillator.
Der Trick besteht darin, eine ungerade Anzahl von Inverter-Gates zu verketten und den Ausgang des letzten Inverters als Eingang
für den ersten Inverter zu verwenden. Auf diese Weise entsteht ein Schwingkreis.

image:../images/how_does_cpu/inverter_chain.svg[width=„400px“]

Die Frequenz hängt von der Anzahl der Inverter sowie von der Laufzeit Tp ab (siehe Gleichung unten). Die Zeit, die das Signal benötigt, um
durch das Gate zu laufen, wird als Laufzeit Tp bezeichnet.

[role=„image“,„../images/how_does_cpu/ring_oscillator_frequency.svg“,imgfmt=„svg“, width=„40%“]
\[f_{ro} = \frac{1}{2nT_{p}}\]

In an AsciiDoc document I would expect to see something like this:

[stem]
++++
f_{ro} = \frac{1}{2nT_{p}}
++++

Instead, it looks like you’re relying on katex.js to do the rendering.

Please post:

  1. The [markup.asciidocExt] section of your site configuration.
  2. An example of mathematical markup that cannot be rendered

My config.toml contains the following:



[security]
  enableInlineShortcodes = false
  [security.exec]
    allow = ['^dart-sass-embedded$', '^go$', '^npx$', '^postcss$', '^asciidoctor$']
    osEnv = ['(?i)^(PATH|PATHEXT|APPDATA|TMP|TEMP|TERM)$']

[markup.asciidocext]
    extensions = ["asciidoctor"]
    workingFolderCurrent = true
    trace = true
    verbose = true

One example that doesnt work is this:

[p \land q = q \land p] |[p \lor q = q \lor p]

Just seeing it now - happy birthday, Joe Mooring

remembering from the past you had a quite special setup regarding hugo and maybe also asciidoctor.

is there anything special as of now regarding Hugo or Asciidoctor apart from the official installation guides.

i’ve seen some gitlab discussions about KaTex rendering in asciidoctor using \[ and \] delimiter - but for me it looks like never merged.

asciidoctor -version
Asciidoctor 2.0.23 [https://asciidoctor.org]
Runtime Environment (ruby 3.3.6 (2024-11-05 revision 75015d4c1f) [x64-mingw-ucrt]) (lc:IBM437 fs:UTF-8 in:UTF-8 ex:UTF-8)

what’s your version?

and as usual a stripped down version of your setup will help. incl just one or two pages with a working and non working equation to replay.

Tested with foo.adoc.

With this in the head section of the base template…

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css" integrity="sha384-n8MVd4RsNIU0tAv4ct0nTaAbDJwPJzDEaqSD1odI+WdtXRGWt2kTvGFasHpSy3SV" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js" integrity="sha384-XjKyOOlGwcjNTAIQHIpgOno0Hl1YQqzUOEleOLALmuqehneUG+vnGctmUb0ZY0l8" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js" integrity="sha384-+VBxd3r6XgURycqtZ117nYw44OOcIax56Z4dCRWbxyPt0Koah1uHoK0o4+/RRE05" crossorigin="anonymous"></script>
<script>
  document.addEventListener("DOMContentLoaded", function() {
    renderMathInElement(document.body, {
      delimiters: [
        {left: '\\[', right: '\\]', display: true},   // block
        {left: '\\(', right: '\\)', display: false},  // inline
      ],
      throwOnError : false
    });
  });
</script>

And this content…

\[[p \land q = q \land p] |[p \lor q = q \lor p]\]

I see this:

image

Which is exactly how it is rendered on https://katex.org/.

1 Like

if I change that to: \[[p \lan q = q \land p] |[p \lor q = q \lor p]\]

with the above setup it renders as:

image

and if I set throwOnError : true you’ll see an error in the browser console:

which leads to:

what about a feature, that the livereload catches these error and sends them to the server and that outputs a (supressable?) warning - would at least help all to recon js errors :wink: guess we have to wait for that til next year :wink:

The error callback opens an alert with the important part of the error stack:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css" integrity="sha384-n8MVd4RsNIU0tAv4ct0nTaAbDJwPJzDEaqSD1odI+WdtXRGWt2kTvGFasHpSy3SV" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js" integrity="sha384-XjKyOOlGwcjNTAIQHIpgOno0Hl1YQqzUOEleOLALmuqehneUG+vnGctmUb0ZY0l8" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js" integrity="sha384-+VBxd3r6XgURycqtZ117nYw44OOcIax56Z4dCRWbxyPt0Koah1uHoK0o4+/RRE05" crossorigin="anonymous"></script>
<script>
  document.addEventListener("DOMContentLoaded", () => {
    renderMathInElement(document.body, {
      delimiters: [
        { left: '\\[', right: '\\]', display: true }, // block
        { left: '$$', right: '$$', display: true },   // block
        { left: '\\(', right: '\\)', display: false }, // inline
      ],
      throwOnError: true,
      errorCallback: (msg, error) => alert(error.stack.split('\n')[0]),
    });
  });
</script>

Hugo handles events that occur during the build. JavaScript error handling is somebody else’s problem.

1 Like

Okay, so what do I need to do in the source files – adding the katex.js I suppose.
Should I add it in the style? Or why is it not existing in the source file?

Are you saying that you were expecting the mathematical markup to be rendered without loading katex.js in the first place???

No, I thought it (katex.js) would be part of the theme I use, hugo-book and working out-of-the-box.
But probably I was wrong…

Why not use the katex shortcode that’s included with the theme?