- Revision
- 273678
- Author
- alanc...@apple.com
- Date
- 2021-03-01 12:24:26 -0800 (Mon, 01 Mar 2021)
Log Message
Cherry-pick r273656. rdar://problem/74883325
REGRESSION(r272004): transform transition with delay doesn't behave correctly
https://bugs.webkit.org/show_bug.cgi?id=222545
<rdar://problem/74865413>
Reviewed by Dean Jackson.
Source/WebCore:
To support accelerated animations of individual transform properties, we introduced the notion of
non-interpolating animations to apply the underlying value for a given property before applying
the actual animations for this property with additivity set to true.
These non-interpolating animations were meant to last between the time at which animations were
committed and the effective start of the first animation for that property, accounting for any
delay.
However, we neglected to handle the case where that first animation had a fill mode that would
make it fill backwards, such as CSS Transitions. In that situation, the animation would have
its first keyframe applied on top of the underlying value, effectively applying the underlying
value twice with additivity.
We now only add these non-interpolating animations if the first animation has a delay and does
not fill backwards.
Test: webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html
* platform/graphics/ca/GraphicsLayerCA.cpp:
(WebCore::GraphicsLayerCA::updateAnimations):
LayoutTests:
Add a new test where an element with a non-identity transform starts a transform transition with a
long delay. Prior to this patch, this test failed because, while in the delay phase, the transition
would mean the underlying transform was applied twice: once by the non-interpolating animation
generated for the underlying "transform" value, and once by the first keyframe of the transition
since it fills backwards.
* webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html: Added.
* webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html: Added.
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273656 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Modified Paths
Added Paths
Diff
Modified: branches/safari-611.1.21.3-branch/LayoutTests/ChangeLog (273677 => 273678)
--- branches/safari-611.1.21.3-branch/LayoutTests/ChangeLog 2021-03-01 20:22:38 UTC (rev 273677)
+++ branches/safari-611.1.21.3-branch/LayoutTests/ChangeLog 2021-03-01 20:24:26 UTC (rev 273678)
@@ -1,3 +1,66 @@
+2021-03-01 Alan Coon <alanc...@apple.com>
+
+ Cherry-pick r273656. rdar://problem/74883325
+
+ REGRESSION(r272004): transform transition with delay doesn't behave correctly
+ https://bugs.webkit.org/show_bug.cgi?id=222545
+ <rdar://problem/74865413>
+
+ Reviewed by Dean Jackson.
+
+ Source/WebCore:
+
+ To support accelerated animations of individual transform properties, we introduced the notion of
+ non-interpolating animations to apply the underlying value for a given property before applying
+ the actual animations for this property with additivity set to true.
+
+ These non-interpolating animations were meant to last between the time at which animations were
+ committed and the effective start of the first animation for that property, accounting for any
+ delay.
+
+ However, we neglected to handle the case where that first animation had a fill mode that would
+ make it fill backwards, such as CSS Transitions. In that situation, the animation would have
+ its first keyframe applied on top of the underlying value, effectively applying the underlying
+ value twice with additivity.
+
+ We now only add these non-interpolating animations if the first animation has a delay and does
+ not fill backwards.
+
+ Test: webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html
+
+ * platform/graphics/ca/GraphicsLayerCA.cpp:
+ (WebCore::GraphicsLayerCA::updateAnimations):
+
+ LayoutTests:
+
+ Add a new test where an element with a non-identity transform starts a transform transition with a
+ long delay. Prior to this patch, this test failed because, while in the delay phase, the transition
+ would mean the underlying transform was applied twice: once by the non-interpolating animation
+ generated for the underlying "transform" value, and once by the first keyframe of the transition
+ since it fills backwards.
+
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html: Added.
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html: Added.
+
+ git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273656 268f45cc-cd09-0410-ab3c-d52691b4dbfc
+
+ 2021-03-01 Antoine Quint <grao...@webkit.org>
+
+ REGRESSION(r272004): transform transition with delay doesn't behave correctly
+ https://bugs.webkit.org/show_bug.cgi?id=222545
+ <rdar://problem/74865413>
+
+ Reviewed by Dean Jackson.
+
+ Add a new test where an element with a non-identity transform starts a transform transition with a
+ long delay. Prior to this patch, this test failed because, while in the delay phase, the transition
+ would mean the underlying transform was applied twice: once by the non-interpolating animation
+ generated for the underlying "transform" value, and once by the first keyframe of the transition
+ since it fills backwards.
+
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html: Added.
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html: Added.
+
2021-02-26 Alan Coon <alanc...@apple.com>
Cherry-pick r273512. rdar://problem/74799698
Added: branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html (0 => 273678)
--- branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html (rev 0)
+++ branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html 2021-03-01 20:24:26 UTC (rev 273678)
@@ -0,0 +1,16 @@
+<body>
+<style>
+
+div {
+ position: absolute;
+ left: 150px;
+ top: 150px;
+ height: 100px;
+ width: 100px;
+ background-color: black;
+ transform: scale(2);
+}
+
+</style>
+<div></div>
+</body>
Added: branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html (0 => 273678)
--- branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html (rev 0)
+++ branches/safari-611.1.21.3-branch/LayoutTests/webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html 2021-03-01 20:24:26 UTC (rev 273678)
@@ -0,0 +1,29 @@
+<body>
+<style>
+
+div {
+ position: absolute;
+ left: 150px;
+ top: 150px;
+ height: 100px;
+ width: 100px;
+ background-color: black;
+ transform: scale(2);
+ will-change: transform;
+}
+
+.scale-down {
+ transition-property: transform;
+ transition-duration: 1s;
+ transition-delay: calc(60 * 60s);
+ transform: scale(1);
+}
+
+</style>
+<div></div>
+<script>
+
+requestAnimationFrame(() => document.querySelector('div').className = "scale-down");
+
+</script>
+</body>
Modified: branches/safari-611.1.21.3-branch/Source/WebCore/ChangeLog (273677 => 273678)
--- branches/safari-611.1.21.3-branch/Source/WebCore/ChangeLog 2021-03-01 20:22:38 UTC (rev 273677)
+++ branches/safari-611.1.21.3-branch/Source/WebCore/ChangeLog 2021-03-01 20:24:26 UTC (rev 273678)
@@ -1,3 +1,78 @@
+2021-03-01 Alan Coon <alanc...@apple.com>
+
+ Cherry-pick r273656. rdar://problem/74883325
+
+ REGRESSION(r272004): transform transition with delay doesn't behave correctly
+ https://bugs.webkit.org/show_bug.cgi?id=222545
+ <rdar://problem/74865413>
+
+ Reviewed by Dean Jackson.
+
+ Source/WebCore:
+
+ To support accelerated animations of individual transform properties, we introduced the notion of
+ non-interpolating animations to apply the underlying value for a given property before applying
+ the actual animations for this property with additivity set to true.
+
+ These non-interpolating animations were meant to last between the time at which animations were
+ committed and the effective start of the first animation for that property, accounting for any
+ delay.
+
+ However, we neglected to handle the case where that first animation had a fill mode that would
+ make it fill backwards, such as CSS Transitions. In that situation, the animation would have
+ its first keyframe applied on top of the underlying value, effectively applying the underlying
+ value twice with additivity.
+
+ We now only add these non-interpolating animations if the first animation has a delay and does
+ not fill backwards.
+
+ Test: webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html
+
+ * platform/graphics/ca/GraphicsLayerCA.cpp:
+ (WebCore::GraphicsLayerCA::updateAnimations):
+
+ LayoutTests:
+
+ Add a new test where an element with a non-identity transform starts a transform transition with a
+ long delay. Prior to this patch, this test failed because, while in the delay phase, the transition
+ would mean the underlying transform was applied twice: once by the non-interpolating animation
+ generated for the underlying "transform" value, and once by the first keyframe of the transition
+ since it fills backwards.
+
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform-expected.html: Added.
+ * webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html: Added.
+
+ git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273656 268f45cc-cd09-0410-ab3c-d52691b4dbfc
+
+ 2021-03-01 Antoine Quint <grao...@webkit.org>
+
+ REGRESSION(r272004): transform transition with delay doesn't behave correctly
+ https://bugs.webkit.org/show_bug.cgi?id=222545
+ <rdar://problem/74865413>
+
+ Reviewed by Dean Jackson.
+
+ To support accelerated animations of individual transform properties, we introduced the notion of
+ non-interpolating animations to apply the underlying value for a given property before applying
+ the actual animations for this property with additivity set to true.
+
+ These non-interpolating animations were meant to last between the time at which animations were
+ committed and the effective start of the first animation for that property, accounting for any
+ delay.
+
+ However, we neglected to handle the case where that first animation had a fill mode that would
+ make it fill backwards, such as CSS Transitions. In that situation, the animation would have
+ its first keyframe applied on top of the underlying value, effectively applying the underlying
+ value twice with additivity.
+
+ We now only add these non-interpolating animations if the first animation has a delay and does
+ not fill backwards.
+
+ Test: webanimations/transform-transition-with-delay-on-forced-layer-with-transform.html
+
+ * platform/graphics/ca/GraphicsLayerCA.cpp:
+ (WebCore::GraphicsLayerCA::updateAnimations):
+
2021-02-26 Alan Coon <alanc...@apple.com>
Cherry-pick r273558. rdar://problem/74800042
Modified: branches/safari-611.1.21.3-branch/Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp (273677 => 273678)
--- branches/safari-611.1.21.3-branch/Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp 2021-03-01 20:22:38 UTC (rev 273677)
+++ branches/safari-611.1.21.3-branch/Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp 2021-03-01 20:24:26 UTC (rev 273678)
@@ -3040,22 +3040,29 @@
return;
}
- Seconds earliestBeginTime = 0_s;
+ LayerPropertyAnimation* earliestAnimation = nullptr;
for (auto* animation : animations) {
if (auto beginTime = animation->computedBeginTime()) {
- if (!earliestBeginTime || earliestBeginTime > *beginTime)
- earliestBeginTime = *beginTime;
+ if (!earliestAnimation || *earliestAnimation->computedBeginTime() > *beginTime)
+ earliestAnimation = animation;
}
}
- if (earliestBeginTime)
- earliestBeginTime += animationGroupBeginTime;
+ Vector<RefPtr<PlatformCAAnimation>> caAnimations;
- Vector<RefPtr<PlatformCAAnimation>> caAnimations;
- if (earliestBeginTime > currentTime) {
- if (auto* baseValueTransformAnimation = makeBaseValueTransformAnimation(property, TransformationMatrixSource::AskClient, earliestBeginTime)) {
- prepareAnimationForAddition(*baseValueTransformAnimation);
- caAnimations.append(baseValueTransformAnimation->m_animation);
+ // If we have an animation with an explicit begin time that does not fill backwards and starts with a delay,
+ // we must create a non-interpolating animation to set the current value for this transform-related property
+ // until that animation begins.
+ if (earliestAnimation) {
+ auto fillMode = earliestAnimation->m_animation->fillMode();
+ if (fillMode != PlatformCAAnimation::Backwards && fillMode != PlatformCAAnimation::Both) {
+ Seconds earliestBeginTime = *earliestAnimation->computedBeginTime() + animationGroupBeginTime;
+ if (earliestBeginTime > currentTime) {
+ if (auto* baseValueTransformAnimation = makeBaseValueTransformAnimation(property, TransformationMatrixSource::AskClient, earliestBeginTime)) {
+ prepareAnimationForAddition(*baseValueTransformAnimation);
+ caAnimations.append(baseValueTransformAnimation->m_animation);
+ }
+ }
}
}
@@ -3078,24 +3085,30 @@
return;
}
- Seconds earliestBeginTime = 0_s;
+ LayerPropertyAnimation* earliestAnimation = nullptr;
Vector<RefPtr<PlatformCAAnimation>> caAnimations;
for (auto* animation : WTF::makeReversedRange(animations)) {
if (auto beginTime = animation->computedBeginTime()) {
- if (!earliestBeginTime || earliestBeginTime > *beginTime)
- earliestBeginTime = *beginTime;
+ if (!earliestAnimation || *earliestAnimation->computedBeginTime() > *beginTime)
+ earliestAnimation = animation;
}
prepareAnimationForAddition(*animation);
caAnimations.append(animation->m_animation);
}
- if (earliestBeginTime)
- earliestBeginTime += animationGroupBeginTime;
-
- if (earliestBeginTime > currentTime) {
- if (auto* baseValueTransformAnimation = makeBaseValueTransformAnimation(property, TransformationMatrixSource::AskClient, earliestBeginTime)) {
- prepareAnimationForAddition(*baseValueTransformAnimation);
- caAnimations.append(baseValueTransformAnimation->m_animation);
+ // If we have an animation with an explicit begin time that does not fill backwards and starts with a delay,
+ // we must create a non-interpolating animation to set the current value for this transform-related property
+ // until that animation begins.
+ if (earliestAnimation) {
+ auto fillMode = earliestAnimation->m_animation->fillMode();
+ if (fillMode != PlatformCAAnimation::Backwards && fillMode != PlatformCAAnimation::Both) {
+ Seconds earliestBeginTime = *earliestAnimation->computedBeginTime() + animationGroupBeginTime;
+ if (earliestBeginTime > currentTime) {
+ if (auto* baseValueTransformAnimation = makeBaseValueTransformAnimation(property, TransformationMatrixSource::AskClient, earliestBeginTime)) {
+ prepareAnimationForAddition(*baseValueTransformAnimation);
+ caAnimations.append(baseValueTransformAnimation->m_animation);
+ }
+ }
}
}
