| Summary: | Border-radius clipping on a stacking context causes descendants to not render | ||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Simon Fraser (smfr) <simon.fraser> | ||||||||||||||
| Component: | Layout and Rendering | Assignee: | Simon Fraser (smfr) <simon.fraser> | ||||||||||||||
| Status: | RESOLVED FIXED | ||||||||||||||||
| Severity: | Normal | CC: | commit-queue, dino, simon.fraser, sun.shin, thorton | ||||||||||||||
| Priority: | P2 | ||||||||||||||||
| Version: | 528+ (Nightly build) | ||||||||||||||||
| Hardware: | Unspecified | ||||||||||||||||
| OS: | Unspecified | ||||||||||||||||
| Bug Depends on: | |||||||||||||||||
| Bug Blocks: | 138551 | ||||||||||||||||
| Attachments: |
|
||||||||||||||||
I have a fix for this. Created attachment 244842 [details]
Patch
I have verified that this change resolve the issue clearly on Mac Platform. Thanks Simon. I have found an issue on "Testcase that asserts on non-Mac" of https://bugs.webkit.org/show_bug.cgi?id=138551. It does not work on second test. When container has border radius and clippingLayer with an offset value, it may need to apply border radius to container not to clippingLayer and then update offset value.
I have created a patch for it.
One issue is when I change the offset value of clip Layer using inspector, it does not work well.
// The clipping strategy depends on whether the rounded rect has equal corner radii.
void GraphicsLayerCA::updateClippingStrategy(PlatformCALayer& clippingLayer, RefPtr<PlatformCALayer>& shapeMaskLayer, const FloatRoundedRect& roundedRect
)
{
@@ -2085,7 +2072,15 @@ void GraphicsLayerCA::updateClippingStrategy(PlatformCALayer& clippingLayer, Ref
clippingLayer.setCornerRadius(0);
clippingLayer.setMask(shapeMaskLayer.get());
- FloatRoundedRect offsetRoundedRect(clippingLayer.bounds(), roundedRect.radii());+
+ FloatRoundedRect offsetRoundedRect(roundedRect);
+
+ FloatRect clipRect = clippingLayer.bounds();
+ FloatPoint3D clipPos = clippingLayer.position();
+ FloatSize clipOffset = FloatSize(-(clipPos.x() - clipRect.width()/2), -(clipPos.y() - clipRect.height()/2));
+
+ offsetRoundedRect.move(clipOffset);
+
shapeMaskLayer->setShapeRoundedRect(offsetRoundedRect);
}
Created attachment 245090 [details]
test-result
Created attachment 245091 [details]
test-result-expected
Created attachment 245093 [details]
clip and border radius test
Created attachment 245405 [details]
Patch
Comment on attachment 245405 [details] Patch Clearing flags on attachment: 245405 Committed r179369: <http://trac.webkit.org/changeset/179369> All reviewed patches have been landed. Closing bug. |
Created attachment 244747 [details] Testcase Attached testcase shows a bug with border-radius clipping on a stacking context, with composited descendants.