[Web Animations] Ensure that changing the timing model updates styles…

… synchronously

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

Reviewed by Dean Jackson.

LayoutTests/imported/w3c:

Update test expectations for progressions.

* web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output-expected.txt:
* web-platform-tests/css-timing-1/frames-timing-functions-output-expected.txt:
* web-platform-tests/css-timing-1/step-timing-functions-output-expected.txt:
* web-platform-tests/css/css-multicol/multicol-gap-animation-001-expected.txt:
* web-platform-tests/web-animations/animation-model/animation-types/discrete-expected.txt:
* web-platform-tests/web-animations/animation-model/animation-types/visibility-expected.txt:
* web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation-expected.txt:
* web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-transformed-distance-expected.txt:
* web-platform-tests/web-animations/interfaces/Animation/cancel-expected.txt:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite-expected.txt:

Source/WebCore:

We did not invalidate the timing model when properties of an effect's timing object changed
and even when we did invalidate the timing model, we did not update styles on effect targets
synchronously, only scheduling such updates for the next animation frame.

In this patch we expose the effect on the timing object such that changing timing properties
can notify the effect of a change in the timing model, which can then be forwarded to the
animation (which already informs its timeline, if any).

Additionally, when an animation's timing model has changed, we now invalidate the effect, which
will update styles synchronously.

This produces a number of progressions in WPT tests.

* animation/AnimationEffectReadOnly.cpp:
(WebCore::AnimationEffectReadOnly::AnimationEffectReadOnly): Set the timing object's effect upon
effect construction.
(WebCore::AnimationEffectReadOnly::~AnimationEffectReadOnly): Set the timing object's effect to
null upon effect destruction.
(WebCore::AnimationEffectReadOnly::timingDidChange): Notify the animation (if any) that its timing
model changed following a change in the timing properties.
* animation/AnimationEffectReadOnly.h: Add a new virtual invalidate() method that subclasses can
override to implement invalidation behavior when the animation finds out its timing model changed.
* animation/AnimationEffectTimingReadOnly.cpp: Notify the effect when a property changes such
that it may notify its animation of a timing model change.
(WebCore::AnimationEffectTimingReadOnly::propertyDidChange):
(WebCore::AnimationEffectTimingReadOnly::setIterationStart):
(WebCore::AnimationEffectTimingReadOnly::setIterations):
(WebCore::AnimationEffectTimingReadOnly::setBindingsDuration):
(WebCore::AnimationEffectTimingReadOnly::setEasing):
(WebCore::AnimationEffectTimingReadOnly::setDelay):
(WebCore::AnimationEffectTimingReadOnly::setEndDelay):
(WebCore::AnimationEffectTimingReadOnly::setFill):
(WebCore::AnimationEffectTimingReadOnly::setIterationDuration):
(WebCore::AnimationEffectTimingReadOnly::setDirection):
* animation/AnimationEffectTimingReadOnly.h:
(WebCore::AnimationEffectTimingReadOnly::setEffect):
(WebCore::AnimationEffectTimingReadOnly::setBindingsDelay):
(WebCore::AnimationEffectTimingReadOnly::setBindingsEndDelay):
(WebCore::AnimationEffectTimingReadOnly::setDelay): Deleted.
(WebCore::AnimationEffectTimingReadOnly::setEndDelay): Deleted.
(WebCore::AnimationEffectTimingReadOnly::setFill): Deleted.
(WebCore::AnimationEffectTimingReadOnly::setIterationDuration): Deleted.
(WebCore::AnimationEffectTimingReadOnly::setDirection): Deleted.
* animation/AnimationTimeline.cpp: Rename animationTimingModelDidChange() to timingModelDidChange()
to align it with the new WebAnimation::timingModelDidChange() method.
(WebCore::AnimationTimeline::addAnimation):
(WebCore::AnimationTimeline::removeAnimation):
(WebCore::AnimationTimeline::setCurrentTime):
* animation/AnimationTimeline.h:
(WebCore::AnimationTimeline::timingModelDidChange):
(WebCore::AnimationTimeline::animationTimingModelDidChange): Deleted.
* animation/DocumentTimeline.cpp:
(WebCore::DocumentTimeline::timingModelDidChange):
(WebCore::DocumentTimeline::updateAnimations):
(WebCore::DocumentTimeline::animationTimingModelDidChange): Deleted.
* animation/DocumentTimeline.h:
* animation/KeyframeEffectReadOnly.cpp:
(WebCore::KeyframeEffectReadOnly::invalidate): Override the invalidate() method to perform a synchronous
style update in order to ensure that timing properties are accounted for right as they change.
* animation/KeyframeEffectReadOnly.h:
* animation/WebAnimation.cpp:
(WebCore::WebAnimation::timingModelDidChange): Invalidate the effect and notify the timeline of a timing
model change when an animation is notified that its timing model has changed.
(WebCore::WebAnimation::setStartTime):
* animation/WebAnimation.h:

Canonical link: https://commits.webkit.org/198602@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@228537 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/imported/w3c/ChangeLog

@@ -1,3 +1,23 @@
+2018-02-15  Antoine Quint  <graouts@apple.com>
+
+        [Web Animations] Ensure that changing the timing model updates styles synchronously
+        https://bugs.webkit.org/show_bug.cgi?id=182836
+
+        Reviewed by Dean Jackson.
+
+        Update test expectations for progressions.
+
+        * web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output-expected.txt:
+        * web-platform-tests/css-timing-1/frames-timing-functions-output-expected.txt:
+        * web-platform-tests/css-timing-1/step-timing-functions-output-expected.txt:
+        * web-platform-tests/css/css-multicol/multicol-gap-animation-001-expected.txt:
+        * web-platform-tests/web-animations/animation-model/animation-types/discrete-expected.txt:
+        * web-platform-tests/web-animations/animation-model/animation-types/visibility-expected.txt:
+        * web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation-expected.txt:
+        * web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-transformed-distance-expected.txt:
+        * web-platform-tests/web-animations/interfaces/Animation/cancel-expected.txt:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite-expected.txt:
+
 2018-02-14  Ryan Haddad  <ryanhaddad@apple.com>
 
         Unreviewed, rolling out r228444.

LayoutTests/imported/w3c/web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output-expected.txt

@@ -1,6 +1,6 @@
 
-FAIL cubic-bezier easing with input progress greater than 1 assert_approx_equals: The left of the animation should be approximately 98.8706654939602 at 230ms expected 98.8706654939602 +/- 0.01 but got 0
-FAIL cubic-bezier easing with input progress greater than 1 and where the tangent on the upper boundary is infinity assert_approx_equals: The left of the animation should be approximately 106.31755608768113 at 230ms expected 106.31755608768113 +/- 0.01 but got 0
-FAIL cubic-bezier easing with input progress less than 0 assert_approx_equals: The left of the animation should be approximately -16.589193103032184 at 10ms expected -16.589193103032184 +/- 0.01 but got 0
-FAIL cubic-bezier easing with input progress less than 0 and where the tangent on the lower boundary is infinity assert_approx_equals: The left of the animation should be approximately -6.317556087681108 at 770ms expected -6.317556087681108 +/- 0.01 but got 0
+FAIL cubic-bezier easing with input progress greater than 1 assert_approx_equals: The left of the animation should be approximately 98.8706654939602 at 230ms expected 98.8706654939602 +/- 0.01 but got 98.890625
+FAIL cubic-bezier easing with input progress greater than 1 and where the tangent on the upper boundary is infinity assert_approx_equals: The left of the animation should be approximately 106.31755608768113 at 230ms expected 106.31755608768113 +/- 0.01 but got 106.359375
+FAIL cubic-bezier easing with input progress less than 0 assert_approx_equals: The left of the animation should be approximately -16.589193103032184 at 10ms expected -16.589193103032184 +/- 0.01 but got -17.5
+FAIL cubic-bezier easing with input progress less than 0 and where the tangent on the lower boundary is infinity assert_approx_equals: The left of the animation should be approximately 0 at 300ms expected 0 +/- 0.01 but got 512.0625
 

LayoutTests/imported/w3c/web-platform-tests/css-timing-1/frames-timing-functions-output-expected.txt

@@ -4,7 +4,7 @@ FAIL At a frame boundary, the output of a frames timing function is the next fra
 FAIL For an input progress of 1.0, the output of a frames timing function is the final frame assert_equals: expected "100px" but got "0px"
 FAIL The number of frames is correctly reflected in the frames timing function output assert_equals: expected "10px" but got "0px"
 FAIL The number of frames is correctly reflected in the frames timing function output on CSS Transitions assert_equals: expected "10px" but got "0px"
-FAIL frames easing with input progress greater than 1 assert_equals: expected "100px" but got "0px"
-FAIL frames easing with input progress greater than 1.5 assert_equals: expected "300px" but got "0px"
-FAIL frames easing with input progress less than 0 assert_equals: expected "-100px" but got "0px"
+PASS frames easing with input progress greater than 1 
+PASS frames easing with input progress greater than 1.5 
+PASS frames easing with input progress less than 0 
 

LayoutTests/imported/w3c/web-platform-tests/css-timing-1/step-timing-functions-output-expected.txt

@@ -1,8 +1,8 @@
 
-FAIL step-start easing with input progress greater than 1 assert_equals: expected "200px" but got "100px"
-FAIL step-end easing with input progress greater than 1 assert_equals: expected "100px" but got "0px"
-FAIL step-end easing with input progress greater than 2 assert_equals: expected "200px" but got "0px"
-FAIL step-start easing with input progress less than 0 assert_equals: expected "0px" but got "100px"
-FAIL step-start easing with input progress less than -1 assert_equals: expected "0px" but got "100px"
-FAIL step-end easing with input progress less than 0 assert_equals: expected "-100px" but got "0px"
+PASS step-start easing with input progress greater than 1 
+PASS step-end easing with input progress greater than 1 
+PASS step-end easing with input progress greater than 2 
+PASS step-start easing with input progress less than 0 
+PASS step-start easing with input progress less than -1 
+PASS step-end easing with input progress less than 0 
 

LayoutTests/imported/w3c/web-platform-tests/css/css-multicol/multicol-gap-animation-001-expected.txt

@@ -1,3 +1,3 @@
 
-FAIL column-gap property is animatable assert_equals: expected "100px" but got "0px"
+FAIL column-gap property is animatable assert_equals: expected "150px" but got "100px"
 

LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/discrete-expected.txt

@@ -1,7 +1,7 @@
 
-FAIL Test animating discrete values assert_equals: Animation produces 'to' value at exact middle of the interval expected "italic" but got "normal"
-FAIL Test discrete animation is used when interpolation fails assert_equals: Animation produces 'to' value at exact middle of the interval expected "200px" but got "0px"
-FAIL Test discrete animation is used only for pairs of values that cannot be interpolated assert_equals: First non-interpolable pair uses discrete interpolation expected "200px" but got "0px"
-FAIL Test the 50% switch point for discrete animation is based on the effect easing assert_equals: Animation produces 'to' value at 96% of the iteration time expected "italic" but got "normal"
-FAIL Test the 50% switch point for discrete animation is based on the keyframe easing assert_equals: Animation produces 'to' value at 96% of the iteration time expected "italic" but got "normal"
+FAIL Test animating discrete values assert_equals: Animation produces 'from' value just before the middle of the interval expected "normal" but got "oblique 9.75deg"
+FAIL Test discrete animation is used when interpolation fails assert_equals: Animation produces 'from' value at start of interval expected "0px" but got "200px"
+FAIL Test discrete animation is used only for pairs of values that cannot be interpolated assert_equals: Animation produces 'from' value at start of interval expected "0px" but got "200px"
+FAIL Test the 50% switch point for discrete animation is based on the effect easing assert_equals: Animation produces 'from' value at 94% of the iteration time expected "normal" but got "oblique 8.5deg"
+FAIL Test the 50% switch point for discrete animation is based on the keyframe easing assert_equals: Animation produces 'from' value at 94% of the iteration time expected "normal" but got "oblique 8.5deg"
 

LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/visibility-expected.txt

@@ -1,4 +1,4 @@
 
-FAIL Visibility clamping behavior assert_equals: Visibility when progress > 0 due to linear easing expected "visible" but got "hidden"
-FAIL Visibility clamping behavior with an easing that has a negative component assert_equals: Visibility when progress > 0 due to cubic-bezier easing expected "visible" but got "hidden"
+PASS Visibility clamping behavior 
+PASS Visibility clamping behavior with an easing that has a negative component 
 

LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation-expected.txt

@@ -1,15 +1,15 @@
 
 FAIL iteration composition of discrete type animation (align-content) assert_equals: Animated align-content style at 50s of the first iteration expected "flex-end" but got "normal"
-FAIL iteration composition of <length> type animation assert_equals: Animated margin-left style at 0s of the third iteration expected "20px" but got "5px"
-FAIL iteration composition of <percentage> type animation assert_equals: Animated width style at 0s of the third iteration expected "100px" but got "25px"
-FAIL iteration composition of <color> type animation assert_equals: Animated color style at 0s of the third iteration expected "rgb(240, 240, 240)" but got "rgb(60, 60, 60)"
-FAIL iteration composition of <color> type animation that green component is decreasing assert_equals: Animated color style at 0s of the third iteration expected "rgb(120, 240, 120)" but got "rgb(30, 90, 30)"
+FAIL iteration composition of <length> type animation assert_equals: Animated margin-left style at 50s of the first iteration expected "5px" but got "0px"
+FAIL iteration composition of <percentage> type animation assert_equals: Animated width style at 50s of the first iteration expected "25px" but got "0px"
+FAIL iteration composition of <color> type animation assert_equals: Animated color style at 50s of the first iteration expected "rgb(60, 60, 60)" but got "rgb(0, 0, 0)"
+FAIL iteration composition of <color> type animation that green component is decreasing assert_equals: Animated color style at 50s of the first iteration expected "rgb(30, 90, 30)" but got "rgb(0, 120, 0)"
 FAIL iteration composition of <number> type animation assert_equals: Animated flex-grow style at 50s of the first iteration expected "5" but got "0"
 FAIL iteration composition of <shape> type animation assert_equals: Animated clip style at 50s of the first iteration expected "rect(5px, 5px, 5px, 5px)" but got "auto"
-FAIL iteration composition of <calc()> value animation assert_equals: Animated calc width style at 0s of the third iteration expected "20px" but got "5px"
-FAIL iteration composition of <calc()> value animation that the values can'tbe reduced assert_equals: Animated calc width style at 0s of the third iteration expected "40px" but got "10px"
+FAIL iteration composition of <calc()> value animation assert_equals: Animated calc width style at 50s of the first iteration expected "5px" but got "0px"
+FAIL iteration composition of <calc()> value animation that the values can'tbe reduced assert_equals: Animated calc width style at 50s of the first iteration expected "10px" but got "0px"
 FAIL iteration composition of opacity animation assert_equals: Animated opacity style at 50s of the first iteration expected "0.2" but got "0.20000000298023224"
-FAIL iteration composition of box-shadow animation assert_equals: Animated box-shadow style at 0s of the third iteration expected "rgb(240, 240, 240) 20px 20px 20px 0px" but got "rgb(60, 60, 60) 5px 5px 5px 0px"
+FAIL iteration composition of box-shadow animation assert_equals: Animated box-shadow style at 50s of the first iteration expected "rgb(60, 60, 60) 5px 5px 5px 0px" but got "rgb(0, 0, 0) 0px 0px 0px 0px"
 FAIL iteration composition of filter blur animation assert_equals: Animated filter blur style at 50s of the first iteration expected "blur(5px)" but got "blur(10px)"
 FAIL iteration composition of filter brightness for different unit animation assert_equals: Animated filter brightness style at 50s of the first iteration expected "brightness(1.4)" but got "brightness(1.8)"
 FAIL iteration composition of filter brightness animation assert_equals: Animated filter brightness style at 50s of the first iteration expected "brightness(0.5)" but got "brightness(1)"
@@ -28,7 +28,7 @@ FAIL iteration composition of transform list animation whose order is mismatched
 FAIL iteration composition of transform from none to translate assert_regexp_match: Actual value is not a matrix expected object "/^matrix(?:3d)*\((.+)\)/" but got "none"
 FAIL iteration composition of transform of matrix3d function assert_regexp_match: Actual value is not a matrix expected object "/^matrix(?:3d)*\((.+)\)/" but got "none"
 FAIL iteration composition of transform of rotate3d function assert_regexp_match: Actual value is not a matrix expected object "/^matrix(?:3d)*\((.+)\)/" but got "none"
-FAIL iteration composition starts with non-zero value animation assert_equals: Animated margin-left style at 0s of the third iteration expected "50px" but got "15px"
-FAIL iteration composition with negative final value animation assert_equals: Animated margin-left style at 0s of the third iteration expected "-10px" but got "0px"
-FAIL duration changes with an iteration composition operation of accumulate assert_equals: Animated style at 50s of the third iteration expected "25px" but got "5px"
+FAIL iteration composition starts with non-zero value animation assert_equals: Animated margin-left style at 50s of the first iteration expected "15px" but got "10px"
+FAIL iteration composition with negative final value animation assert_equals: Animated margin-left style at 50s of the first iteration expected "0px" but got "10px"
+FAIL duration changes with an iteration composition operation of accumulate assert_equals: Animated style at 50s of the third iteration expected "25px" but got "0px"
 

LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-transformed-distance-expected.txt

@@ -1,19 +1,19 @@
 
-FAIL A step-start function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A steps(1, start) function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A steps(2, start) function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A step-end function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A steps(1) function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A steps(1, end) function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A steps(2, end) function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A frames function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A linear function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A ease function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A ease-in function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A ease-in-out function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A ease-out function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A easing function which produces values greater than 1 on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
-FAIL A easing function which produces values less than 1 on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 99.9 at 999ms expected 99.9 +/- 0.01 but got 0
+PASS A step-start function on a keyframe affects the resulting style 
+PASS A steps(1, start) function on a keyframe affects the resulting style 
+PASS A steps(2, start) function on a keyframe affects the resulting style 
+PASS A step-end function on a keyframe affects the resulting style 
+PASS A steps(1) function on a keyframe affects the resulting style 
+PASS A steps(1, end) function on a keyframe affects the resulting style 
+PASS A steps(2, end) function on a keyframe affects the resulting style 
+PASS A frames function on a keyframe affects the resulting style 
+PASS A linear function on a keyframe affects the resulting style 
+FAIL A ease function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 109.47963055884654 at 1100ms expected 109.47963055884654 +/- 0.01 but got 109.46875
+PASS A ease-in function on a keyframe affects the resulting style 
+FAIL A ease-in-out function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 101.97224534417684 at 1100ms expected 101.97224534417684 +/- 0.01 but got 101.953125
+FAIL A ease-out function on a keyframe affects the resulting style assert_approx_equals: The width should be approximately 116.05721544376388 at 1100ms expected 116.05721544376388 +/- 0.01 but got 116.078125
+PASS A easing function which produces values greater than 1 on a keyframe affects the resulting style 
+PASS A easing function which produces values less than 1 on a keyframe affects the resulting style 
 PASS Linear-equivalent cubic-bezier keyframe easing applied to an effect with a step-start function does not alter the result 
 PASS Linear-equivalent cubic-bezier keyframe easing applied to an effect with a steps(1, start) function does not alter the result 
 PASS Linear-equivalent cubic-bezier keyframe easing applied to an effect with a steps(2, start) function does not alter the result 

LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/cancel-expected.txt

@@ -1,5 +1,5 @@
 
 FAIL Animated style is cleared after calling Animation.cancel() assert_not_equals: transform style is animated before cancelling got disallowed value "none"
 FAIL After cancelling an animation, it can still be seeked assert_equals: margin-left style is updated when cancelled animation is seeked expected "150px" but got "0px"
-FAIL After cancelling an animation, it can still be re-used assert_equals: margin-left style is animated after re-starting animation expected "100px" but got "0px"
+PASS After cancelling an animation, it can still be re-used 
 

LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite-expected.txt

@@ -1,3 +1,3 @@
 
-FAIL iterationComposite can be updated while an animation is in progress assert_equals: Animated style at 50s of the third iteration expected "25px" but got "5px"
+FAIL iterationComposite can be updated while an animation is in progress assert_equals: Animated style at 50s of the third iteration expected "25px" but got "0px"