Bug 241910 - SVG SMIL animation in <img> tag breaks upon zooming-in in macOS Safari
Summary: SVG SMIL animation in <img> tag breaks upon zooming-in in macOS Safari
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: Other
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2022-06-23 04:59 PDT by Utkarsh Verma
Modified: 2022-06-30 14:57 PDT (History)
4 users (show)

See Also:

Attachments
SVG-SMIL-pinch-zoom (912.77 KB, image/png)
2022-06-30 14:56 PDT, Said Abou-Hallawa 		no flags Details
SVG-SMIL-menu-zoom (945.66 KB, image/png)
2022-06-30 14:57 PDT, Said Abou-Hallawa 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Utkarsh Verma 2022-06-23 04:59:09 PDT 
I have a few SVG SMIL animation files which run well on every browser. But, when zoomed in on macOS Safari (any version), the animation breaks. It looks like the animation is bleeding through the right and bottom edges.

And, this only happens when the SVG is in an <img> tag. If the SVG is used inline, there is no issue as such.

When the page is zoomed in to 125% on macOS Safari (any version), you'll get,

https://i.stack.imgur.com/WHhLY.gif (one of the files)

To reproduce this bug, open up https://github.com/n3r4zzurr0/svg-spinners/blob/main/README.md, https://loading.io/spinner or http://samherbert.net/svg-loaders/ (as all these links contain SVGs in <img> tags) in macOS Safari (any version) with a zoom level other than 100%.
Comment 2 Radar WebKit Bug Importer 2022-06-30 05:00:14 PDT 
<rdar://problem/96210761>
Comment 3 Said Abou-Hallawa 2022-06-30 14:56:05 PDT 
This bug does not happen with pinch-zoom but it happens with manual zoom: Cmd++ or Main menu/View/zoom in. See the attached screenshots.
Comment 4 Said Abou-Hallawa 2022-06-30 14:56:45 PDT 
Created attachment 460590 [details]
SVG-SMIL-pinch-zoom
Comment 5 Said Abou-Hallawa 2022-06-30 14:57:41 PDT 
Created attachment 460591 [details]
SVG-SMIL-menu-zoom