Bug 251379

Summary: CSS Border-Radius on Container of Video does not properly clip
Product: WebKit Reporter: Jemaleddin Cole <jemal>
Component: CompositingAssignee: Nobody <webkit-unassigned>
Status: REOPENED    
Severity: Normal CC: jer.noble, karlcow, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: All   
OS: All   
See Also: https://bugs.webkit.org/show_bug.cgi?id=159045
Attachments:
Description Flags
A file with two video tags, one that properly uses border radius and one that does not
none
safari, firefox, chrome none

Jemaleddin Cole
Reported 2023-01-30 12:15:13 PST
Created attachment 464757 [details] A file with two video tags, one that properly uses border radius and one that does not Wrapping a video tag in a container and applying a border-radius to it does not clip the video, but applying the same class directly to the video works. The video in the attached file does not work, but still demonstrates the problem. I tested in recent production Mobile and Desktop Safari for Ventura 13.2 and iOS 16.2, as well as Safari Tech Preview on desktop. (Tried to get the most recent desktop Safari build to work, but after fighting sandboxing for 10 minutes I gave up. Apologies!)
Attachments
A file with two video tags, one that properly uses border radius and one that does not (343 bytes, text/html)
2023-01-30 12:15 PST, Jemaleddin Cole 		no flags
Details
safari, firefox, chrome (279.40 KB, image/png)
2023-01-30 22:04 PST, Karl Dubost 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Alexey Proskuryakov
Comment 1 2023-01-30 13:11:19 PST
Possibly a dupe of bug 159045, although it's a div not an iframe here.
Radar WebKit Bug Importer
Comment 2 2023-01-30 13:19:03 PST
<rdar://problem/104834209>
Karl Dubost
Comment 3 2023-01-30 22:04:12 PST
Created attachment 464776 [details] safari, firefox, chrome Note that it doesn't clip the video in any browsers. So Probably expected behavior. And this bug is WORKSFORME or INVALID?
Jemaleddin Cole
Comment 4 2023-01-31 05:29:02 PST
My test may have been deficient - apologies. Please try this more complicated version which does render differently in Safari than Firefox or Chrome: https://codepen.io/nhall/pen/qByMjQy
Simon Fraser (smfr)
Comment 5 2023-01-31 09:53:57 PST
There have been some fixes for border-radius clipping recently. Please test in Safari Tech Preview, where your test renders correctly for me in 162.
Note You need to log in before you can comment on or make changes to this bug.