| Summary: | REGRESSION (r292400): Animating and focusing a button inside of "overflow: clip" container causes button to disappear | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Liam DeBeasi <ldebeasi> | ||||||
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||||
| Severity: | Normal | CC: | akeerthi, bfulgham, graouts, koivisto, rego, simon.fraser, webkit-bug-importer, zalan | ||||||
| Priority: | P2 | Keywords: | InRadar | ||||||
| Version: | Safari 15 | ||||||||
| Hardware: | Unspecified | ||||||||
| OS: | Unspecified | ||||||||
| See Also: | https://bugs.webkit.org/show_bug.cgi?id=236782 | ||||||||
| Attachments: |
|
||||||||
Same as bug 238088? Created attachment 459547 [details]
Code reproduction (with div)
This appears to be a different issue. The linked issue notes that the behavior only happens on <button> elements and does not happen on <div> elements. The issue reported here reproduces on both.
I attached a new code reproduction showing this. The steps to reproduce are the same.
(In reply to Simon Fraser (smfr) from comment #1) > Same as bug 238088? I don't think so since that bug was fixed in macOS 12.5 but this bug reproduces in this build. Changed the title as this bug repros with "overflow: clip". While it regressed at r292400, I think that change just surfaced some old repaint(overflow?) bug here. This doesn't repro for me with trunk Webkit or the current iOS/Mac Safari betas. |
Created attachment 459546 [details] Code reproduction Animating and then focusing a button inside of a contain: paint container causes the button to disappear. Steps to reproduce: 1. Open the attached code reproduction in Safari (iOS or macOS). 2. Click the "Show Menu" button. Observe that a button translates in and then disappears. Expected Behavior: I expect the button to remain visible after the animation ends. Actual Behavior: The button disappears after the animation ends. Additional Info: - I can reproduce this on iOS 15.5 and Safari 15.5. - This issue only reproduces when the document direction is RTL. LTR works as expected. - This works as expected on Chrome and Firefox. There are a couple things that fix the issue: - Transforming the button using translateX instead of translate3d - Focusing the button in a requestAnimationFrame