[Webkit-unassigned] [Bug 279148] New: Animation jumps and snaps back when animating div in dialog

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=279148

            Bug ID: 279148
           Summary: Animation jumps and snaps back when animating div in
                    dialog
           Product: WebKit
           Version: Safari 15
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Animations
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: makinc at gmail.com
                CC: graouts at apple.com

We implemented a "drawer" using a dialog element that, when sliding in from the right edge of the screen, initially "jumps" left before continuing to slide in. It then jumps back to the right to correct for the initial jump.

Steps to Reproduce:
See the following codepen: https://codepen.io/m-akinc/pen/PorBvaY
Clicking the "Open" button will cause the div to slide in from the right. On Safari, it exhibits the buggy jump/snap-back I described above. It behaves properly in Chrome and Firefox.

Workaround:
If you check the "Start animation from 95% translation" checkbox, the keyframes used will start with a 95% translation (rather than 100%), so that the div is never fully off-screen. This somehow avoids the bug.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240904/e48e55a2/attachment.htm>