[Webkit-unassigned] [Bug 213163] [Web Animations] Updating an Animation on an Element fails

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Sat Jun 13 13:18:19 PDT 2020


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

--- Comment #7 from Antoine Quint <graouts at webkit.org> ---
Travis, I haven't diagnosed the issue yet to determine what is going wrong, but you can certainly write your content in a much simpler way by using a single animation and calling reverse() on it. Here's an alternative version of your index.js file:


    // Create the animation.
    const animation = document.getElementById('square').animate({
        transform: ['rotate(0deg)','rotate(180deg)'],
        offset: [ 0, 1 ],
        easing: [ 'linear' ],
    }, {
        duration: 1000,
        composite: 'add',
        fill: 'forwards'
    });

    // Let the animation be paused originally.
    animation.pause();

    document.getElementById("button").addEventListener("click", event => {
        // If the animation has not played yet, play it.
        if (animation.playState == "paused")
            animation.play();
        // Otherwise, reverse the playback direction.
        else
            animation.reverse();
    });

As for your question about testing, it's always useful to indicate known behavior difference between Safari/WebKit and other browsers as well as previous versions of Safari in case there is a regression.

-- 
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/20200613/1ee9a911/attachment.htm>


More information about the webkit-unassigned mailing list