Bug 251371 – Webkit renders math formula in SVG format improperly

• Status: NEW
• Component: SVG

Created attachment 464754 [details]
screenshot of the jagged formula

After upgrading to Ventrua with a M2 MBP, I first noticed in Safari some MathJax formulas are not rendered properly: there're jagged. But chrome does not have the same problem. So I suspect it's a Webkit issue. Then I downloaded a SVG for a formula and checked it with quicklook and got the same results. Other apps that use webview also have the same problem.

Links:
* A webpage that is influenced by this bug:https://en.wikipedia.org/wiki/Master_theorem_(analysis_of_algorithms)
* The math svg url: https://wikimedia.org/api/rest_v1/media/math/render/svg/f69f193e42b5d69ad0d6f4c165724e2d3e1de9ac

[Alexey Proskuryakov]

It sounds like this may be a change from macOS Monterey to Ventura; do you happen to have a way to positively confirm that this is a regression?

[Radar WebKit Bug Importer]

<rdar://problem/104835667>

(In reply to Alexey Proskuryakov from comment #1)
> It sounds like this may be a change from macOS Monterey to Ventura; do you
> happen to have a way to positively confirm that this is a regression?

I just tried with another 2020 intel MBP and it works fine. Also, I noticed that when connecting to an external monitor and selecting no-retina option in easyRes(http://easyresapp.com) the render result is the worst.

The intel MBP is using Monterey 12.6.2

[Said Abou-Hallawa]

I am having difficulty reproducing this bug when visiting the links up on macOS Ventura and ToT WebKit. It may happen only when upgrading from Monterey to Ventura. My  Ventura was a clean install.

[Alexey Proskuryakov]

I have macOS Ventura 13.2 on M1. The webpage looks good, but the direct SVG URL shows jagged text.

(In reply to Said Abou-Hallawa from comment #5)
> I am having difficulty reproducing this bug when visiting the links up on
> macOS Ventura and ToT WebKit. It may happen only when upgrading from
> Monterey to Ventura. My  Ventura was a clean install.

I'm using a machine with factory default Ventura

(In reply to hzcheng15 from comment #7)
> (In reply to Said Abou-Hallawa from comment #5)
> > I am having difficulty reproducing this bug when visiting the links up on
> > macOS Ventura and ToT WebKit. It may happen only when upgrading from
> > Monterey to Ventura. My  Ventura was a clean install.
> 
> I'm using a machine with factory default Ventura

It's indeed a SVG issue, because I also tried mathajx and katex with options that turn the outputs to <span> and other elements, and they're all ok.

The only problematic configuration with mathjax is


    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
          extensions: ["tex2jax.js", "TeX/AMSmath.js"],
          jax: ["input/TeX", "output/SVG"],
      })
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=default"></script>

Created attachment 464827 [details]
screenshot

It seems if we turn off the box alignment everything will be fine, which explains why some formulas look good while others do not even on the same page.

(In reply to Alexey Proskuryakov from comment #1)
> It sounds like this may be a change from macOS Monterey to Ventura; do you
> happen to have a way to positively confirm that this is a regression?

Update: if I disable "Full Page Accelerated Drawing" from the debug menu this bug will disappear, while the MotionMark1.2 score will drop significantly then.

I'm pretty sure there're other people suffering from the same bug: https://www.reddit.com/r/MacOS/comments/zz9yjh/is_there_a_way_i_can_fix_mathjax_font_on_safari/