Created attachment 470481 [details] Issue Hello, I am experiencing another very odd issue with Safari on animations. The issue is not reproducible on Firefox nor Chrome. I have been unable to re-create a minimal example so it might be a combination of factors. The issue is reproducible on Safari 16.5, 17.4 and TP. To reproduce the issue, you need to use this page: https://stretch-theme-dev.myshopify.com Enter into the store using the password rewblo To reproduce the issue, click on the "Catalog" link in the header to open a dropdown menu. The code uses an animation to reveal the menu, and commit the final styles (opacity: 1). However, on Safari only, the menu completely disappears once the animation has ended, despite the style being properly applied on the element (see attached screenshot). The only way I have found to solve the issue is by adding a `will-change: transform` on the element, but this seems like an odd fix. Thanks.
I've been able to find the code causing the issue. It is actually the overflow-x: clip being applied on the "shopify-section" class. I am not sure though why this style prevent the animation to work correctly.
I have a hunch about what this might be (related to bug 266926).
<rdar://problem/125239811>
Hello, In order to continue our development we had to remove the code that caused the issue on Safari so you won't be able to reproduce it on the URL I gave. To reproduce the issue again, please add the following code: .shopify-section { overflow-x: clip; } This will allow to trigger again the issue explained in this ticket.
Created attachment 470616 [details] Reduction This is about `overflow-x: clip` also clipping in the Y axis in a compositing layer.
Created attachment 470617 [details] Reduction
In `RenderLayer::calculateLayerBounds()` we hit the `UseLocalClipRectIfPossible` code path. RenderLayer::clipRectRelativeToAncestor() calls `calculateRects()` which does the right thing for foregroundRect, but doesn't extend in Y for the backgroundRect.
I need to study foreground and background clip rects, first introduced in https://commits.webkit.org/4548@main