[Webkit-unassigned] [Bug 208595] New: CSS Transitions don't play in sync

[bugzilla-daemon at webkit.org]

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

            Bug ID: 208595
           Summary: CSS Transitions don't play in sync
           Product: WebKit
           Version: Safari 13
          Hardware: Macintosh
                OS: macOS 10.15
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: naman34 at gmail.com

Created attachment 392466

  --> https://bugs.webkit.org/attachment.cgi?id=392466&action=review

Screen recording from Safari

TLDR;
=====

If you transition multiple elements at the same time, occasionally the transitions won't play at the same time and get staggered instead.

To Reproduce:
-------------
https://codepen.io/picks/pens/

There is a carousel on this link and if you try to click the arrow buttons a few times you will notice that the animation go out of sync.

It is also possible to notice the same bug if you make a grid of divs and apply a transition to all the divs where they all have a staggered delay.

Ask me to add a code example, and I will.

Attachments:
------------

I'm attaching a video from Safari.
Notice how Safari chooses to play the transitions out of sync.
This might have been an intentional decision to keep animations from dropping frames in Webkit, but keep the timing/duration is more important in practice.

-- 
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/20200304/431609ee/attachment-0001.htm>