Version : 537.36 Reproduced on Chrome 43 and Safari Hello, I encounter a CSS problem using the brightness filter and transition filter on an image. Here is a simple example : <style> div { border: 4px solid #fff; border-radius: 50%; overflow: hidden; } img { -webkit-filter: brightness(0.8); -webkit-transition: -webkit-filter 1s ease-out; width: 100%; } img:hover { -webkit-filter: brightness(0.6); } </style> <div> <img src="http://i0.kym-cdn.com/photos/images/facebook/000/581/722/7bc.jpg"> </div> Or see directly : http://codepen.io/bqlou/pen/rVvLXK Expected result : when hovering the image, brightness applies to the image Actual result : when hovering the image, brightness applies to the image without repainting the whole picture during the transition
The bug here is that we're not taking the border-radius into account for the composited clip while the transition is running. I think we have another bug on this.
<rdar://problem/21766718>
The problem is more general. Any layer that has an "ancestor clipping layer" that's affected by corner radius doesn't take the radius into account.
Created attachment 278406 [details] WIP
Attachment 278406 [details] did not pass style-queue: ERROR: Source/WebCore/rendering/RenderLayer.h:817: The parameter name "context" adds no information, so it should be removed. [readability/parameter_name] [5] Total errors found: 1 in 14 files If any of these errors are false positives, please file a bug against check-webkit-style.
*** Bug 203558 has been marked as a duplicate of this bug. ***
*** This bug has been marked as a duplicate of bug 68196 ***