Katex: 3x3 and above matrices render with a break in the delimiters

[ganeshbelgur]

Any 3x3 matrix or a higher order square matrix renders with a tiny break in the delimiters. This nit picky detail can be a bother when the matrix is viewed on a huge screen. Can this be fixed?

Environment

Joplin version: 1.0.179
Platform: Linux
OS specifcs: Ubuntu 18.04.4 LTS

Steps To Reproduce

1. Enter the following latex code in the markdown editor

$$
\begin{pmatrix}
    a & b & c\\
    a & b & c\\
    a & b & c\\
    a & b & c
\end{pmatrix}
$$

2. The matrix should appear in the preview pane or you could also try a PDF or an HTML export to view the issue.

Describe what you expected to happen

When the above 4x3 matrix was rendered using the editor at https://katex.org/, the delimiters appear to be fine. So, it seems like the issue is not originating from the Katex engine. If you notice Joplin's render of the matrix above, the tapering of the delimiters towards the top and bottom seems a bit off, too.

Thank you for considering my issue.

[ganeshbelgur]

@tessus and @laurent22,

Additionally, Katex itself has some issues when rendering a 3x3 matrix. In the example above, I specifically chose a 4x3 matrix to demonstrate the problem in Joplin so that we don't get caught up with the problem in Katex. Take a look at KaTeX/KaTeX#2198.

If the fonts get modified, don't you think storing new font format files into Joplin can soon turn into a burden when the updates roll in each time? :)

[tessus]

If the fonts get modified, don't you think storing new font format files into Joplin can soon turn into a burden when the updates roll in each time? :)

There's not much we can do, if we want to keep Joplin self contained.

[laurent22]

Fonts are auto-copied from node_modules so when we upgrade Katex the fonts are upgraded too.

[tessus]

@laurent22 copied to where? there are 3 directories for fonts. See my PR for a detailed explanation. Very confusing.

[laurent22]

Each app needs its own copy of the fonts, but npm i should take care of that.

The only place where the fonts are in the repo is in joplin-renderer/assets and in theory they could be removed from there too (they are generated by Tools/buildAssets.js), but due to the electron-builder bug we need this folder to have everything pre-built. The way to add a plugin asset is by updating buildAssets.js

[tessus]

Ah, you removed the directories just now. When I opened the PR, the fonts were all over the place. This means I have to update my PR to only add the file to ReactNativeClient/lib/joplin-renderer/assets/katex/fonts/KaTeX_Size4-Regular.woff2

[ganeshbelgur]

Thank you both for the fix, really appreciate it. :)