REGRESSION (r268483): Map jumps around while zooming on windy.com, strava.com
https://bugs.webkit.org/show_bug.cgi?id=217987
<rdar://problem/70418548>
Reviewed by Simon Fraser.
Source/WebCore:
When several animations targetting the same property and the same layer are overlapping, we used to
always override the previous animations. With r268483 we started maintaining all active animations
and let them run, potentially with additivity if the animation could be broken into several animations
each targeting a given transform operation.
On top of that, with r268615 and the support for accelerated animation of individual CSS transform
properties (translate, scale and rotate), all transform-related animations were made additive.
This meant that we would always run active animations targeting "transform" in a way where they would be
additive rather than being replaced.
Any animation targeting "transform" will yield one or several accelerated animations, and the first of this
animation set will always have a 0 index. So now, when we compile a list of transform animations in
GraphicsLayerCA::updateAnimations(), we reset that list any time we encounted an animation with a 0 index,
ensuring only the top-most transform animation is applied.
We also fix an issue where we didn't account for the possibility that a single KeyframeEffect could yield
several transform animations with the same name in pauseAnimation() and removeAnimation(). We now pause or
remove all animations with the provided name.
Test: webanimations/accelerated-overlapping-transform-animations.html
* platform/graphics/ca/GraphicsLayerCA.cpp:
(WebCore::GraphicsLayerCA::pauseAnimation):
(WebCore::GraphicsLayerCA::removeAnimation):
(WebCore::GraphicsLayerCA::updateAnimations):
LayoutTests:
Add a new test that checks that only the last of two overlapping "transform" animations is applied.
* platform/mac-wk1/TestExpectations:
* webanimations/accelerated-overlapping-transform-animations-expected.html: Added.
* webanimations/accelerated-overlapping-transform-animations.html: Added.
Canonical link: https://commits.webkit.org/230714@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@268771 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-10-20 22:58:48 +00:00
|
|
|
<style>
|
|
|
|
|
|
|
|
#target {
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100px;
|
|
|
|
height: 100px;
|
|
|
|
background-color: black;
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
<div id="target"></div>
|
|
|
|
<script src="../resources/ui-helper.js"></script>
|
|
|
|
<script>
|
|
|
|
|
2020-10-21 18:07:34 +00:00
|
|
|
const waitForAnimationCommit = async (animation) => {
|
|
|
|
await animation.ready;
|
|
|
|
if (!UIHelper.isWebKit2()) {
|
|
|
|
await UIHelper.renderingUpdate();
|
|
|
|
await UIHelper.renderingUpdate();
|
|
|
|
} else
|
|
|
|
await UIHelper.ensureStablePresentationUpdate()
|
|
|
|
}
|
|
|
|
|
REGRESSION (r268483): Map jumps around while zooming on windy.com, strava.com
https://bugs.webkit.org/show_bug.cgi?id=217987
<rdar://problem/70418548>
Reviewed by Simon Fraser.
Source/WebCore:
When several animations targetting the same property and the same layer are overlapping, we used to
always override the previous animations. With r268483 we started maintaining all active animations
and let them run, potentially with additivity if the animation could be broken into several animations
each targeting a given transform operation.
On top of that, with r268615 and the support for accelerated animation of individual CSS transform
properties (translate, scale and rotate), all transform-related animations were made additive.
This meant that we would always run active animations targeting "transform" in a way where they would be
additive rather than being replaced.
Any animation targeting "transform" will yield one or several accelerated animations, and the first of this
animation set will always have a 0 index. So now, when we compile a list of transform animations in
GraphicsLayerCA::updateAnimations(), we reset that list any time we encounted an animation with a 0 index,
ensuring only the top-most transform animation is applied.
We also fix an issue where we didn't account for the possibility that a single KeyframeEffect could yield
several transform animations with the same name in pauseAnimation() and removeAnimation(). We now pause or
remove all animations with the provided name.
Test: webanimations/accelerated-overlapping-transform-animations.html
* platform/graphics/ca/GraphicsLayerCA.cpp:
(WebCore::GraphicsLayerCA::pauseAnimation):
(WebCore::GraphicsLayerCA::removeAnimation):
(WebCore::GraphicsLayerCA::updateAnimations):
LayoutTests:
Add a new test that checks that only the last of two overlapping "transform" animations is applied.
* platform/mac-wk1/TestExpectations:
* webanimations/accelerated-overlapping-transform-animations-expected.html: Added.
* webanimations/accelerated-overlapping-transform-animations.html: Added.
Canonical link: https://commits.webkit.org/230714@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@268771 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-10-20 22:58:48 +00:00
|
|
|
(async () => {
|
|
|
|
if (window.testRunner)
|
|
|
|
testRunner.waitUntilDone();
|
|
|
|
|
|
|
|
const target = document.getElementById("target");
|
|
|
|
|
|
|
|
// Make the animations last a whole minute so they don't end while the test is running.
|
|
|
|
const duration = 60 * 1000;
|
|
|
|
|
2020-10-21 18:07:34 +00:00
|
|
|
// Start a first stationary "transform" animation and wait until it has been applied before starting
|
|
|
|
// a second stationary "transform" animation which should replace the first one.
|
|
|
|
await waitForAnimationCommit(target.animate({ transform: ["translateX(100px)", "translateX(100px)"] }, duration));
|
|
|
|
await waitForAnimationCommit(target.animate({ transform: ["translateX(200px)", "translateX(200px)"] }, duration));
|
REGRESSION (r268483): Map jumps around while zooming on windy.com, strava.com
https://bugs.webkit.org/show_bug.cgi?id=217987
<rdar://problem/70418548>
Reviewed by Simon Fraser.
Source/WebCore:
When several animations targetting the same property and the same layer are overlapping, we used to
always override the previous animations. With r268483 we started maintaining all active animations
and let them run, potentially with additivity if the animation could be broken into several animations
each targeting a given transform operation.
On top of that, with r268615 and the support for accelerated animation of individual CSS transform
properties (translate, scale and rotate), all transform-related animations were made additive.
This meant that we would always run active animations targeting "transform" in a way where they would be
additive rather than being replaced.
Any animation targeting "transform" will yield one or several accelerated animations, and the first of this
animation set will always have a 0 index. So now, when we compile a list of transform animations in
GraphicsLayerCA::updateAnimations(), we reset that list any time we encounted an animation with a 0 index,
ensuring only the top-most transform animation is applied.
We also fix an issue where we didn't account for the possibility that a single KeyframeEffect could yield
several transform animations with the same name in pauseAnimation() and removeAnimation(). We now pause or
remove all animations with the provided name.
Test: webanimations/accelerated-overlapping-transform-animations.html
* platform/graphics/ca/GraphicsLayerCA.cpp:
(WebCore::GraphicsLayerCA::pauseAnimation):
(WebCore::GraphicsLayerCA::removeAnimation):
(WebCore::GraphicsLayerCA::updateAnimations):
LayoutTests:
Add a new test that checks that only the last of two overlapping "transform" animations is applied.
* platform/mac-wk1/TestExpectations:
* webanimations/accelerated-overlapping-transform-animations-expected.html: Added.
* webanimations/accelerated-overlapping-transform-animations.html: Added.
Canonical link: https://commits.webkit.org/230714@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@268771 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-10-20 22:58:48 +00:00
|
|
|
|
|
|
|
if (window.testRunner)
|
|
|
|
testRunner.notifyDone();
|
|
|
|
})();
|
|
|
|
|
|
|
|
</script>
|