Reference clip-path doesn't work on <video> element 
https://bugs.webkit.org/show_bug.cgi?id=200381
Summary Reference clip-path doesn't work on <video> element
Xidorn Quan
Reported 2019-08-01 22:00:26 PDT
Created attachment 375394 [details] testcase See the attached testcase, the <video> element is not shown. This works as expected on Firefox and Chrome.
Attachments
testcase (554 bytes, text/html)
2019-08-01 22:00 PDT, Xidorn Quan 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2019-08-02 13:30:18 PDT
<rdar://problem/53876983>
Simon Fraser (smfr)
Comment 2 2019-08-02 15:23:43 PDT
Huh I thought I made this work.
Simon Fraser (smfr)
Comment 3 2019-08-02 15:24:30 PDT
Oh, I don't think we support the reference syntax.
Xidorn Quan
Comment 4 2019-08-02 15:45:07 PDT
There are two elements in the testcase both using the same syntax for clip-path. It works on the <div> but not the <video>.
Xidorn Quan
Comment 5 2019-08-02 15:46:21 PDT
Oh, I see what you mean.
Simon Fraser (smfr)
Comment 6 2019-08-02 16:07:13 PDT
The <div> one will be software-painted, the <video> one will be on GraphicsLayer.
Simon Fraser (smfr)
Comment 7 2022-08-15 10:50:03 PDT
The video referenced by the testcase no longer exists, so the testcase is not valid.
Yegor
Comment 8 2022-09-06 13:57:52 PDT
Here's a fresh repro along with a workaround: https://jsfiddle.net/yjbanov/nh9jzLba/35/ Setting style.width and style.height to 100% fixes the issue. Remove the lines that set it and Safari will stop showing the video.
Note You need to log in before you can comment on or make changes to this bug.