299823 2025-09-29 14:10:33 -0700 REGRESSION(294049@main): starting an animation via el.animate().reverse only works every other time 2025-10-13 09:25:25 -0700 1 1 1 Unclassified WebKit Animations Safari 26 Mac (Intel) macOS 26 RESOLVED FIXED https://bugs.webkit.org/show_bug.cgi?id=290993 InRadar P2 Normal --- 1 caleb graouts graouts graouts karlcow stephen webkit-bug-importer oldest_to_newest 2146954 0 caleb 2025-09-29 14:10:33 -0700 jsfiddle: https://jsfiddle.net/n962tryh/ - Safari 18 animates the div every button click - Safari 26 animates the 1st, 3rd, 5th... times - Firefox animates every click - Chrome animates every click I don't know Web Animations well enough to know what should happen, or if this is an under-specified area, but it broke our app. It's possibly Intel-specific: my colleague was not able to reproduce on Apple Silicon 2146975 1 stephen 2025-09-29 15:36:50 -0700 Can confirm with Safari 26.0.1 on Sequoia as well. Versions 15.7 and 15.7.1. But only on a Mini with an Intel CPU. No bug observed on a different M4 Mini. 2148837 2 webkit-bug-importer 2025-10-06 14:11:10 -0700 <rdar://problem/162067522> 2148995 3 graouts 2025-10-06 23:37:11 -0700 It's not Intel-specific, I can reproduce this with Safari 26.0.1 on macOS Tahoe 26.0.1 (25A362). Will find the regression point. 2148997 4 graouts 2025-10-06 23:42:12 -0700 It appears to already have been broken in 294709@main. 2149093 5 graouts 2025-10-07 07:26:50 -0700 The regression range is https://commits.webkit.org/compare/294072@main...294026@main. This most likely this regressed with 294049@main, the fix for bug 290993. 2150310 6 graouts 2025-10-12 01:03:27 -0700 Oddly enough this does not reproduce with the HTML and JS code pasted into an HTML file. But it does within the iframe on jsfiddle. 2150319 7 graouts 2025-10-12 05:39:25 -0700 I expect this is going to be something to do with throttling. 2150321 8 graouts 2025-10-12 06:05:13 -0700 There's really something specific to jsfiddle here. If I call `document.getAnimations()[0].cancel()` after the page is loaded, the bug stops reproducing. 2150322 9 graouts 2025-10-12 06:08:08 -0700 So there's some bad interaction between the CSS Animation applied to the "AN" avatar in the page's top bar above the HTML and the animation in the content. Will try to reduce this, but it's quite odd. 2150357 10 graouts 2025-10-12 13:12:20 -0700 This can be reduced to a host document running a constant background-color animation while a child document, hosted via an <iframe>, animates using the reverse() method. 2150460 11 graouts 2025-10-13 00:10:51 -0700 I think this is due to timers being throttled in iframes and the call to `AnimationTimelinesController::processPendingAnimations()` taking longer than expected to run, only after the next animation resolution, and thus the animation never getting a committed start time. 2150484 12 stephen 2025-10-13 03:15:01 -0700 Just a note to add that we encountered the bug in our application, which does not use Iframes. So it is NOT strictly an iframe issue 2150488 13 graouts 2025-10-13 03:32:46 -0700 So far I've only managed to reproduce the issue in the context of iframes where timing is different… but since this is a timing issue, I expect this may occur depending on the JavaScript performance. If you can make a reduction that does not involve iframes, it would be good to see it as well. 2150492 14 graouts 2025-10-13 03:53:25 -0700 Pull request: https://github.com/WebKit/WebKit/pull/52233 2150495 15 stephen 2025-10-13 04:24:52 -0700 Looks like the issue has been found, but for completeness, unfortunately our application code is too complex to share easily (and is also proprietary) but the fact that we could easily reproduce on Intel clients but not Apple Silicon clients definitely supports the idea that it's timing/performance related. I can share the workaround we deployed, if that's helpful. Broken: ``` const animation = el.animate(keyframes, {duration: 200}); animation.addEventListener("finish", done); if (reverse) animation.reverse(); ``` Works: ``` if (reverse) keyframes.reverse(); const animation = el.animate(keyframes, {duration: 200}); animation.addEventListener("finish", done); ``` 2150560 16 ews-feeder 2025-10-13 09:25:23 -0700 Committed 301414@main (841997317f49): <https://commits.webkit.org/301414@main> Reviewed commits have been landed. Closing PR #52233 and removing active labels.