RESOLVED CONFIGURATION CHANGED 247546
element.animate on pseudoElement can overflow border-radius 
https://bugs.webkit.org/show_bug.cgi?id=247546
Summary element.animate on pseudoElement can overflow border-radius
sorvell
Reported 2022-11-06 06:55:27 PST
When `element.animate` is called with a `pseudoElement` target (e.g. `::after`) and the pseudo element is transformed (e.g. via `scale`) to be larger than the containing element's dimensions and the element has `overflow: hidden` with a `border-radius` set, the psuedo-element incorrectly overflows the element's border-radius during the animation. Note, this behavior does not occur on Chrome or Firefox. REPRODUCTION: https://lit.dev/playground/#gist=c313d05987201bea072e2d5f6381a67e. WORKAROUND: Applying an explicit `transform: scale(1)` to the containing element fixes the issue.
Attachments
Add attachment proposed patch, testcase, etc.
Simon Fraser (smfr)
Comment 1 2022-11-09 11:30:06 PST
Does this still reproduce in Safari Tech Preview?
sorvell
Comment 2 2022-11-09 15:57:40 PST
Does not reproduce on Safari Tech Preview. Looks like it's fixed.
Simon Fraser (smfr)
Comment 3 2022-11-09 16:06:51 PST
Thanks for checking.
Note You need to log in before you can comment on or make changes to this bug.