Bug 251371 - Webkit renders math formula in SVG format improperly
Summary: Webkit renders math formula in SVG format improperly
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: Safari 16
Hardware: Mac (Apple Silicon) macOS 13
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-01-30 09:18 PST by hzcheng15
Modified: 2023-08-11 17:48 PDT (History)
5 users (show)

See Also:


Attachments
screenshot of the jagged formula (102.28 KB, image/png)
2023-01-30 09:18 PST, hzcheng15
no flags Details
screenshot (362.58 KB, image/png)
2023-02-03 13:04 PST, hzcheng15
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description hzcheng15 2023-01-30 09:18:57 PST
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
Comment 1 Alexey Proskuryakov 2023-01-30 13:49:52 PST
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?
Comment 2 Radar WebKit Bug Importer 2023-01-30 13:50:11 PST
<rdar://problem/104835667>
Comment 3 hzcheng15 2023-01-30 17:36:20 PST
(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.
Comment 4 hzcheng15 2023-01-30 17:37:22 PST
The intel MBP is using Monterey 12.6.2
Comment 5 Said Abou-Hallawa 2023-01-31 12:17:52 PST
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.
Comment 6 Alexey Proskuryakov 2023-01-31 12:34:26 PST
I have macOS Ventura 13.2 on M1. The webpage looks good, but the direct SVG URL shows jagged text.
Comment 7 hzcheng15 2023-01-31 15:11:50 PST
(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
Comment 8 hzcheng15 2023-01-31 15:15:32 PST
(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>
Comment 9 hzcheng15 2023-02-03 13:04:43 PST
Created attachment 464827 [details]
screenshot
Comment 10 hzcheng15 2023-02-03 13:05:52 PST
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.
Comment 11 hzcheng15 2023-08-11 17:48:29 PDT
(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/