CSS clip-path is a stacking context effect, and should be applied to effect output. In our current code CLM applies clip-path to composited children as a mask layer child_clipping_mask_layer_.
For non-pixel-moving effects, it is alright because clip and effect commute. However for pixel-moving effects like blur, the result will be incorrect.
For example (http://jsbin.com/mituqevama/):
<div style="clip-path:circle(); filter:blur(10px); width:100px; height:100px;">
<div style="background:red; position:relative; left:-100px; top:-100px; width:300px; height:300px; will-change:transform;"></div>
</div>
Expectation(http://jsbin.com/godopuwiqi/):
<div style="clip-path:circle(); width:100px; height:100px; background:red;"></div>
The expected result should be a sharp red circle, not blurry red circle.
Comment 1 by trchen@chromium.org
, Dec 6 2017