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

88 lines
2.2 KiB
HTML
Raw Permalink Normal View History

REGRESSION (r260360): easing curves are broken on JS-originated animations https://bugs.webkit.org/show_bug.cgi?id=213495 <rdar://problem/64649747> Reviewed by Darin Adler. Source/WebCore: Prior to Web Animations, there was no way for an animation to set an animation-wide timing function while also setting a per-keyframe timing function. As such GraphicsLayerCA would sometimes decide to set the timing function on keyframes or on the entire CAAnimation. However, we can no longer do this with Web Animations where an animation can set an animation-wide timing function and also keyframe-specific timing functions. In this patch we create CAKeyframeAnimation objects for any animation that has at least two keyframes if Web Animations are enabled, whereas the legacy code path requires at least three keyframes. We allow PlatformCAAnimation::setTimingFunction() to be called in the Web Animations code path only under GraphicsLayerCA::setupAnimation() while leaving the only call sites in place only for the legacy code path. Finally, we modify GraphicsLayerCA::timingFunctionForAnimationValue() to only ever return a keyframe- specific timing function or fall back to a default linear timing function in the Web Animations code path, leaving the function to behave the same way as it used to in the legacy code path. Test: webanimations/accelerated-animation-with-easing.html * platform/animation/TimingFunction.h: * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::isKeyframe): (WebCore::GraphicsLayerCA::createAnimationFromKeyframes): (WebCore::GraphicsLayerCA::appendToUncommittedAnimations): (WebCore::GraphicsLayerCA::createTransformAnimationsFromKeyframes): LayoutTests: Add a new test that checks that various ways of setting the easing timing function on a JS-originated animation always yield the same visible animation behavior. * webanimations/accelerated-animation-with-easing-expected.html: Added. * webanimations/accelerated-animation-with-easing.html: Added. Canonical link: https://commits.webkit.org/226392@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@263506 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-06-25 13:42:02 +00:00
<body>
<style>
body {
background-color: green;
}
div {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background-color: red;
}
/* Allow for a 1px error on either side */
#easing-on-keyframe {
[ iOS ] webanimations/accelerated-animation-with-easing.html is still flaky https://bugs.webkit.org/show_bug.cgi?id=214327 <rdar://problem/65569237> Reviewed by Dean Jackson. Source/WebKit: When we fixed bug 213495 in r263506, we started calling PlatformCAAnimation::setTimingFunction() to set the animation-wide timing function of CSS Animations and JS-originated animations alike. However, we neglected to update PlatformCAAnimationRemote, used on iOS, to be able to handle both animation-wide timing functions as well as keyframe-specific timing functions. This patch adds a new "timingFunction" member to PlatformCAAnimationRemote::Properties to allow for this and this new member is used in setTimingFunction() and copyTimingFunctionFrom(). Finally, after the animation is decoded in the UI process, we call -[CAKeyframeAnimation setTimingFunction:] inside addAnimationToLayer() to use this animation-wide timing function. This fixes the test added originally in r263506 which would only work flakily, a symptom of this missing implementation on iOS. * WebProcess/WebPage/RemoteLayerTree/PlatformCAAnimationRemote.h: * WebProcess/WebPage/RemoteLayerTree/PlatformCAAnimationRemote.mm: (WebKit::encodeTimingFunction): (WebKit::decodeTimingFunction): (WebKit::PlatformCAAnimationRemote::Properties::encode const): (WebKit::PlatformCAAnimationRemote::Properties::decode): (WebKit::PlatformCAAnimationRemote::setTimingFunction): (WebKit::PlatformCAAnimationRemote::copyTimingFunctionFrom): (WebKit::addAnimationToLayer): (WebKit::operator<<): LayoutTests: Remove the flaky expectation and remove the extra tolerance added in r263761 when it was thought that this test was merely flaky and not completely broken on iOS as it turned out to be. * platform/ios-wk2/TestExpectations: * webanimations/accelerated-animation-with-easing.html: Canonical link: https://commits.webkit.org/227798@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@265098 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-07-30 21:51:39 +00:00
left: -1px;
width: 102px;
REGRESSION (r260360): easing curves are broken on JS-originated animations https://bugs.webkit.org/show_bug.cgi?id=213495 <rdar://problem/64649747> Reviewed by Darin Adler. Source/WebCore: Prior to Web Animations, there was no way for an animation to set an animation-wide timing function while also setting a per-keyframe timing function. As such GraphicsLayerCA would sometimes decide to set the timing function on keyframes or on the entire CAAnimation. However, we can no longer do this with Web Animations where an animation can set an animation-wide timing function and also keyframe-specific timing functions. In this patch we create CAKeyframeAnimation objects for any animation that has at least two keyframes if Web Animations are enabled, whereas the legacy code path requires at least three keyframes. We allow PlatformCAAnimation::setTimingFunction() to be called in the Web Animations code path only under GraphicsLayerCA::setupAnimation() while leaving the only call sites in place only for the legacy code path. Finally, we modify GraphicsLayerCA::timingFunctionForAnimationValue() to only ever return a keyframe- specific timing function or fall back to a default linear timing function in the Web Animations code path, leaving the function to behave the same way as it used to in the legacy code path. Test: webanimations/accelerated-animation-with-easing.html * platform/animation/TimingFunction.h: * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::isKeyframe): (WebCore::GraphicsLayerCA::createAnimationFromKeyframes): (WebCore::GraphicsLayerCA::appendToUncommittedAnimations): (WebCore::GraphicsLayerCA::createTransformAnimationsFromKeyframes): LayoutTests: Add a new test that checks that various ways of setting the easing timing function on a JS-originated animation always yield the same visible animation behavior. * webanimations/accelerated-animation-with-easing-expected.html: Added. * webanimations/accelerated-animation-with-easing.html: Added. Canonical link: https://commits.webkit.org/226392@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@263506 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-06-25 13:42:02 +00:00
background-color: green;
}
</style>
<div id="easing-on-animation-one-keyframe"></div>
<div id="easing-on-animation-two-keyframes"></div>
<div id="easing-on-animation-three-keyframes"></div>
<div id="easing-on-keyframe"></div>
<script src="../resources/ui-helper.js"></script>
REGRESSION (r260360): easing curves are broken on JS-originated animations https://bugs.webkit.org/show_bug.cgi?id=213495 <rdar://problem/64649747> Reviewed by Darin Adler. Source/WebCore: Prior to Web Animations, there was no way for an animation to set an animation-wide timing function while also setting a per-keyframe timing function. As such GraphicsLayerCA would sometimes decide to set the timing function on keyframes or on the entire CAAnimation. However, we can no longer do this with Web Animations where an animation can set an animation-wide timing function and also keyframe-specific timing functions. In this patch we create CAKeyframeAnimation objects for any animation that has at least two keyframes if Web Animations are enabled, whereas the legacy code path requires at least three keyframes. We allow PlatformCAAnimation::setTimingFunction() to be called in the Web Animations code path only under GraphicsLayerCA::setupAnimation() while leaving the only call sites in place only for the legacy code path. Finally, we modify GraphicsLayerCA::timingFunctionForAnimationValue() to only ever return a keyframe- specific timing function or fall back to a default linear timing function in the Web Animations code path, leaving the function to behave the same way as it used to in the legacy code path. Test: webanimations/accelerated-animation-with-easing.html * platform/animation/TimingFunction.h: * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::isKeyframe): (WebCore::GraphicsLayerCA::createAnimationFromKeyframes): (WebCore::GraphicsLayerCA::appendToUncommittedAnimations): (WebCore::GraphicsLayerCA::createTransformAnimationsFromKeyframes): LayoutTests: Add a new test that checks that various ways of setting the easing timing function on a JS-originated animation always yield the same visible animation behavior. * webanimations/accelerated-animation-with-easing-expected.html: Added. * webanimations/accelerated-animation-with-easing.html: Added. Canonical link: https://commits.webkit.org/226392@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@263506 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-06-25 13:42:02 +00:00
<script>
(async function() {
if (window.testRunner)
testRunner.waitUntilDone();
await UIHelper.ensureStablePresentationUpdate();
await UIHelper.ensureStablePresentationUpdate();
REGRESSION (r260360): easing curves are broken on JS-originated animations https://bugs.webkit.org/show_bug.cgi?id=213495 <rdar://problem/64649747> Reviewed by Darin Adler. Source/WebCore: Prior to Web Animations, there was no way for an animation to set an animation-wide timing function while also setting a per-keyframe timing function. As such GraphicsLayerCA would sometimes decide to set the timing function on keyframes or on the entire CAAnimation. However, we can no longer do this with Web Animations where an animation can set an animation-wide timing function and also keyframe-specific timing functions. In this patch we create CAKeyframeAnimation objects for any animation that has at least two keyframes if Web Animations are enabled, whereas the legacy code path requires at least three keyframes. We allow PlatformCAAnimation::setTimingFunction() to be called in the Web Animations code path only under GraphicsLayerCA::setupAnimation() while leaving the only call sites in place only for the legacy code path. Finally, we modify GraphicsLayerCA::timingFunctionForAnimationValue() to only ever return a keyframe- specific timing function or fall back to a default linear timing function in the Web Animations code path, leaving the function to behave the same way as it used to in the legacy code path. Test: webanimations/accelerated-animation-with-easing.html * platform/animation/TimingFunction.h: * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::isKeyframe): (WebCore::GraphicsLayerCA::createAnimationFromKeyframes): (WebCore::GraphicsLayerCA::appendToUncommittedAnimations): (WebCore::GraphicsLayerCA::createTransformAnimationsFromKeyframes): LayoutTests: Add a new test that checks that various ways of setting the easing timing function on a JS-originated animation always yield the same visible animation behavior. * webanimations/accelerated-animation-with-easing-expected.html: Added. * webanimations/accelerated-animation-with-easing.html: Added. Canonical link: https://commits.webkit.org/226392@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@263506 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-06-25 13:42:02 +00:00
const animations = [];
animations.push(document.getElementById("easing-on-animation-one-keyframe").animate({ transform: "translateX(100px)" }, {
duration: 500,
easing: "ease",
direction: "alternate",
iterations: Infinity
}));
animations.push(document.getElementById("easing-on-animation-two-keyframes").animate([
{ transform: "translateX(0)" },
{ transform: "translateX(100px)" }
], {
duration: 500,
easing: "ease",
direction: "alternate",
iterations: Infinity
}));
animations.push(document.getElementById("easing-on-animation-three-keyframes").animate([
{ transform: "translateX(0)" },
{ transform: "translateX(50px)" },
{ transform: "translateX(100px)" }
], {
duration: 500,
easing: "ease",
direction: "alternate",
iterations: Infinity
}));
animations.push(document.getElementById("easing-on-keyframe").animate([
{ transform: "translateX(0)", easing: "ease" },
{ transform: "translateX(100px)" }
], {
duration: 500,
direction: "alternate",
iterations: Infinity
}));
await Promise.all(animations.map(animation => animation.ready));
await UIHelper.ensureStablePresentationUpdate();
await UIHelper.ensureStablePresentationUpdate();
REGRESSION (r260360): easing curves are broken on JS-originated animations https://bugs.webkit.org/show_bug.cgi?id=213495 <rdar://problem/64649747> Reviewed by Darin Adler. Source/WebCore: Prior to Web Animations, there was no way for an animation to set an animation-wide timing function while also setting a per-keyframe timing function. As such GraphicsLayerCA would sometimes decide to set the timing function on keyframes or on the entire CAAnimation. However, we can no longer do this with Web Animations where an animation can set an animation-wide timing function and also keyframe-specific timing functions. In this patch we create CAKeyframeAnimation objects for any animation that has at least two keyframes if Web Animations are enabled, whereas the legacy code path requires at least three keyframes. We allow PlatformCAAnimation::setTimingFunction() to be called in the Web Animations code path only under GraphicsLayerCA::setupAnimation() while leaving the only call sites in place only for the legacy code path. Finally, we modify GraphicsLayerCA::timingFunctionForAnimationValue() to only ever return a keyframe- specific timing function or fall back to a default linear timing function in the Web Animations code path, leaving the function to behave the same way as it used to in the legacy code path. Test: webanimations/accelerated-animation-with-easing.html * platform/animation/TimingFunction.h: * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::isKeyframe): (WebCore::GraphicsLayerCA::createAnimationFromKeyframes): (WebCore::GraphicsLayerCA::appendToUncommittedAnimations): (WebCore::GraphicsLayerCA::createTransformAnimationsFromKeyframes): LayoutTests: Add a new test that checks that various ways of setting the easing timing function on a JS-originated animation always yield the same visible animation behavior. * webanimations/accelerated-animation-with-easing-expected.html: Added. * webanimations/accelerated-animation-with-easing.html: Added. Canonical link: https://commits.webkit.org/226392@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@263506 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-06-25 13:42:02 +00:00
if (window.testRunner)
testRunner.notifyDone();
})();
</script>
</body>