Weird behavior of css clip-path when trying to create multiple clippling areas using the polygon shape 
https://bugs.webkit.org/show_bug.cgi?id=146539
Summary Weird behavior of css clip-path when trying to create multiple clippling area...
Said Abou-Hallawa
Reported 2015-07-01 20:25:58 PDT
Created attachment 255987 [details] test case Open the attached test case. It has four <div> elements, each of them clips a red rectangle using a css clip-path. The css clip-paths use polygons to create different multiple clipping areas. A clipping area is closed by returning to the first point. This allows multiple areas to be created by a single polygon shape. The clip-paths in the test case represent the combinations of three clipping areas. When two areas are included, the clipping works fine. But when the three clipping areas are included, something wrong happens. The points of areas connect each other. I could not the specs that explains how to create multiple clipping areas by a single polygon. If it is not spec-ed, then we still have a bug with the first three cases: the two shapes should not be separated. We may also have a bug in the specs for not providing a way to create a "real path" for the css clip-path.
Attachments
test case (1.04 KB, text/html)
2015-07-01 20:25 PDT, Said Abou-Hallawa 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2015-07-02 11:35:13 PDT
<rdar://problem/21656455>
Note You need to log in before you can comment on or make changes to this bug.