haikuwebkit/LayoutTests/webanimations/accelerated-animation-with-...

45 lines
735 B
HTML
Raw Permalink Normal View History

[Web Animations] Accelerated animations don't respect a positive delay value https://bugs.webkit.org/show_bug.cgi?id=186930 <rdar://problem/41393393> Reviewed by Dean Jackson. Source/WebCore: Test: webanimations/accelerated-animation-with-delay.html We would mistakenly clear the list of pending accelerated actions in KeyframeEffectReadOnly::applyPendingAcceleratedActions() even if we failed to proceed because of the target element's renderer not being composited yet. Now, we clear the list after we've established we can apply them, and if we can't we inform the animation with a call to acceleratedStateDidChange() which will in turn call into the document timeline so that we may consider these animations on the next tick. For this to work correctly we must make a change to DocumentTimeline::applyPendingAcceleratedAnimations() which only cleared its list of pending accelerated animations _after_ iterating through them, which would be problematic since we would now add animations to this list. That list is now copied and cleared prior to iterating through its members. We also fix the naming of the m_pendingAcceleratedActions copy in KeyframeEffectReadOnly::applyPendingAcceleratedActions() to have a more similar name. * animation/DocumentTimeline.cpp: (WebCore::DocumentTimeline::applyPendingAcceleratedAnimations): * animation/KeyframeEffectReadOnly.cpp: (WebCore::KeyframeEffectReadOnly::applyPendingAcceleratedActions): LayoutTests: Creating a new test that runs an accelerated animation on a non-positioned element with a small positive delay. Prior to this patch, the element would move slightly when the delay elapses but wouldn't animate towards the target value. With this patch, it animatea correctly. To check that it does animate, we add a cache over the element except for the first 25px which is the area within which it might have moved prior to this patch. This way the test only passes if the element is fully hidden by the cache. * webanimations/accelerated-animation-with-delay-expected.html: Added. * webanimations/accelerated-animation-with-delay.html: Added. Canonical link: https://commits.webkit.org/203221@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@234279 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2018-07-26 22:16:28 +00:00
<!DOCTYPE html>
<body>
<style>
body {
margin: 0;
}
div {
height: 100px;
}
#target {
left: 0;
width: 100px;
background-color: red;
}
#cache {
top: 0;
left: 25px;
width: 775px;
position: absolute;
background-color: black;
}
</style>
<div id="target"></div>
<div id="cache"></div>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
document.getElementById("target").animate({ transform: "translateX(700px)" }, { delay: 10, duration: 1000 })
requestAnimationFrame(() => {
setTimeout(() => {
if (window.testRunner)
testRunner.notifyDone();
}, 100);
});
</script>
</body>