Bug 310181 – View transition snapshots can capture stale transform values for accelerated CSS transform animations

• Status: RESOLVED
• Resolution: FIXED
• Component: Compositing

[Kyouhei Horizumi]

Created attachment 478713 [details]
Reduced testcase demonstrating stale snapshot capture during `document.startViewTransition()`.

# Summary

When `document.startViewTransition()` is triggered while a CSS transform animation is running in Safari/WebKit, the old snapshot may be captured using a stale transform value instead of the visually current animated transform.
This causes `::view-transition-old(root)` to appear slightly behind the on-screen animation state, producing a visible jump at transition start.

# Steps to reproduce

1. Open the attached test case.
2. Wait until the spinner is rotating.
3. Click "Start ViewTransition (DOM swap)" while the animation is in progress.
4. Observe the old snapshot at the beginning of the view transition.

# Actual results

The old snapshot can be captured from a stale transform value, so the spinner appears to jump slightly backward relative to its visible position at the moment the transition starts.

# Expected results

The old snapshot should reflect the visually current animated transform at the exact time `document.startViewTransition()` begins.

[Kyouhei Horizumi]

Created attachment 478714 [details]
Browser comparison video for the repro case. Safari shows an incorrect snapshot state during the view transition, while Chrome and Firefox behave as expected.

3-second comparison video showing the same test case in Safari, Chrome, and Firefox.
In Safari, the animated element is captured in an incorrect state at view transition start; Chrome and Firefox keep the expected current visual state.

[Kyouhei Horizumi]

I opened a pull request for this issue:
https://github.com/WebKit/WebKit/pull/60858

The patch updates `RenderLayer::renderableTransform()` so that during snapshotting, when a transform-related accelerated animation is running, the renderable transform is computed from `animatedStyle()` instead of `m_transform`.

[Radar WebKit Bug Importer]

<rdar://problem/173323193>

[EWS]

Committed 309982@main (f1419669ee40): <https://commits.webkit.org/309982@main>

Reviewed commits have been landed. Closing PR #60858 and removing active labels.