Bug 289473
| Summary: | Ungraceful degradation for dialog exit animations | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Jeroen Zwartepoorte <jeroen.zwartepoorte> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED DUPLICATE | ||
| Severity: | Normal | CC: | bfulgham, florian, graouts, ntim, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari Technology Preview | ||
| Hardware: | Mac (Apple Silicon) | ||
| OS: | macOS 15 | ||
Jeroen Zwartepoorte
https://codepen.io/argyleink/pen/zYbQBOm
In STP 214:
1. Click the "Show Dialog" button
2. The dialog and backdrop fadein ✅
3. Click the "Close" button in the dialog
3.1 The backdrop disappears immediately ✅
3.2 The dialog moves from the center of the page to near the top of the page ❌
3.3 The dialog fades out ✅
In Firefox, it degrades gracefully: no movement and no animation. The dialog+backdrop just disappears.
I expect STP to *not* do step 3.2.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Jeroen Zwartepoorte
You can work around the broken exit animation, by doing:
```css
@supports not (overlay: auto) {
transition-duration: 0s;
}
```
Using this, can get WebKit to behave the same as FF on the exit animation. It won't affect Chromium.
Radar WebKit Bug Importer
<rdar://problem/146701656>
Tim Nguyen (:ntim)
This is because the demo uses the `overlay` CSS property which is not supported by WebKit.
*** This bug has been marked as a duplicate of bug 276727 ***