[Web Animations] Update all tests to match the latest API changes
authorgraouts@webkit.org <graouts@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Nov 2018 11:16:48 +0000 (11:16 +0000)
committergraouts@webkit.org <graouts@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Nov 2018 11:16:48 +0000 (11:16 +0000)
https://bugs.webkit.org/show_bug.cgi?id=191302
<rdar://problem/41000438>

Reviewed by Dean Jackson.

LayoutTests/imported/mozilla:

* css-animations/test_animation-computed-timing.html:
* css-animations/test_effect-target.html:
* css-animations/test_keyframeeffect-getkeyframes-expected.txt:
* css-animations/test_keyframeeffect-getkeyframes.html:
* css-animations/test_pseudoElement-get-animations.html:
* css-transitions/test_effect-target.html:
* css-transitions/test_keyframeeffect-getkeyframes-expected.txt:
* css-transitions/test_keyframeeffect-getkeyframes.html:

LayoutTests/imported/w3c:

* web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output.html:
* web-platform-tests/web-animations/META.yml: Added.
* web-platform-tests/web-animations/README.md: Added.
* web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
* web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property.html:
* web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
* web-platform-tests/web-animations/animation-model/animation-types/addition-per-property.html:
* web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
* web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property.html:
* web-platform-tests/web-animations/animation-model/animation-types/property-list.js:
* web-platform-tests/web-animations/animation-model/animation-types/property-types.js:
* web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result-expected.txt: Added.
* web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result.html: Added.
* web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance-expected.txt: Added.
* web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance.html: Added.
* web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation.html:
* web-platform-tests/web-animations/interfaces/Animatable/animate-expected.txt:
* web-platform-tests/web-animations/interfaces/Animatable/animate.html:
* web-platform-tests/web-animations/interfaces/Animatable/getAnimations.html:
* web-platform-tests/web-animations/interfaces/Animation/cancel.html:
* web-platform-tests/web-animations/interfaces/Animation/constructor.html:
* web-platform-tests/web-animations/interfaces/Animation/effect.html:
* web-platform-tests/web-animations/interfaces/Animation/finish-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/Animation/finish.html: Removed.
* web-platform-tests/web-animations/interfaces/Animation/finished.html:
* web-platform-tests/web-animations/interfaces/Animation/idlharness-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/Animation/idlharness.html: Removed.
* web-platform-tests/web-animations/interfaces/Animation/idlharness.window.js: Added.
* web-platform-tests/web-animations/interfaces/Animation/onfinish.html:
* web-platform-tests/web-animations/interfaces/Animation/playbackRate-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/Animation/playbackRate.html: Removed.
* web-platform-tests/web-animations/interfaces/Animation/ready.html:
* web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming-expected.txt.
* web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming.html.
* web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming-expected.txt: Added.
* web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming.html: Added.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.html: Removed.
* web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.window.js: Added.
* web-platform-tests/web-animations/interfaces/Document/getAnimations-expected.txt:
* web-platform-tests/web-animations/interfaces/Document/getAnimations.html:
* web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.html: Removed.
* web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.window.js: Added.
* web-platform-tests/web-animations/interfaces/KeyframeEffect/composite.html:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor-expected.txt:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor.html:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor-expected.txt:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor.html:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness-expected.txt: Removed.
* web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.html: Removed.
* web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.window.js: Added.
* web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite.html:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001-expected.txt:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001.html:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes-expected.txt:
* web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes.html:
* web-platform-tests/web-animations/resources/keyframe-tests.js:
* web-platform-tests/web-animations/resources/timing-tests.js: Added.
* web-platform-tests/web-animations/resources/timing-utils.js: Added.
* web-platform-tests/web-animations/testcommon.js:
* web-platform-tests/web-animations/timing-model/animation-effects/phases-and-states.html:
* web-platform-tests/web-animations/timing-model/animations/canceling-an-animation-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/canceling-an-animation.html:
* web-platform-tests/web-animations/timing-model/animations/finishing-an-animation-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/finishing-an-animation.html:
* web-platform-tests/web-animations/timing-model/animations/pausing-an-animation-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/pausing-an-animation.html:
* web-platform-tests/web-animations/timing-model/animations/play-states-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/play-states.html:
* web-platform-tests/web-animations/timing-model/animations/playing-an-animation-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/playing-an-animation.html:
* web-platform-tests/web-animations/timing-model/animations/reversing-an-animation-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/reversing-an-animation.html:
* web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation-expected.txt: Added.
* web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation.html: Added.
* web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation-expected.txt: Added.
* web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation.html: Added.
* web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation-expected.txt: Added.
* web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation.html: Added.
* web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time-expected.txt.
* web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time.html.
* web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation-expected.txt.
* web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation.html.
* web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation-expected.txt.
* web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation.html.
* web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time-expected.txt.
* web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time.html.
* web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state-expected.txt:
* web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state.html:
* web-platform-tests/web-animations/timing-model/timelines/document-timelines.html:
* web-platform-tests/web-animations/timing-model/timelines/update-and-send-events-expected.txt: Added.
* web-platform-tests/web-animations/timing-model/timelines/update-and-send-events.html: Added.

LayoutTests:

* TestExpectations:
* platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
* platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
* platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
* platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
* platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
* platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
* platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
* platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
* platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
* webanimations/css-animations.html:
* webanimations/left-and-opacity-animation-yields-no-compositing.html:
* webanimations/opacity-animation-no-longer-composited-upon-completion.html:
* webanimations/width-and-opacity-separate-animation-yields-no-compositing.html:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@237857 268f45cc-cd09-0410-ab3c-d52691b4dbfc

136 files changed:
LayoutTests/ChangeLog
LayoutTests/TestExpectations
LayoutTests/imported/mozilla/ChangeLog
LayoutTests/imported/mozilla/css-animations/test_animation-computed-timing.html
LayoutTests/imported/mozilla/css-animations/test_effect-target.html
LayoutTests/imported/mozilla/css-animations/test_keyframeeffect-getkeyframes-expected.txt
LayoutTests/imported/mozilla/css-animations/test_keyframeeffect-getkeyframes.html
LayoutTests/imported/mozilla/css-animations/test_pseudoElement-get-animations.html
LayoutTests/imported/mozilla/css-transitions/test_effect-target.html
LayoutTests/imported/mozilla/css-transitions/test_keyframeeffect-getkeyframes-expected.txt
LayoutTests/imported/mozilla/css-transitions/test_keyframeeffect-getkeyframes.html
LayoutTests/imported/w3c/ChangeLog
LayoutTests/imported/w3c/web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/META.yml [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/README.md [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/property-list.js
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/property-types.js
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animatable/animate-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animatable/animate.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animatable/getAnimations.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/cancel.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/constructor.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/effect.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finished.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.window.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/onfinish.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/ready.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming-expected.txt [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming-expected.txt with 100% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming.html [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming.html with 89% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.window.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Document/getAnimations-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Document/getAnimations.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.window.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/composite.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness-expected.txt [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.html [deleted file]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.window.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/resources/keyframe-tests.js
LayoutTests/imported/w3c/web-platform-tests/web-animations/resources/timing-tests.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/resources/timing-utils.js [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/testcommon.js
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animation-effects/phases-and-states.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/canceling-an-animation-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/canceling-an-animation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/finishing-an-animation-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/finishing-an-animation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/pausing-an-animation-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/pausing-an-animation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/play-states-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/play-states.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/playing-an-animation-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/playing-an-animation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/reversing-an-animation-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/reversing-an-animation.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation-expected.txt [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time-expected.txt with 64% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation.html [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time.html with 68% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation-expected.txt [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation-expected.txt with 66% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation.html [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation.html with 51% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation-expected.txt [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation-expected.txt with 100% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation.html [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation.html with 90% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation-expected.txt [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time-expected.txt with 100% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation.html [moved from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time.html with 87% similarity]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state-expected.txt
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/timelines/document-timelines.html
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/timelines/update-and-send-events-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/timelines/update-and-send-events.html [new file with mode: 0644]
LayoutTests/platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt
LayoutTests/platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt
LayoutTests/platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt
LayoutTests/platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt
LayoutTests/platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt
LayoutTests/platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt
LayoutTests/platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt
LayoutTests/platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt
LayoutTests/platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt
LayoutTests/webanimations/css-animations.html
LayoutTests/webanimations/left-and-opacity-animation-yields-no-compositing.html
LayoutTests/webanimations/opacity-animation-no-longer-composited-upon-completion.html
LayoutTests/webanimations/width-and-opacity-separate-animation-yields-no-compositing.html

index bf28917..1d9c6e7 100644 (file)
@@ -1,3 +1,26 @@
+2018-11-06  Antoine Quint  <graouts@apple.com>
+
+        [Web Animations] Update all tests to match the latest API changes
+        https://bugs.webkit.org/show_bug.cgi?id=191302
+        <rdar://problem/41000438>
+
+        Reviewed by Dean Jackson.
+
+        * TestExpectations:
+        * platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
+        * platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
+        * platform/ios/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
+        * platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
+        * platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
+        * platform/mac-sierra/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
+        * platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
+        * platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
+        * platform/mac/imported/w3c/web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
+        * webanimations/css-animations.html:
+        * webanimations/left-and-opacity-animation-yields-no-compositing.html:
+        * webanimations/opacity-animation-no-longer-composited-upon-completion.html:
+        * webanimations/width-and-opacity-separate-animation-yields-no-compositing.html:
+
 2018-11-06  Zan Dobersek  <zdobersek@igalia.com>
 
         Unreviewed WPE gardening. Handle a bunch of test failures under the
index 1402ca8..7c7c61c 100644 (file)
@@ -2040,12 +2040,7 @@ webkit.org/b/177997 webgl/1.0.2/conformance/textures/copy-tex-image-2d-formats.h
 
 webkit.org/b/179069 imported/w3c/web-platform-tests/html/semantics/embedded-content/the-iframe-element/sandbox_032.htm [ Pass Failure ]
 
-webkit.org/b/181116 imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finished.html [ Pass Failure ]
-webkit.org/b/181120 imported/w3c/web-platform-tests/web-animations/interfaces/Animation/onfinish.html [ Pass Failure ]
 webkit.org/b/181121 imported/w3c/web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state.html [ Pass Failure ]
-webkit.org/b/181122 imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay.html [ Pass Failure ]
-webkit.org/b/181123 imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish.html [ Pass Failure ]
-webkit.org/b/181888 imported/w3c/web-platform-tests/web-animations/timing-model/animation-effects/current-iteration.html [ Pass Failure ]
 
 webkit.org/b/183836 imported/mozilla/css-animations/test_animations-dynamic-changes.html [ Pass Failure Timeout ]
 webkit.org/b/183844 imported/mozilla/css-animations/test_element-get-animations.html [ Pass Failure Timeout ]
index aa10fe4..f2edaed 100644 (file)
@@ -1,3 +1,20 @@
+2018-11-06  Antoine Quint  <graouts@apple.com>
+
+        [Web Animations] Update all tests to match the latest API changes
+        https://bugs.webkit.org/show_bug.cgi?id=191302
+        <rdar://problem/41000438>
+
+        Reviewed by Dean Jackson.
+
+        * css-animations/test_animation-computed-timing.html:
+        * css-animations/test_effect-target.html:
+        * css-animations/test_keyframeeffect-getkeyframes-expected.txt:
+        * css-animations/test_keyframeeffect-getkeyframes.html:
+        * css-animations/test_pseudoElement-get-animations.html:
+        * css-transitions/test_effect-target.html:
+        * css-transitions/test_keyframeeffect-getkeyframes-expected.txt:
+        * css-transitions/test_keyframeeffect-getkeyframes.html:
+
 2018-11-01  Antoine Quint  <graouts@apple.com>
 
         [Web Animations] Make document.getAnimations() return declarative animations in the correct order
index 45ae940..d2ad6f6 100644 (file)
@@ -274,7 +274,7 @@ promise_test(function(t) {
 
 test(function(t) {
   var div = addDiv(t);
-  var effect = new KeyframeEffectReadOnly(div, {left: ["0px", "100px"]});
+  var effect = new KeyframeEffect(div, {left: ["0px", "100px"]});
 
   assert_equals(effect.getComputedTiming().localTime, null,
                 'localTime for orphaned effect');
@@ -555,7 +555,7 @@ test(function(t) {
 
 test(function(t) {
   var div = addDiv(t);
-  var effect = new KeyframeEffectReadOnly(div, {left: ["0px", "100px"]});
+  var effect = new KeyframeEffect(div, {left: ["0px", "100px"]});
 
   assert_equals(effect.getComputedTiming().currentIteration, null,
                 'currentIteration for orphaned effect');
index 73dc1eb..7d2684e 100644 (file)
@@ -39,7 +39,7 @@ test(function(t) {
   addStyle(t, { '.after::after': 'animation: anim 10s;' });
   var div = addDiv(t, { class: 'after' });
   var pseudoTarget = document.getAnimations()[0].effect.target;
-  var effect = new KeyframeEffectReadOnly(pseudoTarget,
+  var effect = new KeyframeEffect(pseudoTarget,
                                           { background: ["blue", "red"] },
                                           3 * MS_PER_SEC);
   var newAnim = new Animation(effect, document.timeline);
@@ -52,7 +52,7 @@ test(function(t) {
   assert_equals(newAnim.effect.target, pseudoTarget,
                 'The effect.target of the scripted-generated animation is ' +
                 'the same as the one from the argument of ' +
-                'KeyframeEffectReadOnly constructor');
+                'KeyframeEffect constructor');
   assert_equals(anims[0].effect.target, newAnim.effect.target,
                 'Both animations return the same target object');
 }, 'effect.target from the script-generated animation should return the same ' +
index 91bf6f7..8cfc5c0 100644 (file)
@@ -1,26 +1,26 @@
 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns no frames for various kinds of empty enimations assert_equals: number of frames when @keyframes has empty keyframes expected 0 but got 2
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple animation 
-PASS KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing values, when the easing comes from animation-timing-function on the element 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing values, when the easing is specified on each keyframe assert_equals: value of 'easing' on ComputedKeyframe #1 expected "ease-in-out" but got "linear"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing values, when the easing is specified on some keyframes assert_equals: value of 'easing' on ComputedKeyframe #1 expected "steps(1, start)" but got "linear"
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple animation that specifies a single shorthand property 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with a 0% keyframe and no 100% keyframe assert_equals: properties on ComputedKeyframe #1 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with a 100% keyframe and no 0% keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with no 0% or 100% keyframe but with a 50% keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with a partially complete 100% keyframe (because the !important rule is ignored) assert_equals: properties on ComputedKeyframe #1 expected "composite,computedOffset,easing,marginBottom,marginTop,offset" but got "composite,computedOffset,easing,marginBottom,offset"
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with different properties on different keyframes, all with the same easing function 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with different properties on different keyframes, with a different easing function on each assert_equals: value for 'easing' on ComputedKeyframe #1 expected "steps(1)" but got "linear"
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time, and all with the same easing function 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time and with different easing functions assert_equals: number of frames expected 3 but got 2
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time and with different but equivalent easing functions assert_equals: value for 'easing' on ComputedKeyframe #2 expected "ease" but got "steps(1)"
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for overlapping keyframes 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with filter properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,filter,offset" but got "composite,computedOffset,easing,offset"
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected values for animation with drop-shadow of filter property 
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with text-shadow properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,offset,textShadow" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with background-size properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "backgroundSize,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with CSS variables as keyframe values assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,offset,transform" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with CSS variables as keyframe values in a shorthand property assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,marginBottom,marginLeft,marginRight,marginTop,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with a CSS variable which is overriden by the value in keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
-FAIL KeyframeEffectReadOnly.getKeyframes() returns expected values for animations with only custom property in a keyframe assert_equals: value for 'transform' on ComputedKeyframe #0 expected "translate(100px, 0px)" but got "none"
+FAIL KeyframeEffect.getKeyframes() returns no frames for various kinds of empty enimations assert_equals: number of frames when @keyframes has empty keyframes expected 0 but got 2
+PASS KeyframeEffect.getKeyframes() returns expected frames for a simple animation 
+PASS KeyframeEffect.getKeyframes() returns frames with expected easing values, when the easing comes from animation-timing-function on the element 
+FAIL KeyframeEffect.getKeyframes() returns frames with expected easing values, when the easing is specified on each keyframe assert_equals: value of 'easing' on ComputedKeyframe #1 expected "ease-in-out" but got "linear"
+FAIL KeyframeEffect.getKeyframes() returns frames with expected easing values, when the easing is specified on some keyframes assert_equals: value of 'easing' on ComputedKeyframe #1 expected "steps(1, start)" but got "linear"
+PASS KeyframeEffect.getKeyframes() returns expected frames for a simple animation that specifies a single shorthand property 
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with a 0% keyframe and no 100% keyframe assert_equals: properties on ComputedKeyframe #1 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with a 100% keyframe and no 0% keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with no 0% or 100% keyframe but with a 50% keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with a partially complete 100% keyframe (because the !important rule is ignored) assert_equals: properties on ComputedKeyframe #1 expected "composite,computedOffset,easing,marginBottom,marginTop,offset" but got "composite,computedOffset,easing,marginBottom,offset"
+PASS KeyframeEffect.getKeyframes() returns expected frames for an animation with different properties on different keyframes, all with the same easing function 
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with different properties on different keyframes, with a different easing function on each assert_equals: value for 'easing' on ComputedKeyframe #1 expected "steps(1)" but got "linear"
+PASS KeyframeEffect.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time, and all with the same easing function 
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time and with different easing functions assert_equals: number of frames expected 3 but got 2
+FAIL KeyframeEffect.getKeyframes() returns expected frames for an animation with multiple keyframes for the same time and with different but equivalent easing functions assert_equals: value for 'easing' on ComputedKeyframe #2 expected "ease" but got "steps(1)"
+PASS KeyframeEffect.getKeyframes() returns expected frames for overlapping keyframes 
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with filter properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,filter,offset" but got "composite,computedOffset,easing,offset"
+PASS KeyframeEffect.getKeyframes() returns expected values for animation with drop-shadow of filter property 
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with text-shadow properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,offset,textShadow" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with background-size properties and missing keyframes assert_equals: properties on ComputedKeyframe #0 expected "backgroundSize,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with CSS variables as keyframe values assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,offset,transform" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with CSS variables as keyframe values in a shorthand property assert_equals: properties on ComputedKeyframe #0 expected "composite,computedOffset,easing,marginBottom,marginLeft,marginRight,marginTop,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with a CSS variable which is overriden by the value in keyframe assert_equals: properties on ComputedKeyframe #0 expected "color,composite,computedOffset,easing,offset" but got "composite,computedOffset,easing,offset"
+FAIL KeyframeEffect.getKeyframes() returns expected values for animations with only custom property in a keyframe assert_equals: value for 'transform' on ComputedKeyframe #0 expected "translate(100px, 0px)" but got "none"
 
index f93f8ce..c9ef48a 100644 (file)
@@ -215,7 +215,7 @@ test(function(t) {
   assert_equals(getKeyframes(div).length, 0,
                 "number of frames when @keyframes only has frames with " +
                 "non-animatable properties");
-}, 'KeyframeEffectReadOnly.getKeyframes() returns no frames for various kinds'
+}, 'KeyframeEffect.getKeyframes() returns no frames for various kinds'
    + ' of empty enimations');
 
 test(function(t) {
@@ -228,15 +228,15 @@ test(function(t) {
 
   var expected = [
     { offset: 0, computedOffset: 0, easing: "ease",
-      color: "rgb(0, 0, 0)", composite: null },
+      color: "rgb(0, 0, 0)", composite: "auto" },
     { offset: 1, computedOffset: 1, easing: "ease",
-      color: "rgb(255, 255, 255)", composite: null },
+      color: "rgb(255, 255, 255)", composite: "auto" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple'
+}, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' animation');
 
 test(function(t) {
@@ -253,7 +253,7 @@ test(function(t) {
                     "value for 'easing' on ComputedKeyframe #" + i);
     }
   });
-}, 'KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing'
+}, 'KeyframeEffect.getKeyframes() returns frames with expected easing'
    + ' values, when the easing comes from animation-timing-function on the'
    + ' element');
 
@@ -270,7 +270,7 @@ test(function(t) {
                 "value of 'easing' on ComputedKeyframe #1");
   assert_equals(frames[2].easing, "steps(1)",
                 "value of 'easing' on ComputedKeyframe #2");
-}, 'KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing'
+}, 'KeyframeEffect.getKeyframes() returns frames with expected easing'
    + ' values, when the easing is specified on each keyframe');
 
 test(function(t) {
@@ -286,7 +286,7 @@ test(function(t) {
                 "value of 'easing' on ComputedKeyframe #1");
   assert_equals(frames[2].easing, "steps(1, start)",
                 "value of 'easing' on ComputedKeyframe #2");
-}, 'KeyframeEffectReadOnly.getKeyframes() returns frames with expected easing'
+}, 'KeyframeEffect.getKeyframes() returns frames with expected easing'
    + ' values, when the easing is specified on some keyframes');
 
 test(function(t) {
@@ -298,10 +298,10 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       marginBottom: "8px", marginLeft: "8px",
       marginRight: "8px", marginTop: "8px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       marginBottom: "16px", marginLeft: "16px",
       marginRight: "16px", marginTop: "16px" },
   ];
@@ -309,7 +309,7 @@ test(function(t) {
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple'
+}, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' animation that specifies a single shorthand property');
 
 test(function(t) {
@@ -322,16 +322,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 255)" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with a 0% keyframe and no 100% keyframe');
 
 test(function(t) {
@@ -344,16 +344,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 255)" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with a 100% keyframe and no 0% keyframe');
 
 test(function(t) {
@@ -366,18 +366,18 @@ test(function(t) {
   assert_equals(frames.length, 3, "number of frames");
 
   var expected = [
-    { offset: 0,   computedOffset: 0,   easing: "ease", composite: null,
+    { offset: 0,   computedOffset: 0,   easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)" },
-    { offset: 0.5, computedOffset: 0.5, easing: "ease", composite: null,
+    { offset: 0.5, computedOffset: 0.5, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 255)" },
-    { offset: 1,   computedOffset: 1,   easing: "ease", composite: null,
+    { offset: 1,   computedOffset: 1,   easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with no 0% or 100% keyframe but with a 50% keyframe');
 
 test(function(t) {
@@ -390,16 +390,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       marginTop: '50px', marginBottom: '100px' },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       marginTop: '250px', marginBottom: '200px' },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with a partially complete 100% keyframe (because the ' +
    '!important rule is ignored)');
 
@@ -412,20 +412,20 @@ test(function(t) {
   assert_equals(frames.length, 4, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 0)", marginTop: "8px" },
-    { offset: 0.25, computedOffset: 0.25, easing: "ease", composite: null,
+    { offset: 0.25, computedOffset: 0.25, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 255)" },
-    { offset: 0.75, computedOffset: 0.75, easing: "ease", composite: null,
+    { offset: 0.75, computedOffset: 0.75, easing: "ease", composite: "auto",
       marginTop: "12px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)", marginTop: "16px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with different properties on different keyframes, all ' +
    'with the same easing function');
 
@@ -438,20 +438,20 @@ test(function(t) {
   assert_equals(frames.length, 4, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "linear", composite: null,
+    { offset: 0, computedOffset: 0, easing: "linear", composite: "auto",
       color: "rgb(0, 0, 0)", marginTop: "8px" },
-    { offset: 0.25, computedOffset: 0.25, easing: "steps(1)", composite: null,
+    { offset: 0.25, computedOffset: 0.25, easing: "steps(1)", composite: "auto",
       color: "rgb(0, 0, 255)" },
-    { offset: 0.75, computedOffset: 0.75, easing: "ease-in", composite: null,
+    { offset: 0.75, computedOffset: 0.75, easing: "ease-in", composite: "auto",
       marginTop: "12px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)", marginTop: "16px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with different properties on different keyframes, with ' +
    'a different easing function on each');
 
@@ -464,16 +464,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 0)", marginTop: "8px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)", marginTop: "16px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with multiple keyframes for the same time, and all with ' +
    'the same easing function');
 
@@ -486,11 +486,11 @@ test(function(t) {
   assert_equals(frames.length, 3, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "steps(1)", composite: null,
+    { offset: 0, computedOffset: 0, easing: "steps(1)", composite: "auto",
       color: "rgb(0, 0, 0)", fontSize: "16px" },
-    { offset: 0, computedOffset: 0, easing: "linear", composite: null,
+    { offset: 0, computedOffset: 0, easing: "linear", composite: "auto",
       marginTop: "8px", paddingLeft: "2px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(255, 255, 255)", fontSize: "32px", marginTop: "16px",
       paddingLeft: "4px" },
   ];
@@ -498,7 +498,7 @@ test(function(t) {
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with multiple keyframes for the same time and with ' +
    'different easing functions');
 
@@ -511,18 +511,18 @@ test(function(t) {
   assert_equals(frames.length, 3, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "steps(1)", composite: null,
+    { offset: 0, computedOffset: 0, easing: "steps(1)", composite: "auto",
       marginTop: "0px", marginRight: "0px", marginBottom: "0px" },
-    { offset: 0.5, computedOffset: 0.5, easing: "steps(1)", composite: null,
+    { offset: 0.5, computedOffset: 0.5, easing: "steps(1)", composite: "auto",
       marginTop: "10px", marginRight: "10px", marginBottom: "10px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       marginTop: "20px", marginRight: "20px", marginBottom: "20px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for an ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with multiple keyframes for the same time and with ' +
    'different but equivalent easing functions');
 
@@ -535,24 +535,24 @@ test(function(t) {
   assert_equals(frames.length, 6, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       paddingTop: "30px" },
-    { offset: 0.5, computedOffset: 0.5, easing: "ease", composite: null,
+    { offset: 0.5, computedOffset: 0.5, easing: "ease", composite: "auto",
       paddingTop: "20px" },
-    { offset: 0.75, computedOffset: 0.75, easing: "ease", composite: null,
+    { offset: 0.75, computedOffset: 0.75, easing: "ease", composite: "auto",
       paddingTop: "20px" },
-    { offset: 0.85, computedOffset: 0.85, easing: "ease", composite: null,
+    { offset: 0.85, computedOffset: 0.85, easing: "ease", composite: "auto",
       paddingTop: "30px" },
-    { offset: 0.851, computedOffset: 0.851, easing: "ease", composite: null,
+    { offset: 0.851, computedOffset: 0.851, easing: "ease", composite: "auto",
       paddingTop: "60px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       paddingTop: "70px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected frames for ' +
    'overlapping keyframes');
 
 // Gecko-specific test case: We are specifically concerned here that the
@@ -567,16 +567,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       filter: "none" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       filter: "blur(5px) sepia(60%) saturate(30%)" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with filter properties and missing keyframes');
 
 test(function(t) {
@@ -588,16 +588,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       filter: "drop-shadow(rgb(0, 255, 0) 10px 10px 10px)" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       filter: "drop-shadow(rgb(255, 0, 0) 50px 30px 10px)" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animation with drop-shadow of filter property');
 
 // Gecko-specific test case: We are specifically concerned here that the
@@ -616,18 +616,18 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       textShadow: "rgb(0, 0, 0) 1px 1px 2px,"
                   + " rgb(0, 0, 255) 0px 0px 16px,"
                   + " rgb(0, 0, 255) 0px 0px 3.2px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       textShadow: "none" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with text-shadow properties and missing keyframes');
 
 // Gecko-specific test case: We are specifically concerned here that the
@@ -643,9 +643,9 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       backgroundSize: "auto auto" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       backgroundSize: "50% auto, 6px auto, contain" },
   ];
 
@@ -663,7 +663,7 @@ test(function(t) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i
                         + " after updating current style");
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with background-size properties and missing keyframes');
 
 test(function(t) {
@@ -675,15 +675,15 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       transform: "none" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       transform: "translate(100px, 0px)" },
   ];
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with CSS variables as keyframe values');
 
 test(function(t) {
@@ -695,12 +695,12 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       marginBottom: "0px",
       marginLeft: "0px",
       marginRight: "0px",
       marginTop: "0px" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       marginBottom: "100px",
       marginLeft: "100px",
       marginRight: "100px",
@@ -709,7 +709,7 @@ test(function(t) {
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with CSS variables as keyframe values in a shorthand property');
 
 test(function(t) {
@@ -721,15 +721,15 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       color: "rgb(0, 0, 0)" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       color: "rgb(0, 255, 0)" },
   ];
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with a CSS variable which is overriden by the value in keyframe');
 
 test(function(t) {
@@ -741,15 +741,15 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       transform: "translate(100px, 0px)" },
-    { offset: 1, computedOffset: 1, easing: "ease", composite: null,
+    { offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
       transform: "none" },
   ];
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected values for ' +
+}, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with only custom property in a keyframe');
 
 </script>
index dfa4b0d..1143845 100644 (file)
@@ -45,7 +45,7 @@ test(function(t) {
 
   // Create additional animation on the pseudo-element from script
   var pseudoTarget = document.getAnimations()[0].effect.target;
-  var effect = new KeyframeEffectReadOnly(pseudoTarget,
+  var effect = new KeyframeEffect(pseudoTarget,
                                           { background: ["blue", "red"] },
                                           3 * MS_PER_SEC);
   var newAnimation = new Animation(effect, document.timeline);
index ae55c1e..5570b5e 100644 (file)
@@ -43,7 +43,7 @@ test(function(t) {
   flushComputedStyle(div);
   div.classList.add('change');
   var pseudoTarget = document.getAnimations()[0].effect.target;
-  var effect = new KeyframeEffectReadOnly(pseudoTarget,
+  var effect = new KeyframeEffect(pseudoTarget,
                                           { background: ["blue", "red"] },
                                           3000);
   var newAnim = new Animation(effect, document.timeline);
@@ -57,7 +57,7 @@ test(function(t) {
   assert_equals(newAnim.effect.target, pseudoTarget,
                 'The effect.target of the scripted-generated animation is ' +
                 'the same as the one from the argument of ' +
-                'KeyframeEffectReadOnly constructor');
+                'KeyframeEffect constructor');
   assert_equals(anims[0].effect.target, newAnim.effect.target,
                 'Both the transition and the scripted-generated animation ' +
                 'return the same target object');
index 79aaf09..56c05ac 100644 (file)
@@ -1,5 +1,5 @@
 
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple transition 
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple transition with a non-default easing function 
-PASS KeyframeEffectReadOnly.getKeyframes() returns expected frames for a transition with a CSS variable endpoint 
+PASS KeyframeEffect.getKeyframes() returns expected frames for a simple transition 
+PASS KeyframeEffect.getKeyframes() returns expected frames for a simple transition with a non-default easing function 
+PASS KeyframeEffect.getKeyframes() returns expected frames for a transition with a CSS variable endpoint 
 
index 6e88a15..58d98da 100644 (file)
@@ -39,16 +39,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "ease", composite: null,
+    { offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
       left: "0px" },
-    { offset: 1, computedOffset: 1, easing: "linear", composite: null,
+    { offset: 1, computedOffset: 1, easing: "linear", composite: "auto",
       left: "100px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple'
+}, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' transition');
 
 test(function(t) {
@@ -64,16 +64,16 @@ test(function(t) {
   assert_equals(frames.length, 2, "number of frames");
 
   var expected = [
-    { offset: 0, computedOffset: 0, easing: "steps(2)", composite: null,
+    { offset: 0, computedOffset: 0, easing: "steps(2)", composite: "auto",
       left: "0px" },
-    { offset: 1, computedOffset: 1, easing: "linear", composite: null,
+    { offset: 1, computedOffset: 1, easing: "linear", composite: "auto",
       left: "100px" },
   ];
 
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for a simple'
+}, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' transition with a non-default easing function');
 
 test(function(t) {
@@ -88,15 +88,15 @@ test(function(t) {
   // CSS transition endpoints are based on the computed value so we
   // shouldn't see the variable reference
   var expected = [
-    { offset: 0, computedOffset: 0, easing: 'ease', composite: null,
+    { offset: 0, computedOffset: 0, easing: 'ease', composite: "auto",
       left: '0px' },
-    { offset: 1, computedOffset: 1, easing: 'linear', composite: null,
+    { offset: 1, computedOffset: 1, easing: 'linear', composite: "auto",
       left: '100px' },
   ];
   for (var i = 0; i < frames.length; i++) {
     assert_frames_equal(frames[i], expected[i], "ComputedKeyframe #" + i);
   }
-}, 'KeyframeEffectReadOnly.getKeyframes() returns expected frames for a'
+}, 'KeyframeEffect.getKeyframes() returns expected frames for a'
    + ' transition with a CSS variable endpoint');
 
 </script>
index 25ab097..2087f9a 100644 (file)
@@ -1,3 +1,123 @@
+2018-11-06  Antoine Quint  <graouts@apple.com>
+
+        [Web Animations] Update all tests to match the latest API changes
+        https://bugs.webkit.org/show_bug.cgi?id=191302
+        <rdar://problem/41000438>
+
+        Reviewed by Dean Jackson.
+
+        * web-platform-tests/css-timing-1/cubic-bezier-timing-functions-output.html:
+        * web-platform-tests/web-animations/META.yml: Added.
+        * web-platform-tests/web-animations/README.md: Added.
+        * web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property-expected.txt:
+        * web-platform-tests/web-animations/animation-model/animation-types/accumulation-per-property.html:
+        * web-platform-tests/web-animations/animation-model/animation-types/addition-per-property-expected.txt:
+        * web-platform-tests/web-animations/animation-model/animation-types/addition-per-property.html:
+        * web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property-expected.txt:
+        * web-platform-tests/web-animations/animation-model/animation-types/interpolation-per-property.html:
+        * web-platform-tests/web-animations/animation-model/animation-types/property-list.js:
+        * web-platform-tests/web-animations/animation-model/animation-types/property-types.js:
+        * web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result-expected.txt: Added.
+        * web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result.html: Added.
+        * web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance-expected.txt: Added.
+        * web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance.html: Added.
+        * web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-iteration-composite-operation.html:
+        * web-platform-tests/web-animations/interfaces/Animatable/animate-expected.txt:
+        * web-platform-tests/web-animations/interfaces/Animatable/animate.html:
+        * web-platform-tests/web-animations/interfaces/Animatable/getAnimations.html:
+        * web-platform-tests/web-animations/interfaces/Animation/cancel.html:
+        * web-platform-tests/web-animations/interfaces/Animation/constructor.html:
+        * web-platform-tests/web-animations/interfaces/Animation/effect.html:
+        * web-platform-tests/web-animations/interfaces/Animation/finish-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/finish.html: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/finished.html:
+        * web-platform-tests/web-animations/interfaces/Animation/idlharness-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/idlharness.html: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/idlharness.window.js: Added.
+        * web-platform-tests/web-animations/interfaces/Animation/onfinish.html:
+        * web-platform-tests/web-animations/interfaces/Animation/playbackRate-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/playbackRate.html: Removed.
+        * web-platform-tests/web-animations/interfaces/Animation/ready.html:
+        * web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming-expected.txt.
+        * web-platform-tests/web-animations/interfaces/AnimationEffect/getComputedTiming.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/getComputedTiming.html.
+        * web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming-expected.txt: Added.
+        * web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming.html: Added.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/endDelay.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/fill.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/idlharness.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterationStart.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationEffectTiming/iterations.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.html: Removed.
+        * web-platform-tests/web-animations/interfaces/AnimationPlaybackEvent/idlharness.window.js: Added.
+        * web-platform-tests/web-animations/interfaces/Document/getAnimations-expected.txt:
+        * web-platform-tests/web-animations/interfaces/Document/getAnimations.html:
+        * web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.html: Removed.
+        * web-platform-tests/web-animations/interfaces/DocumentTimeline/idlharness.window.js: Added.
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/composite.html:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor-expected.txt:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/constructor.html:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor-expected.txt:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/copy-constructor.html:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness-expected.txt: Removed.
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.html: Removed.
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/idlharness.window.js: Added.
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/iterationComposite.html:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001-expected.txt:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument-001.html:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes-expected.txt:
+        * web-platform-tests/web-animations/interfaces/KeyframeEffect/setKeyframes.html:
+        * web-platform-tests/web-animations/resources/keyframe-tests.js:
+        * web-platform-tests/web-animations/resources/timing-tests.js: Added.
+        * web-platform-tests/web-animations/resources/timing-utils.js: Added.
+        * web-platform-tests/web-animations/testcommon.js:
+        * web-platform-tests/web-animations/timing-model/animation-effects/phases-and-states.html:
+        * web-platform-tests/web-animations/timing-model/animations/canceling-an-animation-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/canceling-an-animation.html:
+        * web-platform-tests/web-animations/timing-model/animations/finishing-an-animation-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/finishing-an-animation.html:
+        * web-platform-tests/web-animations/timing-model/animations/pausing-an-animation-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/pausing-an-animation.html:
+        * web-platform-tests/web-animations/timing-model/animations/play-states-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/play-states.html:
+        * web-platform-tests/web-animations/timing-model/animations/playing-an-animation-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/playing-an-animation.html:
+        * web-platform-tests/web-animations/timing-model/animations/reversing-an-animation-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/reversing-an-animation.html:
+        * web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation-expected.txt: Added.
+        * web-platform-tests/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation.html: Added.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation-expected.txt: Added.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-current-time-of-an-animation.html: Added.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation-expected.txt: Added.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-playback-rate-of-an-animation.html: Added.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time-expected.txt.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-start-time-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-animation-start-time.html.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation-expected.txt.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-target-effect-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-target-effect-of-an-animation.html.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation-expected.txt.
+        * web-platform-tests/web-animations/timing-model/animations/setting-the-timeline-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/set-the-timeline-of-an-animation.html.
+        * web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time-expected.txt.
+        * web-platform-tests/web-animations/timing-model/animations/the-current-time-of-an-animation.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/web-animations/timing-model/animations/current-time.html.
+        * web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state-expected.txt:
+        * web-platform-tests/web-animations/timing-model/animations/updating-the-finished-state.html:
+        * web-platform-tests/web-animations/timing-model/timelines/document-timelines.html:
+        * web-platform-tests/web-animations/timing-model/timelines/update-and-send-events-expected.txt: Added.
+        * web-platform-tests/web-animations/timing-model/timelines/update-and-send-events.html: Added.
+
 2018-11-06  Rob Buis  <rbuis@igalia.com>
 
         Some minor X-Content-Type-Options parsing issues
index 3068e8c..34fdd0a 100644 (file)
@@ -15,7 +15,7 @@ href="https://drafts.csswg.org/css-timing/#cubic-bezier-timing-functions">
 
 function assert_style_left_at(animation, time, easingFunction) {
   animation.currentTime = time;
-  var portion = time / animation.effect.timing.duration;
+  var portion = time / animation.effect.getTiming().duration;
   assert_approx_equals(pxToNum(getComputedStyle(animation.effect.target).left),
                        easingFunction(portion) * 100,
                        0.01,
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/META.yml b/LayoutTests/imported/w3c/web-platform-tests/web-animations/META.yml
new file mode 100644 (file)
index 0000000..bf92f7a
--- /dev/null
@@ -0,0 +1,6 @@
+spec: https://drafts.csswg.org/web-animations/
+suggested_reviewers:
+  - birtles
+  - flackr
+  - graouts
+  - stephenmcgruer
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/README.md b/LayoutTests/imported/w3c/web-platform-tests/web-animations/README.md
new file mode 100644 (file)
index 0000000..f6efbf9
--- /dev/null
@@ -0,0 +1,116 @@
+Web Animations Test Suite
+=========================
+
+Specification: https://drafts.csswg.org/web-animations/
+
+
+Guidelines for writing tests
+----------------------------
+
+*   Try to follow the spec outline where possible.
+
+    For example, if you want to test setting the start time, you might be
+    tempted to put all the tests in:
+
+    > `/web-animations/interfaces/Animation/startTime.html`
+
+    However, in the spec most of the logic is in the &ldquo;Set the animation
+    start time&ldquo; procedure in the &ldquo;Timing model&rdquo; section.
+
+    Instead, try something like:
+
+    > *   `/web-animations/timing-model/animations/set-the-animation-start-time.html`<br>
+    >     Tests all the branches and inputs to the procedure as defined in the
+    >     spec (using the `Animation.startTime` API).
+    > *   `/web-animations/interfaces/Animation/startTime.html`<br>
+    >     Tests API-layer specific issues like mapping unresolved values to
+    >      null, etc.
+
+    On that note, two levels of subdirectories is enough even if the spec has
+    deeper nesting.
+
+    Note that most of the existing tests in the suite _don't_ do this well yet.
+    That's the direction we're heading, however.
+
+*   Test the spec.
+
+    *   If the spec defines a timing calculation that is directly
+        reflected in the iteration progress
+        (i.e. `anim.effect.getComputedTiming().progress`), test that instead
+        of calling `getComputedStyle(elem).marginLeft`.
+
+    *   Likewise, don't add needless tests for `anim.playbackState`.
+        The playback state is a calculated value based on other values.
+        It's rarely necessary to test directly unless you need, for example,
+        to check that a pending task is scheduled (which isn't observable
+        elsewhere other than waiting for the corresponding promise to
+        complete).
+
+*   Try to keep tests as simple and focused as possible.
+
+    e.g.
+
+      ```javascript
+      test(t => {
+        const animation = createDiv(t).animate(null);
+        assert_class_string(animation, 'Animation', 'Returned object is an Animation');
+      }, 'Element.animate() creates an Animation object');
+      ```
+
+      ```javascript
+      test(t => {
+        assert_throws({ name: 'TypeError' }, () => {
+          createDiv(t).animate(null, -1);
+        });
+      }, 'Setting a negative duration throws a TypeError');
+      ```
+
+      ```javascript
+      promise_test(t => {
+        const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
+        return animation.ready.then(() => {
+          assert_greater_than(animation.startTime, 0, 'startTime when running');
+        });
+      }, 'startTime is resolved when running');
+      ```
+
+    If you're generating complex test loops and factoring out utility functions
+    that affect the logic of the test (other than, say, simple assertion utility
+    functions), you're probably doing it wrong.
+
+    It should be possible to understand exactly what the test is doing at a
+    glance without having to scroll up and down the test file and refer to
+    other files.
+
+    See Justin Searls' presentation, [&ldquo;How to stop hating your
+    tests&rdquo;](http://blog.testdouble.com/posts/2015-11-16-how-to-stop-hating-your-tests.html)
+    for some tips on making your tests simpler.
+
+*   Assume tests will run on under-performing hardware where the time between
+    animation frames might run into 10s of seconds.
+    As a result, animations that are expected to still be running during
+    the test should be at least 100s in length.
+
+*   Avoid using `GLOBAL_CONSTS` that make the test harder to read.
+    It's fine to repeat the the same parameter values like `100 * MS_PER_SEC`
+    over and over again since it makes it easy to read and debug a test in
+    isolation.
+    Remember, even if we do need to make all tests take, say 200s each, text
+    editors are very good at search and replace.
+
+*   Use the `assert_times_equal` assertion for comparing times returned from
+    the API. This asserts that the time values are equal using a tolerance
+    based on the precision recommended in the spec. This tolerance is applied
+    to *both* of the values being compared. That is, it effectively allows
+    double the epsilon that is used when comparing with an absolute value.
+
+    For comparing a time value returned from the API to an absolute value, use
+    `assert_time_equals_literal`. This tests that the actual value is equal to
+    the expected value within the precision recommended in the spec.
+
+    Both `assert_times_equal` and `assert_time_equals_literal` are defined in a
+    way that implementations can override them to meet their own precision
+    requirements.
+
+*   There are quite a few bad tests in the repository. We're learning as
+    we go. Don't just copy them blindly&mdash;please fix them!
index 0a01d67..df93e79 100644 (file)
@@ -1,4 +1,5 @@
 
+PASS Setup 
 PASS background-color (type: color) has testAccumulation function 
 FAIL background-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL background-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -17,8 +18,8 @@ FAIL border-bottom-color supports animating as color of #RGBa assert_equals: The
 FAIL border-bottom-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-bottom-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-bottom-width (type: length) has testAccumulation function 
-FAIL border-bottom-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-bottom-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-bottom-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-bottom-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-image-outset (type: discrete) has testAccumulation function 
 PASS border-image-outset: "5 6 7 8" onto "1 2 3 4" 
 PASS border-image-outset: "1 2 3 4" onto "5 6 7 8" 
@@ -39,8 +40,8 @@ FAIL border-left-color supports animating as color of #RGBa assert_equals: The v
 FAIL border-left-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-left-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-left-width (type: length) has testAccumulation function 
-FAIL border-left-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-left-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-left-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-left-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-right-color (type: color) has testAccumulation function 
 FAIL border-right-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL border-right-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -49,11 +50,11 @@ FAIL border-right-color supports animating as color of #RGBa assert_equals: The
 FAIL border-right-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-right-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-right-width (type: length) has testAccumulation function 
-FAIL border-right-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-right-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-right-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-right-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-spacing (type: lengthPair) has testAccumulation function 
 FAIL border-spacing: length pair assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "10px 10px"
-FAIL border-spacing: length pair of rem assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "1px 1px"
+FAIL border-spacing: length pair of rem assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "10px 10px"
 PASS border-top-color (type: color) has testAccumulation function 
 FAIL border-top-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL border-top-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -62,8 +63,8 @@ FAIL border-top-color supports animating as color of #RGBa assert_equals: The va
 FAIL border-top-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-top-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-top-width (type: length) has testAccumulation function 
-FAIL border-top-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-top-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-top-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-top-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS box-shadow (type: boxShadowList) has testAccumulation function 
 FAIL box-shadow: shadow assert_equals: The value should be rgb(240, 240, 240) 20px 20px 20px 20px at 0ms expected "rgb(240, 240, 240) 20px 20px 20px 20px" but got "rgb(120, 120, 120) 10px 10px 10px 10px"
 PASS caret-color (type: color) has testAccumulation function 
@@ -94,7 +95,7 @@ PASS column-count: "10" onto "auto"
 FAIL column-count: "auto" onto "10" assert_equals: The value should be auto at 0ms expected "auto" but got "0"
 PASS column-gap (type: length) has testAccumulation function 
 FAIL column-gap: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL column-gap: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL column-gap: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-gap (type: discrete) has testAccumulation function 
 PASS column-gap: "200px" onto "normal" 
 PASS column-gap: "normal" onto "200px" 
@@ -106,11 +107,11 @@ FAIL column-rule-color supports animating as color of #RGBa assert_equals: The v
 FAIL column-rule-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL column-rule-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS column-rule-width (type: length) has testAccumulation function 
-FAIL column-rule-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL column-rule-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL column-rule-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL column-rule-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-width (type: length) has testAccumulation function 
 FAIL column-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL column-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL column-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-width (type: discrete) has testAccumulation function 
 PASS column-width: "1px" onto "auto" 
 FAIL column-width: "auto" onto "1px" assert_equals: The value should be auto at 0ms expected "auto" but got "0px"
@@ -130,21 +131,21 @@ FAIL flood-color supports animating as color of hsla() assert_equals: The value
 PASS flood-opacity (type: opacity) has testAccumulation function 
 FAIL flood-opacity: [0, 1] number assert_equals: The value should be 0.6 at 0ms expected "0.6" but got "0.30000001192092896"
 FAIL flood-opacity: [0, 1] number (clamped) assert_equals: The value should be 1 at 0ms expected "1" but got "0.30000001192092896"
-PASS font-stretch (type: fontStretch) has testAccumulation function 
-FAIL font-stretch uses font-stretch behavior for composite type accumulate assert_equals: The value should be normal at 0ms expected "normal" but got "expanded"
+PASS font-stretch (type: percentage) has testAccumulation function 
+FAIL font-stretch: percentage assert_equals: The value should be 130% at 0ms expected "130%" but got "70%"
 PASS font-style (type: discrete) has testAccumulation function 
 PASS font-style: "oblique" onto "italic" 
-FAIL font-style: "italic" onto "oblique" assert_equals: The value should be italic at 0ms expected "italic" but got "oblique"
+PASS font-style: "italic" onto "oblique" 
 PASS font-variation-settings (type: fontVariationSettings) has testAccumulation function 
-FAIL font-variation-settings with composite type accumulate assert_equals: The value should be "wght" 2.2 at 250ms expected "\"wght\" 2.2" but got "'wght' 1.2"
+FAIL font-variation-settings with composite type accumulate assert_equals: The value should be "wght" 2.2 at 250ms expected "\"wght\" 2.2" but got "\"wght\" 1.2"
 PASS font-variation-settings (type: discrete) has testAccumulation function 
-FAIL font-variation-settings: ""wdth" 5" onto ""wght" 1.1, "wdth" 1" assert_equals: The value should be "wdth" 5 at 0ms expected "\"wdth\" 5" but got "'wdth' 5"
-FAIL font-variation-settings: ""wght" 1.1, "wdth" 1" onto ""wdth" 5" assert_equals: The value should be "wght" 1.1, "wdth" 1 at 0ms expected "\"wght\" 1.1, \"wdth\" 1" but got "'wght' 1.1, 'wdth' 1"
+PASS font-variation-settings: ""wdth" 5" onto ""wght" 1.1, "wdth" 1" 
+PASS font-variation-settings: ""wght" 1.1, "wdth" 1" onto ""wdth" 5" 
 PASS font-variation-settings: "normal" onto ""wdth" 5" 
-FAIL font-variation-settings: ""wdth" 5" onto "normal" assert_equals: The value should be "wdth" 5 at 0ms expected "\"wdth\" 5" but got "'wdth' 5"
+PASS font-variation-settings: ""wdth" 5" onto "normal" 
 PASS letter-spacing (type: length) has testAccumulation function 
 FAIL letter-spacing: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL letter-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL letter-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS lighting-color (type: color) has testAccumulation function 
 FAIL lighting-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL lighting-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -166,11 +167,11 @@ PASS outline-offset (type: length) has testAccumulation function
 FAIL outline-offset: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
 FAIL outline-offset: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
 PASS outline-width (type: length) has testAccumulation function 
-FAIL outline-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL outline-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL outline-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL outline-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS perspective (type: length) has testAccumulation function 
 FAIL perspective: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL perspective: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL perspective: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS shape-outside (type: discrete) has testAccumulation function 
 PASS shape-outside: "url("http://localhost/test-2")" onto "url("http://localhost/test-1")" 
 PASS shape-outside: "url("http://localhost/test-1")" onto "url("http://localhost/test-2")" 
@@ -203,6 +204,8 @@ FAIL transform: scale assert_approx_equals: expected matrix(-2,0,0,-2,0,0) but g
 FAIL transform: skew assert_approx_equals: expected matrix(1,0.5773502691896256,-0.36397023426620234,1,0,0) but got matrix(1, 0.36397023426620234, -0.5773502691896256, 1, 0, 0): The value should be matrix(1,0.5773502691896256,-0.36397023426620234,1,0,0) at 0ms but got matrix(1, 0.36397023426620234, -0.5773502691896256, 1, 0, 0) expected 0.5773502691896256 +/- 0.0001 but got 0.36397023426620234
 FAIL transform: rotate on translate assert_approx_equals: expected matrix(0,1,-1,0,100,0) but got matrix(0.00000000000000006123233995736766, 1, -1, 0.00000000000000006123233995736766, 0, 0): The value should be matrix(0,1,-1,0,100,0) at 0ms but got matrix(0.00000000000000006123233995736766, 1, -1, 0.00000000000000006123233995736766, 0, 0) expected 100 +/- 0.0001 but got 0
 FAIL transform: translate on rotate assert_approx_equals: expected matrix(0,1,-1,0,100,0) but got matrix(1, 0, 0, 1, 100, 0): The value should be matrix(0,1,-1,0,100,0) at 0ms but got matrix(1, 0, 0, 1, 100, 0) expected 0 +/- 0.0001 but got 1
+FAIL transform: rotate and translate on rotate assert_approx_equals: expected matrix(6.123233995736766e-17,1,-1,6.123233995736766e-17,0,0) but got matrix(0.7071067811865476, 0.7071067811865475, -0.7071067811865475, 0.7071067811865476, 0, 0): The value should be matrix(6.123233995736766e-17,1,-1,6.123233995736766e-17,0,0) at 0ms but got matrix(0.7071067811865476, 0.7071067811865475, -0.7071067811865475, 0.7071067811865476, 0, 0) expected 6.123233995736766e-17 +/- 0.0001 but got 0.7071067811865476
+FAIL transform: rotate on roate and translate assert_approx_equals: expected matrix(6.123233995736766e-17,1,-1,6.123233995736766e-17,6.123233995736766e-15,100) but got matrix(0.7071067811865476, 0.7071067811865475, -0.7071067811865475, 0.7071067811865476, 0, 0): The value should be matrix(6.123233995736766e-17,1,-1,6.123233995736766e-17,6.123233995736766e-15,100) at 0ms but got matrix(0.7071067811865476, 0.7071067811865475, -0.7071067811865475, 0.7071067811865476, 0, 0) expected 6.123233995736766e-17 +/- 0.0001 but got 0.7071067811865476
 FAIL transform: matrix assert_approx_equals: expected matrix(0,1,-1,0,100,0) but got matrix(1, -0.00000000000000024492935982947064, 0.00000000000000024492935982947064, 1, 100, 0): The value should be matrix(0,1,-1,0,100,0) at 0ms but got matrix(1, -0.00000000000000024492935982947064, 0.00000000000000024492935982947064, 1, 100, 0) expected 0 +/- 0.0001 but got 1
 FAIL transform: rotate3d assert_approx_equals: expected matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) but got matrix3d(0.4999999999999999, 0.49999999999999994, 0.7071067811865476, 0, 0.49999999999999994, 0.5000000000000001, -0.7071067811865475, 0, -0.7071067811865476, 0.7071067811865475, 0.00000000000000006123233995736766, 0, 0, 0, 0, 1): The value should be matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) at 0ms but got matrix3d(0.4999999999999999, 0.49999999999999994, 0.7071067811865476, 0, 0.49999999999999994, 0.5000000000000001, -0.7071067811865475, 0, -0.7071067811865476, 0.7071067811865475, 0.00000000000000006123233995736766, 0, 0, 0, 0, 1) expected 0.8535533905932737 +/- 0.0001 but got 0.4999999999999999
 FAIL transform: matrix3d assert_approx_equals: expected matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) but got matrix3d(0.5000000000000001, 0.49999999999999983, 0.7071067811865474, 0, 0.4999999999999997, 0.5000000000000002, -0.7071067811865476, 0, -0.7071067811865476, 0.7071067811865474, 0.000000000000000404259158300213, 0, 0, 0, 0, 1): The value should be matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) at 0ms but got matrix3d(0.5000000000000001, 0.49999999999999983, 0.7071067811865474, 0, 0.4999999999999997, 0.5000000000000002, -0.7071067811865476, 0, -0.7071067811865476, 0.7071067811865474, 0.000000000000000404259158300213, 0, 0, 0, 0, 1) expected 0.8535533905932737 +/- 0.0001 but got 0.5000000000000001
@@ -218,14 +221,14 @@ FAIL visibility: onto "visible" assert_equals: The value should be visible at 10
 PASS visibility: onto "hidden" 
 PASS word-spacing (type: lengthPercentageOrCalc) has testAccumulation function 
 FAIL word-spacing: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL word-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL word-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 FAIL word-spacing: percentage assert_equals: The value should be 130% at 0ms expected "130%" but got "1.75px"
 FAIL word-spacing: units "%" onto "px" assert_equals: The value should be calc(10px + 10%) at 0ms expected "calc(10px + 10%)" but got "0.25px"
 FAIL word-spacing: units "px" onto "%" assert_equals: The value should be calc(10px + 10%) at 0ms expected "calc(10px + 10%)" but got "10px"
-FAIL word-spacing: units "rem" onto "%" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "2px"
+FAIL word-spacing: units "rem" onto "%" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "20px"
 FAIL word-spacing: units "%" onto "rem" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "0.25px"
-FAIL word-spacing: units "rem" onto "em" assert_equals: The value should be 40px at 0ms expected "40px" but got "2px"
-FAIL word-spacing: units "em" onto "rem" assert_equals: The value should be 40px at 0ms expected "40px" but got "0px"
-FAIL word-spacing: units "calc" onto "px" assert_equals: The value should be calc(30px + 20%) at 0ms expected "calc(30px + 20%)" but got "0px"
+FAIL word-spacing: units "rem" onto "em" assert_equals: The value should be 40px at 0ms expected "40px" but got "20px"
+FAIL word-spacing: units "em" onto "rem" assert_equals: The value should be 40px at 0ms expected "40px" but got "20px"
+FAIL word-spacing: units "calc" onto "px" assert_equals: The value should be calc(30px + 20%) at 0ms expected "calc(30px + 20%)" but got "10px"
 FAIL word-spacing: calc assert_equals: The value should be calc(30px + 30%) at 0ms expected "calc(30px + 30%)" but got "0px"
 
index 870e489..420617d 100644 (file)
@@ -17,41 +17,43 @@ html {
 <script>
 'use strict';
 
-for (const property in gCSSProperties) {
-  if (!isSupported(property)) {
-    continue;
-  }
-
-  const setupFunction = gCSSProperties[property].setup;
-  for (const animationType of gCSSProperties[property].types) {
-    let typeObject;
-    let animationTypeString;
-    if (typeof animationType === 'string') {
-      typeObject = types[animationType];
-      animationTypeString = animationType;
-    } else if (typeof animationType === 'object' &&
-               animationType.type && typeof animationType.type === 'string') {
-      typeObject = types[animationType.type];
-      animationTypeString = animationType.type;
+test(function() {
+  for (const property in gCSSProperties) {
+    if (!isSupported(property)) {
+      continue;
     }
 
-    // First, test that the animation type object has 'testAccumulation'.
-    // We use test() function here so that we can continue the remainder tests
-    // even if this test fails.
-    test(t => {
-      assert_own_property(typeObject, 'testAccumulation', animationTypeString +
-                          ' should have testAccumulation property');
-      assert_equals(typeof typeObject.testAccumulation, 'function',
-                    'testAccumulation method should be a function');
-    }, `${property} (type: ${animationTypeString}) has testAccumulation`
-       + ' function');
+    const setupFunction = gCSSProperties[property].setup;
+    for (const animationType of gCSSProperties[property].types) {
+      let typeObject;
+      let animationTypeString;
+      if (typeof animationType === 'string') {
+        typeObject = types[animationType];
+        animationTypeString = animationType;
+      } else if (typeof animationType === 'object' &&
+                 animationType.type && typeof animationType.type === 'string') {
+        typeObject = types[animationType.type];
+        animationTypeString = animationType.type;
+      }
 
-    if (typeObject.testAccumulation &&
-        typeof typeObject.testAccumulation === 'function') {
-      typeObject.testAccumulation(property,
-                              setupFunction,
-                              animationType.options);
+      // First, test that the animation type object has 'testAccumulation'.
+      // We use test() function here so that we can continue the remainder tests
+      // even if this test fails.
+      test(t => {
+        assert_own_property(typeObject, 'testAccumulation', animationTypeString +
+                            ' should have testAccumulation property');
+        assert_equals(typeof typeObject.testAccumulation, 'function',
+                      'testAccumulation method should be a function');
+      }, `${property} (type: ${animationTypeString}) has testAccumulation`
+         + ' function');
+
+      if (typeObject.testAccumulation &&
+          typeof typeObject.testAccumulation === 'function') {
+        typeObject.testAccumulation(property,
+                                setupFunction,
+                                animationType.options);
+      }
     }
   }
-}
+}, 'Setup');
 </script>
index 6594f5c..f51b6b9 100644 (file)
@@ -1,4 +1,5 @@
 
+PASS Setup 
 PASS background-color (type: color) has testAddition function 
 FAIL background-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL background-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -17,8 +18,8 @@ FAIL border-bottom-color supports animating as color of #RGBa assert_equals: The
 FAIL border-bottom-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-bottom-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-bottom-width (type: length) has testAddition function 
-FAIL border-bottom-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-bottom-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-bottom-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-bottom-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-image-outset (type: discrete) has testAddition function 
 PASS border-image-outset: "5 6 7 8" onto "1 2 3 4" 
 PASS border-image-outset: "1 2 3 4" onto "5 6 7 8" 
@@ -39,8 +40,8 @@ FAIL border-left-color supports animating as color of #RGBa assert_equals: The v
 FAIL border-left-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-left-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-left-width (type: length) has testAddition function 
-FAIL border-left-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-left-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-left-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-left-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-right-color (type: color) has testAddition function 
 FAIL border-right-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL border-right-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -49,11 +50,11 @@ FAIL border-right-color supports animating as color of #RGBa assert_equals: The
 FAIL border-right-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-right-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-right-width (type: length) has testAddition function 
-FAIL border-right-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-right-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-right-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-right-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS border-spacing (type: lengthPair) has testAddition function 
 FAIL border-spacing: length pair assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "10px 10px"
-FAIL border-spacing: length pair of rem assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "1px 1px"
+FAIL border-spacing: length pair of rem assert_equals: The value should be 20px 20px at 0ms expected "20px 20px" but got "10px 10px"
 PASS border-top-color (type: color) has testAddition function 
 FAIL border-top-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL border-top-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -62,8 +63,8 @@ FAIL border-top-color supports animating as color of #RGBa assert_equals: The va
 FAIL border-top-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL border-top-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS border-top-width (type: length) has testAddition function 
-FAIL border-top-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL border-top-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL border-top-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL border-top-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS box-shadow (type: boxShadowList) has testAddition function 
 FAIL box-shadow: shadow assert_equals: The value should be rgb(0, 0, 0) 0px 0px 0px 0px, rgb(120, 120, 120) 10px 10px 10px 0px at 0ms expected "rgb(0, 0, 0) 0px 0px 0px 0px, rgb(120, 120, 120) 10px 10px 10px 0px" but got "rgb(120, 120, 120) 10px 10px 10px 0px"
 PASS caret-color (type: color) has testAddition function 
@@ -94,7 +95,7 @@ PASS column-count: "10" onto "auto"
 FAIL column-count: "auto" onto "10" assert_equals: The value should be auto at 0ms expected "auto" but got "0"
 PASS column-gap (type: length) has testAddition function 
 FAIL column-gap: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL column-gap: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL column-gap: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-gap (type: discrete) has testAddition function 
 PASS column-gap: "200px" onto "normal" 
 PASS column-gap: "normal" onto "200px" 
@@ -106,11 +107,11 @@ FAIL column-rule-color supports animating as color of #RGBa assert_equals: The v
 FAIL column-rule-color supports animating as color of rgba() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 FAIL column-rule-color supports animating as color of hsla() assert_equals: The value should be rgb(230, 128, 128) at 0ms expected "rgb(230, 128, 128)" but got "rgba(255, 0, 0, 0.4)"
 PASS column-rule-width (type: length) has testAddition function 
-FAIL column-rule-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL column-rule-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL column-rule-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL column-rule-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-width (type: length) has testAddition function 
 FAIL column-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL column-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL column-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS column-width (type: discrete) has testAddition function 
 PASS column-width: "1px" onto "auto" 
 FAIL column-width: "auto" onto "1px" assert_equals: The value should be auto at 0ms expected "auto" but got "0px"
@@ -130,21 +131,21 @@ FAIL flood-color supports animating as color of hsla() assert_equals: The value
 PASS flood-opacity (type: opacity) has testAddition function 
 FAIL flood-opacity: [0, 1] number assert_equals: The value should be 0.6 at 0ms expected "0.6" but got "0.30000001192092896"
 FAIL flood-opacity: [0, 1] number (clamped) assert_equals: The value should be 1 at 0ms expected "1" but got "0.30000001192092896"
-PASS font-stretch (type: fontStretch) has testAddition function 
-FAIL font-stretch uses font-stretch behavior for composite type add assert_equals: The value should be normal at 0ms expected "normal" but got "expanded"
+PASS font-stretch (type: percentage) has testAddition function 
+FAIL font-stretch: percentage assert_equals: The value should be 130% at 0ms expected "130%" but got "70%"
 PASS font-style (type: discrete) has testAddition function 
 PASS font-style: "oblique" onto "italic" 
-FAIL font-style: "italic" onto "oblique" assert_equals: The value should be italic at 0ms expected "italic" but got "oblique"
+PASS font-style: "italic" onto "oblique" 
 PASS font-variation-settings (type: fontVariationSettings) has testAddition function 
-FAIL font-variation-settings with composite type add assert_equals: The value should be "wght" 2.2 at 250ms expected "\"wght\" 2.2" but got "'wght' 1.2"
+FAIL font-variation-settings with composite type add assert_equals: The value should be "wght" 2.2 at 250ms expected "\"wght\" 2.2" but got "\"wght\" 1.2"
 PASS font-variation-settings (type: discrete) has testAddition function 
-FAIL font-variation-settings: ""wdth" 5" onto ""wght" 1.1, "wdth" 1" assert_equals: The value should be "wdth" 5 at 0ms expected "\"wdth\" 5" but got "'wdth' 5"
-FAIL font-variation-settings: ""wght" 1.1, "wdth" 1" onto ""wdth" 5" assert_equals: The value should be "wght" 1.1, "wdth" 1 at 0ms expected "\"wght\" 1.1, \"wdth\" 1" but got "'wght' 1.1, 'wdth' 1"
+PASS font-variation-settings: ""wdth" 5" onto ""wght" 1.1, "wdth" 1" 
+PASS font-variation-settings: ""wght" 1.1, "wdth" 1" onto ""wdth" 5" 
 PASS font-variation-settings: "normal" onto ""wdth" 5" 
-FAIL font-variation-settings: ""wdth" 5" onto "normal" assert_equals: The value should be "wdth" 5 at 0ms expected "\"wdth\" 5" but got "'wdth' 5"
+PASS font-variation-settings: ""wdth" 5" onto "normal" 
 PASS letter-spacing (type: length) has testAddition function 
 FAIL letter-spacing: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL letter-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL letter-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS lighting-color (type: color) has testAddition function 
 FAIL lighting-color supports animating as color of rgb() with overflowed  from and to values assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
 FAIL lighting-color supports animating as color of #RGB assert_equals: The value should be rgb(255, 128, 128) at 0ms expected "rgb(255, 128, 128)" but got "rgb(255, 0, 0)"
@@ -166,11 +167,11 @@ PASS outline-offset (type: length) has testAddition function
 FAIL outline-offset: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
 FAIL outline-offset: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
 PASS outline-width (type: length) has testAddition function 
-FAIL outline-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
-FAIL outline-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "0px"
+FAIL outline-width: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
+FAIL outline-width: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS perspective (type: length) has testAddition function 
 FAIL perspective: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL perspective: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL perspective: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 PASS shape-outside (type: discrete) has testAddition function 
 PASS shape-outside: "url("http://localhost/test-2")" onto "url("http://localhost/test-1")" 
 PASS shape-outside: "url("http://localhost/test-1")" onto "url("http://localhost/test-2")" 
@@ -203,6 +204,7 @@ FAIL transform: scale assert_approx_equals: expected matrix(-6,0,0,-6,0,0) but g
 FAIL transform: skew assert_approx_equals: expected matrix(1.064177772475912,0.5402972149746673,-0.40102328848116064,0.8981975702225738,0,0) but got matrix(1, 0.36397023426620234, -0.5773502691896256, 1, 0, 0): The value should be matrix(1.064177772475912,0.5402972149746673,-0.40102328848116064,0.8981975702225738,0,0) at 0ms but got matrix(1, 0.36397023426620234, -0.5773502691896256, 1, 0, 0) expected 1.064177772475912 +/- 0.0001 but got 1
 FAIL transform: rotate on translate assert_approx_equals: expected matrix(0,1,-1,0,100,0) but got matrix(0.00000000000000006123233995736766, 1, -1, 0.00000000000000006123233995736766, 0, 0): The value should be matrix(0,1,-1,0,100,0) at 0ms but got matrix(0.00000000000000006123233995736766, 1, -1, 0.00000000000000006123233995736766, 0, 0) expected 100 +/- 0.0001 but got 0
 FAIL transform: translate on rotate assert_approx_equals: expected matrix(0,1,-1,0,0,100) but got matrix(1, 0, 0, 1, 100, 0): The value should be matrix(0,1,-1,0,0,100) at 0ms but got matrix(1, 0, 0, 1, 100, 0) expected 0 +/- 0.0001 but got 1
+FAIL transform: rotate on rotate and translate assert_approx_equals: expected matrix(0.7071067811865476,-0.7071067811865475,0.7071067811865475,0.7071067811865476,70.71067811865476,70.71067811865474) but got matrix(0.00000000000000006123233995736766, -1, 1, 0.00000000000000006123233995736766, 0, 0): The value should be matrix(0.7071067811865476,-0.7071067811865475,0.7071067811865475,0.7071067811865476,70.71067811865476,70.71067811865474) at 0ms but got matrix(0.00000000000000006123233995736766, -1, 1, 0.00000000000000006123233995736766, 0, 0) expected 0.7071067811865476 +/- 0.0001 but got 6.123233995736766e-17
 FAIL transform: matrix assert_approx_equals: expected matrix(0,1,-1,0,0,100) but got matrix(1, -0.00000000000000024492935982947064, 0.00000000000000024492935982947064, 1, 100, 0): The value should be matrix(0,1,-1,0,0,100) at 0ms but got matrix(1, -0.00000000000000024492935982947064, 0.00000000000000024492935982947064, 1, 100, 0) expected 0 +/- 0.0001 but got 1
 FAIL transform: rotate3d assert_approx_equals: expected matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) but got matrix3d(0.4999999999999999, 0.49999999999999994, 0.7071067811865476, 0, 0.49999999999999994, 0.5000000000000001, -0.7071067811865475, 0, -0.7071067811865476, 0.7071067811865475, 0.00000000000000006123233995736766, 0, 0, 0, 0, 1): The value should be matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) at 0ms but got matrix3d(0.4999999999999999, 0.49999999999999994, 0.7071067811865476, 0, 0.49999999999999994, 0.5000000000000001, -0.7071067811865475, 0, -0.7071067811865476, 0.7071067811865475, 0.00000000000000006123233995736766, 0, 0, 0, 0, 1) expected 0.8535533905932737 +/- 0.0001 but got 0.4999999999999999
 FAIL transform: matrix3d assert_approx_equals: expected matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) but got matrix3d(0.5000000000000001, 0.49999999999999983, 0.7071067811865474, 0, 0.4999999999999997, 0.5000000000000002, -0.7071067811865476, 0, -0.7071067811865476, 0.7071067811865474, 0.000000000000000404259158300213, 0, 0, 0, 0, 1): The value should be matrix3d(0.8535533905932737,0.1464466094067262,0.5,0,0.1464466094067262,0.8535533905932737,-0.5,0,-0.5,0.5,0.7071067811865476,0,0,0,0,1) at 0ms but got matrix3d(0.5000000000000001, 0.49999999999999983, 0.7071067811865474, 0, 0.4999999999999997, 0.5000000000000002, -0.7071067811865476, 0, -0.7071067811865476, 0.7071067811865474, 0.000000000000000404259158300213, 0, 0, 0, 0, 1) expected 0.8535533905932737 +/- 0.0001 but got 0.5000000000000001
@@ -214,14 +216,14 @@ FAIL visibility: onto "visible" assert_equals: The value should be visible at 10
 PASS visibility: onto "hidden" 
 PASS word-spacing (type: lengthPercentageOrCalc) has testAddition function 
 FAIL word-spacing: length assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
-FAIL word-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "1px"
+FAIL word-spacing: length of rem assert_equals: The value should be 20px at 0ms expected "20px" but got "10px"
 FAIL word-spacing: percentage assert_equals: The value should be 130% at 0ms expected "130%" but got "1.75px"
 FAIL word-spacing: units "%" onto "px" assert_equals: The value should be calc(10px + 10%) at 0ms expected "calc(10px + 10%)" but got "0.25px"
 FAIL word-spacing: units "px" onto "%" assert_equals: The value should be calc(10px + 10%) at 0ms expected "calc(10px + 10%)" but got "10px"
-FAIL word-spacing: units "rem" onto "%" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "2px"
+FAIL word-spacing: units "rem" onto "%" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "20px"
 FAIL word-spacing: units "%" onto "rem" assert_equals: The value should be calc(20px + 10%) at 0ms expected "calc(20px + 10%)" but got "0.25px"
-FAIL word-spacing: units "rem" onto "em" assert_equals: The value should be 40px at 0ms expected "40px" but got "2px"
-FAIL word-spacing: units "em" onto "rem" assert_equals: The value should be 40px at 0ms expected "40px" but got "0px"
-FAIL word-spacing: units "calc" onto "px" assert_equals: The value should be calc(30px + 20%) at 0ms expected "calc(30px + 20%)" but got "0px"
+FAIL word-spacing: units "rem" onto "em" assert_equals: The value should be 40px at 0ms expected "40px" but got "20px"
+FAIL word-spacing: units "em" onto "rem" assert_equals: The value should be 40px at 0ms expected "40px" but got "20px"
+FAIL word-spacing: units "calc" onto "px" assert_equals: The value should be calc(30px + 20%) at 0ms expected "calc(30px + 20%)" but got "10px"
 FAIL word-spacing: calc assert_equals: The value should be calc(30px + 30%) at 0ms expected "calc(30px + 30%)" but got "0px"
 
index 6125631..f17eeda 100644 (file)
@@ -17,41 +17,43 @@ html {
 <script>
 'use strict';
 
-for (const property in gCSSProperties) {
-  if (!isSupported(property)) {
-    continue;
-  }
-
-  const setupFunction = gCSSProperties[property].setup;
-  for (const animationType of gCSSProperties[property].types) {
-    let typeObject;
-    let animationTypeString;
-    if (typeof animationType === 'string') {
-      typeObject = types[animationType];
-      animationTypeString = animationType;
-    } else if (typeof animationType === 'object' &&
-               animationType.type && typeof animationType.type === 'string') {
-      typeObject = types[animationType.type];
-      animationTypeString = animationType.type;
+test(function() {
+  for (const property in gCSSProperties) {
+    if (!isSupported(property)) {
+      continue;
     }
 
-    // First, test that the animation type object has 'testAddition'.
-    // We use test() function here so that we can continue the remainder tests
-    // even if this test fails.
-    test(t => {
-      assert_own_property(typeObject, 'testAddition', animationTypeString +
-                          ' should have testAddition property');
-      assert_equals(typeof typeObject.testAddition, 'function',
-                    'testAddition method should be a function');
-    }, `${property} (type: ${animationTypeString}) has testAddition`
-       + ' function');
+    const setupFunction = gCSSProperties[property].setup;
+    for (const animationType of gCSSProperties[property].types) {
+      let typeObject;
+      let animationTypeString;
+      if (typeof animationType === 'string') {
+        typeObject = types[animationType];
+        animationTypeString = animationType;
+      } else if (typeof animationType === 'object' &&
+                 animationType.type && typeof animationType.type === 'string') {
+        typeObject = types[animationType.type];
+        animationTypeString = animationType.type;
+      }
 
-    if (typeObject.testAddition &&
-        typeof typeObject.testAddition === 'function') {
-      typeObject.testAddition(property,
-                              setupFunction,
-                              animationType.options);
+      // First, test that the animation type object has 'testAddition'.
+      // We use test() function here so that we can continue the remainder tests
+      // even if this test fails.
+      test(t => {
+        assert_own_property(typeObject, 'testAddition', animationTypeString +
+                            ' should have testAddition property');
+        assert_equals(typeof typeObject.testAddition, 'function',
+                      'testAddition method should be a function');
+      }, `${property} (type: ${animationTypeString}) has testAddition`
+         + ' function');
+
+      if (typeObject.testAddition &&
+          typeof typeObject.testAddition === 'function') {
+        typeObject.testAddition(property,
+                                setupFunction,
+                                animationType.options);
+      }
     }
   }
-}
+}, "Setup");
 </script>
index 81318bd..b2863cc 100644 (file)
@@ -1,4 +1,5 @@
 
+PASS Setup 
 PASS background-color (type: color) has testInterpolation function 
 PASS background-color supports animating as color of rgb() 
 PASS background-color supports animating as color of #RGB 
@@ -18,8 +19,8 @@ PASS border-bottom-color supports animating as color of #RGBa
 PASS border-bottom-color supports animating as color of rgba() 
 PASS border-bottom-color supports animating as color of hsla() 
 PASS border-bottom-width (type: length) has testInterpolation function 
-FAIL border-bottom-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL border-bottom-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS border-bottom-width supports animating as a length 
+PASS border-bottom-width supports animating as a length of rem 
 PASS border-image-outset (type: discrete) has testInterpolation function 
 FAIL border-image-outset uses discrete animation when animating between "1 2 3 4" and "5 6 7 8" with linear easing assert_equals: The value should be 1 2 3 4 at 499ms expected "1 2 3 4" but got "2.996000051498413 3.996000051498413 4.995999813079834 5.995999813079834"
 FAIL border-image-outset uses discrete animation when animating between "1 2 3 4" and "5 6 7 8" with effect easing assert_equals: The value should be 1 2 3 4 at 940ms expected "1 2 3 4" but got "2.711512804031372 3.711512804031372 4.711513042449951 5.711513042449951"
@@ -44,8 +45,8 @@ PASS border-left-color supports animating as color of #RGBa
 PASS border-left-color supports animating as color of rgba() 
 PASS border-left-color supports animating as color of hsla() 
 PASS border-left-width (type: length) has testInterpolation function 
-FAIL border-left-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL border-left-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS border-left-width supports animating as a length 
+PASS border-left-width supports animating as a length of rem 
 PASS border-right-color (type: color) has testInterpolation function 
 PASS border-right-color supports animating as color of rgb() 
 PASS border-right-color supports animating as color of #RGB 
@@ -54,11 +55,11 @@ PASS border-right-color supports animating as color of #RGBa
 PASS border-right-color supports animating as color of rgba() 
 PASS border-right-color supports animating as color of hsla() 
 PASS border-right-width (type: length) has testInterpolation function 
-FAIL border-right-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL border-right-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS border-right-width supports animating as a length 
+PASS border-right-width supports animating as a length of rem 
 PASS border-spacing (type: lengthPair) has testInterpolation function 
 PASS border-spacing supports animating as a length pair 
-FAIL border-spacing supports animating as a length pair of rem assert_equals: The value should be 30px 30px at 500ms expected "30px 30px" but got "3px 3px"
+PASS border-spacing supports animating as a length pair of rem 
 PASS border-top-color (type: color) has testInterpolation function 
 PASS border-top-color supports animating as color of rgb() 
 PASS border-top-color supports animating as color of #RGB 
@@ -67,8 +68,8 @@ PASS border-top-color supports animating as color of #RGBa
 PASS border-top-color supports animating as color of rgba() 
 PASS border-top-color supports animating as color of hsla() 
 PASS border-top-width (type: length) has testInterpolation function 
-FAIL border-top-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL border-top-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS border-top-width supports animating as a length 
+PASS border-top-width supports animating as a length of rem 
 PASS box-shadow (type: boxShadowList) has testInterpolation function 
 FAIL box-shadow: from none to other assert_equals: The value should be rgba(100, 100, 100, 0.5) 5px 5px 5px 0px at 500ms expected "rgba(100, 100, 100, 0.5) 5px 5px 5px 0px" but got "rgba(100, 100, 100, 0.501961) 5px 5px 5px 0px"
 FAIL box-shadow: from other to none assert_equals: The value should be rgba(100, 100, 100, 0.5) 5px 5px 5px 0px at 500ms expected "rgba(100, 100, 100, 0.5) 5px 5px 5px 0px" but got "rgba(100, 100, 100, 0.501961) 5px 5px 5px 0px"
@@ -76,7 +77,7 @@ PASS box-shadow: single shadow
 PASS box-shadow: shadow list 
 FAIL box-shadow: mismatched list length (from shorter to longer) assert_equals: The value should be rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.5) 5px 5px 5px 0px at 500ms expected "rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.5) 5px 5px 5px 0px" but got "rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.501961) 5px 5px 5px 0px"
 FAIL box-shadow: mismatched list length (from longer to shorter) assert_equals: The value should be rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.5) 5px 5px 5px 0px at 500ms expected "rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.5) 5px 5px 5px 0px" but got "rgb(150, 150, 150) 15px 15px 15px 10px, rgba(100, 100, 100, 0.501961) 5px 5px 5px 0px"
-FAIL box-shadow: with currentcolor assert_equals: The value should be rgb(0, 255, 0) 5px 5px 5px 5px at 500ms expected "rgb(0, 255, 0) 5px 5px 5px 5px" but got "rgb(0, 0, 0) 5px 5px 5px 5px"
+PASS box-shadow: with currentcolor 
 PASS caret-color (type: color) has testInterpolation function 
 PASS caret-color supports animating as color of rgb() 
 PASS caret-color supports animating as color of #RGB 
@@ -108,7 +109,7 @@ FAIL column-count uses discrete animation when animating between "auto" and "10"
 FAIL column-count uses discrete animation when animating between "auto" and "10" with keyframe easing assert_equals: The value should be auto at 0ms expected "auto" but got "0"
 PASS column-gap (type: length) has testInterpolation function 
 PASS column-gap supports animating as a length 
-FAIL column-gap supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "3px"
+PASS column-gap supports animating as a length of rem 
 PASS column-gap (type: discrete) has testInterpolation function 
 FAIL column-gap uses discrete animation when animating between "normal" and "200px" with linear easing assert_equals: The value should be normal at 0ms expected "normal" but got "200px"
 FAIL column-gap uses discrete animation when animating between "normal" and "200px" with effect easing assert_equals: The value should be normal at 0ms expected "normal" but got "200px"
@@ -121,11 +122,11 @@ PASS column-rule-color supports animating as color of #RGBa
 PASS column-rule-color supports animating as color of rgba() 
 PASS column-rule-color supports animating as color of hsla() 
 PASS column-rule-width (type: length) has testInterpolation function 
-FAIL column-rule-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL column-rule-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS column-rule-width supports animating as a length 
+PASS column-rule-width supports animating as a length of rem 
 PASS column-width (type: length) has testInterpolation function 
 PASS column-width supports animating as a length 
-FAIL column-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "3px"
+PASS column-width supports animating as a length of rem 
 PASS column-width (type: discrete) has testInterpolation function 
 FAIL column-width uses discrete animation when animating between "auto" and "1px" with linear easing assert_equals: The value should be auto at 0ms expected "auto" but got "0px"
 FAIL column-width uses discrete animation when animating between "auto" and "1px" with effect easing assert_equals: The value should be auto at 0ms expected "auto" but got "0px"
@@ -140,7 +141,7 @@ PASS filter: drop-shadow function
 FAIL filter: percentage or numeric-specifiable functions (number value) assert_equals: The value should be brightness(0.3) contrast(0.3) grayscale(0.3) invert(0.3) opacity(0.3) saturate(0.3) sepia(0.3) at 500ms expected "brightness(0.3) contrast(0.3) grayscale(0.3) invert(0.3) opacity(0.3) saturate(0.3) sepia(0.3)" but got "brightness(0.30000000000000004) contrast(0.30000000000000004) grayscale(0.30000000000000004) invert(0.30000000000000004) opacity(0.30000000000000004) saturate(0.30000000000000004) sepia(0.30000000000000004)"
 FAIL filter: percentage or numeric-specifiable functions (percentage value) assert_equals: The value should be brightness(0.3) contrast(0.3) grayscale(0.3) invert(0.3) opacity(0.3) saturate(0.3) sepia(0.3) at 500ms expected "brightness(0.3) contrast(0.3) grayscale(0.3) invert(0.3) opacity(0.3) saturate(0.3) sepia(0.3)" but got "brightness(0.30000000000000004) contrast(0.30000000000000004) grayscale(0.30000000000000004) invert(0.30000000000000004) opacity(0.30000000000000004) saturate(0.30000000000000004) sepia(0.30000000000000004)"
 FAIL filter: interpolate different length of filter-function-list with function which lacuna value is 1 assert_equals: The value should be grayscale(0.5) brightness(0.5) contrast(0.5) opacity(0.5) saturate(0.5) at 500ms expected "grayscale(0.5) brightness(0.5) contrast(0.5) opacity(0.5) saturate(0.5)" but got "grayscale(1) brightness(0) contrast(0) opacity(0) saturate(0)"
-FAIL filter: interpolate different length of filter-function-list with function which lacuna value is 0 assert_equals: The value should be opacity(0.5) grayscale(0.5) invert(0.5) sepia(0.5) blur(5px) at 500ms expected "opacity(0.5) grayscale(0.5) invert(0.5) sepia(0.5) blur(5px)" but got "opacity(0.25) grayscale(0.75) invert(0.75) sepia(0.75) blur(7.5px)"
+PASS filter: interpolate different length of filter-function-list with function which lacuna value is 0 
 FAIL filter: interpolate different length of filter-function-list with drop-shadow function assert_equals: The value should be blur(5px) drop-shadow(rgba(85, 0, 170, 0.6) 5px 5px 5px at 500ms expected "blur(5px) drop-shadow(rgba(85, 0, 170, 0.6) 5px 5px 5px" but got "blur(10px) drop-shadow(rgba(0, 0, 255, 0.8) 10px 10px 10px)"
 PASS filter: interpolate from none 
 FAIL filter: url function (interpoalte as discrete) assert_equals: The value should be blur(0px) url("#f1") at 499ms expected "blur(0px) url(\"#f1\")" but got "blur(4.989999771118164px) url(\"#f1\")"
@@ -153,16 +154,15 @@ PASS flood-color supports animating as color of rgba()
 PASS flood-color supports animating as color of hsla() 
 PASS flood-opacity (type: opacity) has testInterpolation function 
 FAIL flood-opacity supports animating as a [0, 1] number assert_equals: The value should be 0.55 at 500ms expected "0.55" but got "0.550000011920929"
-PASS font-stretch (type: fontStretch) has testInterpolation function 
-FAIL font-stretch supports animating as a font-stretch (adjacent values) assert_equals: The value should be ultra-condensed at 499ms expected "ultra-condensed" but got "56%"
-PASS font-stretch supports animating as a font-stretch (between value) 
+PASS font-stretch (type: percentage) has testInterpolation function 
+PASS font-stretch supports animating as a percentage 
 PASS font-style (type: discrete) has testInterpolation function 
-FAIL font-style uses discrete animation when animating between "italic" and "oblique" with linear easing assert_equals: The value should be italic at 0ms expected "italic" but got "oblique"
-FAIL font-style uses discrete animation when animating between "italic" and "oblique" with effect easing assert_equals: The value should be italic at 0ms expected "italic" but got "oblique"
-FAIL font-style uses discrete animation when animating between "italic" and "oblique" with keyframe easing assert_equals: The value should be italic at 0ms expected "italic" but got "oblique"
+PASS font-style uses discrete animation when animating between "italic" and "oblique" with linear easing 
+PASS font-style uses discrete animation when animating between "italic" and "oblique" with effect easing 
+PASS font-style uses discrete animation when animating between "italic" and "oblique" with keyframe easing 
 PASS font-variation-settings (type: fontVariationSettings) has testInterpolation function 
-FAIL font-variation-settings supports animation as float assert_equals: The value should be "wght" 1.1 at 0ms expected "\"wght\" 1.1" but got "'wght' 1.1"
-FAIL font-variation-settings supports animation as float with multiple tags assert_array_equals: The computed values should be "wdth" 1,"wght" 1.1 at 0ms property 0, expected "\"wdth\" 1" but got "'wdth' 1"
+PASS font-variation-settings supports animation as float 
+PASS font-variation-settings supports animation as float with multiple tags 
 FAIL font-variation-settings supports animation as float with multiple duplicate tags assert_array_equals: The computed values should be "wdth" 2,"wght" 1.2 at 250ms lengths differ, expected 2 got 1
 PASS font-variation-settings (type: discrete) has testInterpolation function 
 FAIL font-variation-settings uses discrete animation when animating between ""wght" 1.1, "wdth" 1" and ""wdth" 5" with linear easing assert_equals: The value should be "wght" 1.1, "wdth" 1 at 0ms expected "\"wght\" 1.1, \"wdth\" 1" but got "normal"
@@ -173,7 +173,7 @@ FAIL font-variation-settings uses discrete animation when animating between ""wd
 FAIL font-variation-settings uses discrete animation when animating between ""wdth" 5" and "normal" with keyframe easing assert_equals: The value should be "wdth" 5 at 0ms expected "\"wdth\" 5" but got "normal"
 PASS letter-spacing (type: length) has testInterpolation function 
 PASS letter-spacing supports animating as a length 
-FAIL letter-spacing supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "3px"
+PASS letter-spacing supports animating as a length of rem 
 PASS lighting-color (type: color) has testInterpolation function 
 PASS lighting-color supports animating as color of rgb() 
 PASS lighting-color supports animating as color of #RGB 
@@ -196,11 +196,11 @@ PASS outline-offset (type: length) has testInterpolation function
 FAIL outline-offset supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
 FAIL outline-offset supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
 PASS outline-width (type: length) has testInterpolation function 
-FAIL outline-width supports animating as a length assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
-FAIL outline-width supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "0px"
+PASS outline-width supports animating as a length 
+PASS outline-width supports animating as a length of rem 
 PASS perspective (type: length) has testInterpolation function 
 PASS perspective supports animating as a length 
-FAIL perspective supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "3px"
+PASS perspective supports animating as a length of rem 
 PASS shape-outside (type: discrete) has testInterpolation function 
 FAIL shape-outside uses discrete animation when animating between "url("http://localhost/test-1")" and "url("http://localhost/test-2")" with linear easing assert_equals: The value should be url("http://localhost/test-1") at 0ms expected "url(\"http://localhost/test-1\")" but got "url(\"http://localhost/test-2\")"
 FAIL shape-outside uses discrete animation when animating between "url("http://localhost/test-1")" and "url("http://localhost/test-2")" with effect easing assert_equals: The value should be url("http://localhost/test-1") at 0ms expected "url(\"http://localhost/test-1\")" but got "url(\"http://localhost/test-2\")"
@@ -234,7 +234,7 @@ PASS text-shadow: single shadow
 PASS text-shadow: shadow list 
 FAIL text-shadow: mismatched list length (from longer to shorter) assert_equals: The value should be rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.5) 5px 5px 5px at 500ms expected "rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.5) 5px 5px 5px" but got "rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.501961) 5px 5px 5px"
 FAIL text-shadow: mismatched list length (from shorter to longer) assert_equals: The value should be rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.5) 5px 5px 5px at 500ms expected "rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.5) 5px 5px 5px" but got "rgb(150, 150, 150) 15px 15px 15px, rgba(100, 100, 100, 0.501961) 5px 5px 5px"
-FAIL text-shadow: with currentcolor assert_equals: The value should be rgb(0, 255, 0) 5px 5px 5px at 500ms expected "rgb(0, 255, 0) 5px 5px 5px" but got "rgb(0, 0, 0) 5px 5px 5px"
+PASS text-shadow: with currentcolor 
 PASS transform (type: transformList) has testInterpolation function 
 PASS transform: translate 
 PASS transform: rotate 
@@ -242,6 +242,8 @@ PASS transform: scale
 PASS transform: skew 
 PASS transform: rotate and translate 
 PASS transform: translate and rotate 
+FAIL transform: extend shorter list (from) assert_approx_equals: expected matrix(-1,0,0,-1,-50,0) but got matrix(1, -0.00000000000000036739403974420594, 0.00000000000000036739403974420594, 1, 50, -0.000000000000036739403974420595): The value should be matrix(-1,0,0,-1,-50,0) at 500ms but got matrix(1, -0.00000000000000036739403974420594, 0.00000000000000036739403974420594, 1, 50, -0.000000000000036739403974420595) expected -1 +/- 0.0001 but got 1
+FAIL transform: extend shorter list (to) assert_approx_equals: expected matrix(-1,0,0,-1,-50,0) but got matrix(1, -0.00000000000000036739403974420594, 0.00000000000000036739403974420594, 1, 50, 0): The value should be matrix(-1,0,0,-1,-50,0) at 500ms but got matrix(1, -0.00000000000000036739403974420594, 0.00000000000000036739403974420594, 1, 50, 0) expected -1 +/- 0.0001 but got 1
 PASS transform: mismatch order of translate and rotate 
 PASS transform: matrix 
 FAIL transform: rotate3d assert_approx_equals: expected matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,0,0,0,1) but got matrix3d(0.8660254037844386, 0.28867513459481287, -0.40824829046386296, 0, 0, 0.816496580927726, 0.5773502691896256, 0, 0.49999999999999994, -0.4999999999999999, 0.7071067811865476, 0, 0, 0, 0, 1): The value should be matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,0,0,0,1) at 500ms but got matrix3d(0.8660254037844386, 0.28867513459481287, -0.40824829046386296, 0, 0, 0.816496580927726, 0.5773502691896256, 0, 0.49999999999999994, -0.4999999999999999, 0.7071067811865476, 0, 0, 0, 0, 1) expected 0.8535533905932737 +/- 0.0001 but got 0.8660254037844386
@@ -251,6 +253,7 @@ PASS transform: rotateY
 FAIL transform: non-invertible matrices assert_approx_equals: expected matrix(-1,0,0,-1,200,0) but got matrix(-0.0706572801427673, 0.719997959550522, -0.39514637992795165, -0.26007870466007205, 87.65015, 62.44984999999999): The value should be matrix(-1,0,0,-1,200,0) at 499ms but got matrix(-0.0706572801427673, 0.719997959550522, -0.39514637992795165, -0.26007870466007205, 87.65015, 62.44984999999999) expected -1 +/- 0.0001 but got -0.0706572801427673
 FAIL transform: non-invertible matrices in matched transform lists assert_approx_equals: expected matrix(0,-1,1,0,250,0) but got matrix(-0.22996553737931208, -0.6925071587258891, 0.3290121037669934, -0.3263002137418429, 162.60014694824218, 62.44984999999999): The value should be matrix(0,-1,1,0,250,0) at 499ms but got matrix(-0.22996553737931208, -0.6925071587258891, 0.3290121037669934, -0.3263002137418429, 162.60014694824218, 62.44984999999999) expected 0 +/- 0.0001 but got -0.22996553737931208
 FAIL transform: non-invertible matrices in mismatched transform lists assert_approx_equals: expected matrix(-2,0,0,-2,250,0) but got matrix(0.457235039557905, 1.5761580466297944, -1.1176085646538838, -0.6572212090027189, 112.65025, 49.89999999999999): The value should be matrix(-2,0,0,-2,250,0) at 499ms but got matrix(0.457235039557905, 1.5761580466297944, -1.1176085646538838, -0.6572212090027189, 112.65025, 49.89999999999999) expected -2 +/- 0.0001 but got 0.457235039557905
+PASS transform: perspective 
 PASS visibility (type: visibility) has testInterpolation function 
 PASS visibility uses visibility animation when animating from "visible" to "hidden" 
 PASS visibility uses visibility animation when animating from "hidden" to "visible" 
@@ -258,11 +261,11 @@ FAIL visibility uses visibility animation when animating from "hidden" to "colla
 PASS visibility uses visibility animation when animating from "visible" to "hidden" with easeInOutBack easing 
 PASS word-spacing (type: lengthPercentageOrCalc) has testInterpolation function 
 PASS word-spacing supports animating as a length 
-FAIL word-spacing supports animating as a length of rem assert_equals: The value should be 30px at 500ms expected "30px" but got "3px"
+PASS word-spacing supports animating as a length of rem 
 FAIL word-spacing supports animating as a percentage assert_equals: The value should be 30% at 500ms expected "30%" but got "0.75px"
 FAIL word-spacing supports animating as combination units "px" and "%" assert_equals: The value should be calc(5px + 10%) at 500ms expected "calc(5px + 10%)" but got "3355448px"
-FAIL word-spacing supports animating as combination units "%" and "em" assert_equals: The value should be calc(10px + 5%) at 500ms expected "calc(10px + 5%)" but got "0.125px"
-FAIL word-spacing supports animating as combination units "em" and "rem" assert_equals: The value should be 15px at 500ms expected "15px" but got "1px"
+FAIL word-spacing supports animating as combination units "%" and "em" assert_equals: The value should be calc(10px + 5%) at 500ms expected "calc(10px + 5%)" but got "1677731.5px"
+PASS word-spacing supports animating as combination units "em" and "rem" 
 FAIL word-spacing supports animating as combination units "px" and "calc" assert_equals: The value should be calc(10px + 10%) at 500ms expected "calc(10px + 10%)" but got "0px"
 FAIL word-spacing supports animating as a calc assert_equals: The value should be calc(15px + 15%) at 500ms expected "calc(15px + 15%)" but got "0px"
 
index 2c335da..fe23d89 100644 (file)
@@ -17,41 +17,43 @@ html {
 <script>
 'use strict';
 
-for (const property in gCSSProperties) {
-  if (!isSupported(property)) {
-    continue;
-  }
-
-  const setupFunction = gCSSProperties[property].setup;
-  for (const animationType of gCSSProperties[property].types) {
-    let typeObject;
-    let animationTypeString;
-    if (typeof animationType === 'string') {
-      typeObject = types[animationType];
-      animationTypeString = animationType;
-    } else if (typeof animationType === 'object' &&
-               animationType.type && typeof animationType.type === 'string') {
-      typeObject = types[animationType.type];
-      animationTypeString = animationType.type;
+test(function() {
+  for (const property in gCSSProperties) {
+    if (!isSupported(property)) {
+      continue;
     }
 
-    // First, test that the animation type object has 'testInterpolation'.
-    // We use test() function() here so that we can continue the remainder tests
-    // even if this test fails.
-    test(t => {
-      assert_own_property(typeObject, 'testInterpolation', animationTypeString +
-                          ' should have testInterpolation property');
-      assert_equals(typeof typeObject.testInterpolation, 'function',
-                    'testInterpolation method should be a function');
-    }, `${property} (type: ${animationTypeString}) has testInterpolation`
-       + ' function');
+    const setupFunction = gCSSProperties[property].setup;
+    for (const animationType of gCSSProperties[property].types) {
+      let typeObject;
+      let animationTypeString;
+      if (typeof animationType === 'string') {
+        typeObject = types[animationType];
+        animationTypeString = animationType;
+      } else if (typeof animationType === 'object' &&
+                 animationType.type && typeof animationType.type === 'string') {
+        typeObject = types[animationType.type];
+        animationTypeString = animationType.type;
+      }
 
-    if (typeObject.testInterpolation &&
-        typeof typeObject.testInterpolation === 'function') {
-      typeObject.testInterpolation(property,
-                                   setupFunction,
-                                   animationType.options);
+      // First, test that the animation type object has 'testInterpolation'.
+      // We use test() function() here so that we can continue the remainder tests
+      // even if this test fails.
+      test(t => {
+        assert_own_property(typeObject, 'testInterpolation', animationTypeString +
+                            ' should have testInterpolation property');
+        assert_equals(typeof typeObject.testInterpolation, 'function',
+                      'testInterpolation method should be a function');
+      }, `${property} (type: ${animationTypeString}) has testInterpolation`
+         + ' function');
+
+      if (typeObject.testInterpolation &&
+          typeof typeObject.testInterpolation === 'function') {
+        typeObject.testInterpolation(property,
+                                     setupFunction,
+                                     animationType.options);
+      }
     }
   }
-}
+}, 'Setup');
 </script>
index 1220b45..0f84c37 100644 (file)
@@ -361,13 +361,13 @@ const gCSSProperties = {
   'color-interpolation': {
     // https://svgwg.org/svg2-draft/painting.html#ColorInterpolationProperty
     types: [
-      { type: 'discrete', options: [ [ 'linearRGB', 'auto' ] ] }
+      { type: 'discrete', options: [ [ 'linearrgb', 'auto' ] ] }
     ]
   },
   'color-interpolation-filters': {
     // https://drafts.fxtf.org/filters-1/#propdef-color-interpolation-filters
     types: [
-      { type: 'discrete', options: [ [ 'sRGB', 'linearRGB' ] ] }
+      { type: 'discrete', options: [ [ 'srgb', 'linearrgb' ] ] }
     ]
   },
   'column-count': {
@@ -413,19 +413,13 @@ const gCSSProperties = {
       { type: 'discrete', options: [ [ 'auto', '1px' ] ] }
     ]
   },
-  'contain': {
-    // https://drafts.csswg.org/css-containment/#propdef-contain
-    types: [
-      { type: 'discrete', options: [ [ 'strict', 'none' ] ] }
-    ]
-  },
   'content': {
     // https://drafts.csswg.org/css-content-3/#propdef-content
     types: [
       { type: 'discrete', options: [ [ '"a"', '"b"' ] ] }
     ],
     setup: t => {
-      return createPseudo(t, 'before');
+      return getPseudoElement(t, 'before');
     }
   },
   'counter-increment': {
@@ -446,12 +440,6 @@ const gCSSProperties = {
       { type: 'discrete', options: [ [ 'pointer', 'wait' ] ] }
     ]
   },
-  'direction': {
-    // https://drafts.csswg.org/css-writing-modes-3/#propdef-direction
-    types: [
-      { type: 'discrete', options: [ [ 'ltr', 'rtl' ] ] }
-    ]
-  },
   'dominant-baseline': {
     // https://drafts.csswg.org/css-inline/#propdef-dominant-baseline
     types: [
@@ -529,8 +517,8 @@ const gCSSProperties = {
     ]
   },
   'font-stretch': {
-    // https://drafts.csswg.org/css-fonts-3/#propdef-font-stretch
-    types: [ 'fontStretch' ]
+    // https://drafts.csswg.org/css-fonts-4/#propdef-font-stretch
+    types: [ 'percentage' ]
   },
   'font-style': {
     // https://drafts.csswg.org/css-fonts/#propdef-font-style
@@ -711,13 +699,13 @@ const gCSSProperties = {
   'hyphens': {
     // https://drafts.csswg.org/css-text-3/#propdef-hyphens
     types: [
-      { type: 'discrete', options: [ [ 'manual', 'auto' ] ] }
+      { type: 'discrete', options: [ [ 'manual', 'none' ] ] }
     ]
   },
   'image-orientation': {
     // https://drafts.csswg.org/css-images-3/#propdef-image-orientation
     types: [
-      { type: 'discrete', options: [ [ '0deg', '90deg' ] ] }
+      { type: 'discrete', options: [ [ 'none', 'from-image' ] ] }
     ]
   },
   'image-rendering': {
@@ -751,19 +739,19 @@ const gCSSProperties = {
   'justify-content': {
     // https://drafts.csswg.org/css-align/#propdef-justify-content
     types: [
-      { type: 'discrete', options: [ [ 'baseline', 'last baseline' ] ] }
+      { type: 'discrete', options: [ [ 'start', 'end' ] ] }
     ]
   },
   'justify-items': {
     // https://drafts.csswg.org/css-align/#propdef-justify-items
     types: [
-      { type: 'discrete', options: [ [ 'baseline', 'last baseline' ] ] }
+      { type: 'discrete', options: [ [ 'start', 'end' ] ] }
     ]
   },
   'justify-self': {
     // https://drafts.csswg.org/css-align/#propdef-justify-self
     types: [
-      { type: 'discrete', options: [ [ 'baseline', 'last baseline' ] ] }
+      { type: 'discrete', options: [ [ 'start', 'end' ] ] }
     ]
   },
   'left': {
@@ -997,23 +985,28 @@ const gCSSProperties = {
     types: [
     ]
   },
-  'offset-block-end': {
-    // https://drafts.csswg.org/css-logical-props/#propdef-offset-block-end
+  'inset-block-end': {
+    // https://drafts.csswg.org/css-logical-props/#propdef-inset-block-end
     types: [
     ]
   },
-  'offset-block-start': {
-    // https://drafts.csswg.org/css-logical-props/#propdef-offset-block-start
+  'inset-block-start': {
+    // https://drafts.csswg.org/css-logical-props/#propdef-inset-block-start
     types: [
     ]
   },
-  'offset-inline-end': {
-    // https://drafts.csswg.org/css-logical-props/#propdef-offset-inline-end
+  'inset-inline-end': {
+    // https://drafts.csswg.org/css-logical-props/#propdef-inset-inline-end
     types: [
     ]
   },
-  'offset-inline-start': {
-    // https://drafts.csswg.org/css-logical-props/#propdef-offset-inline-start
+  'inset-inline-start': {
+    // https://drafts.csswg.org/css-logical-props/#propdef-inset-inline-start
+    types: [
+    ]
+  },
+  'offset-path': {
+    // https://drafts.fxtf.org/motion-1/#offset-path-property
     types: [
     ]
   },
@@ -1340,12 +1333,6 @@ const gCSSProperties = {
     types: [
     ]
   },
-  'text-orientation': {
-    // https://drafts.csswg.org/css-writing-modes-3/#propdef-text-orientation
-    types: [
-      { type: 'discrete', options: [ [ 'upright', 'sideways' ] ] }
-    ]
-  },
   'text-overflow': {
     // https://drafts.csswg.org/css-ui/#propdef-text-overflow
     types: [
@@ -1405,11 +1392,24 @@ const gCSSProperties = {
       { type: 'discrete', options: [ [ 'flat', 'preserve-3d' ] ] }
     ]
   },
-  'unicode-bidi': {
-    // https://drafts.csswg.org/css-writing-modes-3/#propdef-unicode-bidi
-    types: [
-      { type: 'discrete', options: [ [ 'embed', 'bidi-override' ] ] },
-    ]
+  'rotate': {
+    // https://drafts.csswg.org/css-transforms-2/#individual-transforms
+    types: [ 'rotateList' ]
+  },
+  'translate': {
+    // https://drafts.csswg.org/css-transforms-2/#individual-transforms
+    types: [ 'translateList' ],
+    setup: t => {
+      // We need to set a width/height for resolving percentages against.
+      const element = createElement(t);
+      element.style.width = '100px';
+      element.style.height = '100px';
+      return element;
+    }
+  },
+  'scale': {
+    // https://drafts.csswg.org/css-transforms-2/#individual-transforms
+    types: [ 'scaleList' ]
   },
   'vector-effect': {
     // https://svgwg.org/svg2-draft/coords.html#VectorEffectProperty
@@ -1447,18 +1447,6 @@ const gCSSProperties = {
     // https://drafts.csswg.org/css-text-3/#propdef-word-spacing
     types: [ 'lengthPercentageOrCalc' ]
   },
-  'will-change': {
-    // http://dev.w3.org/csswg/css-will-change/#propdef-will-change
-    types: [
-      { type: 'discrete', options: [ [ 'scroll-position', 'contents' ] ] }
-    ]
-  },
-  'writing-mode': {
-    // https://drafts.csswg.org/css-writing-modes-3/#propdef-writing-mode
-    types: [
-      { type: 'discrete', options: [ [ 'vertical-rl', 'sideways-rl' ] ] }
-    ]
-  },
   'z-index': {
     // https://drafts.csswg.org/css-position/#propdef-z-index
     types: [
@@ -1519,12 +1507,25 @@ function testAnimationSampleMatrices(animation, idlName, testSamples) {
   }
 }
 
+function testAnimationSampleRotate3d(animation, idlName, testSamples) {
+  const target = animation.effect.target;
+  for (const testSample of testSamples) {
+    animation.currentTime = testSample.time;
+    const actual = getComputedStyle(target)[idlName];
+    const expected = testSample.expected;
+    assert_rotate3d_equals(actual, expected,
+                         `The value should be ${expected} at`
+                         + ` ${testSample.time}ms but got ${actual}`);
+  }
+}
+
 function createTestElement(t, setup) {
   return setup ? setup(t) : createElement(t);
 }
 
 function isSupported(property) {
   const testKeyframe = new TestKeyframe(propertyToIDL(property));
+  assert_not_equals(window.KeyframeEffect, undefined, 'window.KeyframeEffect');
   try {
     // Since TestKeyframe returns 'undefined' for |property|,
     // the KeyframeEffect constructor will throw
index eb9c8c1..232a508 100644 (file)
@@ -893,6 +893,30 @@ const transformListType = {
     test(t => {
       const idlName = propertyToIDL(property);
       const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: ['rotate(0deg)',
+                                     'rotate(1080deg) translateX(100px)'] },
+                       1000);
+
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 500, expected: [ -1, 0, 0, -1, -50, 0 ] }]);
+    }, `${property}: extend shorter list (from)`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: ['rotate(0deg) translateX(100px)',
+                                     'rotate(1080deg)'] },
+                       1000);
+
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 500, expected: [ -1, 0, 0, -1, -50, 0 ] }]);
+    }, `${property}: extend shorter list (to)`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
       const animation =              // matrix(0, 1, -1, 0, 0, 100)
         target.animate({ [idlName]: ['rotate(90deg) translateX(100px)',
                                      // matrix(-1, 0, 0, -1, 200, 0)
@@ -1044,6 +1068,23 @@ const transformListType = {
           { time: 500,  expected: [  1, 1, 1,  1, 100, 100 ] },
           { time: 1000, expected: [  1, 1, 1,  1, 100, 100 ] }]);
     }, `${property}: non-invertible matrices in mismatched transform lists`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['perspective(0)', 'perspective(10px)'],
+        },
+        1000
+      );
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 500,  expected: [ 1, 0, 0, 0,
+                                   0, 1, 0, 0,
+                                   0, 0, 1, -0.05,
+                                   0, 0, 0, 1 ] }]);
+    }, `${property}: perspective`);
+
   },
 
   testAddition: function(property, setup) {
@@ -1168,6 +1209,30 @@ const transformListType = {
     test(t => {
       const idlName = propertyToIDL(property);
       const target = createTestElement(t, setup);
+      target.style[idlName] = 'rotate(45deg) translateX(100px)';
+      const animation = target.animate({ [idlName]: ['rotate(-90deg)',
+                                                     'rotate(90deg)'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 0,    expected: [ Math.cos(-Math.PI / 4),
+                                   Math.sin(-Math.PI / 4),
+                                  -Math.sin(-Math.PI / 4),
+                                   Math.cos(-Math.PI / 4),
+                                   100 * Math.cos(Math.PI / 4),
+                                   100 * Math.sin(Math.PI / 4) ] },
+         { time: 1000, expected: [ Math.cos(Math.PI * 3 / 4),
+                                   Math.sin(Math.PI * 3 / 4),
+                                  -Math.sin(Math.PI * 3 / 4),
+                                   Math.cos(Math.PI * 3 / 4),
+                                   100 * Math.cos(Math.PI / 4),
+                                   100 * Math.sin(Math.PI / 4) ] }]);
+    }, `${property}: rotate on rotate and translate`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
       target.style[idlName] = 'matrix(0, 1, -1, 0, 0, 0)';
       const animation =               // Same matrices as above.
         target.animate({ [idlName]: [ 'matrix(1, 0, 0, 1, 100, 0)',
@@ -1366,6 +1431,53 @@ const transformListType = {
     test(t => {
       const idlName = propertyToIDL(property);
       const target = createTestElement(t, setup);
+      target.style[idlName] = 'rotate(45deg)';
+      const animation =
+        target.animate({ [idlName]: ['rotate(45deg) translateX(0px)',
+                                     'rotate(45deg) translateX(100px)'] },
+                       { duration: 1000, fill: 'both', composite: 'accumulate' });
+
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 0,    expected: [ Math.cos(Math.PI / 2),
+                                   Math.sin(Math.PI / 2),
+                                  -Math.sin(Math.PI / 2),
+                                   Math.cos(Math.PI / 2),
+                                   0 * Math.cos(Math.PI / 2),
+                                   0 * Math.sin(Math.PI / 2) ] },
+         { time: 1000, expected: [ Math.cos(Math.PI / 2),
+                                   Math.sin(Math.PI / 2),
+                                  -Math.sin(Math.PI / 2),
+                                   Math.cos(Math.PI / 2),
+                                   100 * Math.cos(Math.PI / 2),
+                                   100 * Math.sin(Math.PI / 2) ] }]);
+    }, `${property}: rotate and translate on rotate`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = 'rotate(45deg) translateX(100px)';
+      const animation =
+        target.animate({ [idlName]: ['rotate(45deg)', 'rotate(45deg)'] },
+                       { duration: 1000, fill: 'both', composite: 'accumulate' });
+
+      testAnimationSampleMatrices(animation, idlName,
+        [{ time: 0,    expected: [ Math.cos(Math.PI / 2),
+                                   Math.sin(Math.PI / 2),
+                                  -Math.sin(Math.PI / 2),
+                                   Math.cos(Math.PI / 2),
+                                   100 * Math.cos(Math.PI / 2),
+                                   100 * Math.sin(Math.PI / 2) ] },
+         { time: 1000, expected: [ Math.cos(Math.PI / 2),
+                                   Math.sin(Math.PI / 2),
+                                  -Math.sin(Math.PI / 2),
+                                   Math.cos(Math.PI / 2),
+                                   100 * Math.cos(Math.PI / 2),
+                                   100 * Math.sin(Math.PI / 2) ] }]);
+    }, `${property}: rotate on roate and translate`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
       target.style[idlName] = 'matrix(0, 1, -1, 0, 0, 0)';
       const animation =                 // Same matrices as above.
         target.animate({ [idlName]: [ 'matrix(1, 0, 0, 1, 100, 0)',
@@ -1583,6 +1695,382 @@ const transformListType = {
   },
 };
 
+const rotateListType = {
+  testInterpolation: (property, setup) => {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['45deg', '135deg'],
+        },
+        1000
+      );
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '90deg' }]);
+    }, `${property} without rotation axes`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: [ '0 1 0 0deg',
+                                      '0 1 0 90deg'] },
+                       1000);
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 500, expected: '0 1 0 45deg' }]);
+    }, `${property} with rotation axes`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+
+      const animation =
+        target.animate({ [idlName]: [ '0 1 0 0deg',
+                                      '0 1 0 720deg'] },
+                       1000);
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 250, expected: '0 1 0 180deg' }]);
+    }, `${property} with rotation axes and range over 360 degrees`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: [ '0 1 0 0deg',
+                                      '0 1 1 90deg'] },
+                       1000);
+
+      testAnimationSampleRotate3d(animation, idlName,
+        [{ time: 500, expected: '0 0.707107 0.707107 45deg' }]);
+    }, `${property} with different rotation axes`);
+  },
+  testAddition: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '45deg';
+      const animation = target.animate({ [idlName]: ['-90deg', '90deg'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-45deg' },
+         { time: 1000, expected: '135deg' }]);
+    }, `${property} without rotation axes`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      // Rotation specified in transform property should not affect the computed
+      // value of |property|.
+      target.style.transform = 'rotate(20deg)';
+      target.style[idlName] = '0 1 0 -45deg';
+      const animation =
+        target.animate({ [idlName]: ['0 1 0 90deg',
+                                     '0 1 0 180deg'] },
+                       { duration: 1000, fill: 'both', composite: 'add' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '0 1 0 45deg' },
+         { time: 1000, expected: '0 1 0 135deg' }]);
+    }, `${property} with underlying transform`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: [ '0 1 0 0deg',
+                                      '1 1 1 270deg'] },
+                       { duration: 1000, fill: 'both', composite: 'add' });
+
+      testAnimationSampleRotate3d(animation, idlName,
+        [{ time: 500, expected: '0.57735 0.57735 0.57735 135deg' }]);
+    }, `${property} with different rotation axes`);
+  },
+  testAccumulation: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '45deg';
+      const animation = target.animate({ [idlName]: ['-90deg', '90deg'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-45deg' },
+         { time: 1000, expected: '135deg' }]);
+    }, `${property} without rotation axes`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style.transform = 'translateX(100px)';
+      target.style[idlName] = '1 0 0 -45deg';
+      const animation =
+        target.animate({ [idlName]: ['1 0 0 90deg',
+                                     '1 0 0 180deg'] },
+                       { duration: 1000, fill: 'both', composite: 'accumulate' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '1 0 0 45deg' },
+         { time: 1000, expected: '1 0 0 135deg' }]);
+    }, `${property} with underlying transform`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation =
+        target.animate({ [idlName]: [ '0 1 0 0deg',
+                                      '1 0 1 180deg'] },
+                       { duration: 1000, fill: 'both', composite: 'accumulate' });
+
+      testAnimationSampleRotate3d(animation, idlName,
+        [{ time: 500, expected: '0.707107 0 0.707107 90deg' }]);
+    }, `${property} with different rotation axes`);
+  },
+};
+
+const translateListType = {
+  testInterpolation: (property, setup) => {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['200px', '400px'],
+        },
+        1000
+      );
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '300px' }]);
+    }, `${property} with two unspecified values`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['200px -200px', '400px 400px'],
+        },
+        1000
+      );
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '300px 100px' }]);
+    }, `${property} with one unspecified value`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['200px -200px 600px', '400px 400px -200px'],
+        },
+        1000
+      );
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '300px 100px 200px' }]);
+    }, `${property} with all three values specified`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate(
+        {
+          [idlName]: ['0% -101px 600px', '400px 50% -200px'],
+        },
+        1000
+      );
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '200px -25.5px 200px' }]);
+    }, `${property} with combination of percentages and lengths`);
+  },
+  testAddition: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '100px';
+      const animation = target.animate({ [idlName]: ['-200px', '500px'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+      testAnimationSamples(animation, idlName,
+        [ { time: 0,    expected: '-100px' },
+          { time: 1000, expected: '600px' }]);
+
+    }, `${property}`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.transform = 'translateY(100px)';
+      target.style[idlName] = '100px';
+      const animation = target.animate({ [idlName]: ['-200px', '500px'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+      testAnimationSamples(animation, idlName,
+        [ { time: 0,    expected: '-100px' },
+          { time: 1000, expected: '600px' }]);
+
+    }, `${property} with underlying transform`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '50%';
+      const animation = target.animate({ [idlName]: ['-200px', '500px'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+      testAnimationSamples(animation, idlName,
+        [ { time: 0,    expected: '-150px' },
+          { time: 1000, expected: '550px' }]);
+
+    }, `${property} with underlying percentage value`);
+  },
+  testAccumulation: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '100px';
+      const animation = target.animate({ [idlName]: ['-200px', '500px'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+      testAnimationSamples(animation, idlName,
+        [ { time: 0,    expected: '-100px' },
+          { time: 1000, expected: '600px' }]);
+    }, `${property}`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.transform = 'translateY(100px)';
+      target.style[idlName] = '100px';
+      const animation = target.animate({ [idlName]: ['-200px', '500px'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+      testAnimationSamples(animation, idlName,
+        [ { time: 0,    expected: '-100px' },
+          { time: 1000, expected: '600px' }]);
+    }, `${property} with transform`);
+  },
+};
+
+const scaleListType = {
+  testInterpolation: (property, setup) => {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate({ [idlName]: ['3', '5'] },
+                                       1000);
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '4' }]);
+    }, `${property} with two unspecified values`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate({ [idlName]: ['3 3', '5 5'] },
+                                       1000);
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '4 4' }]);
+    }, `${property} with one unspecified value`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      const animation = target.animate({ [idlName]: ['3 3 3', '5 5 5'] },
+                                       1000);
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: '4 4 4' }]);
+    }, `${property}`);
+  },
+  testAddition: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2';
+      const animation = target.animate({ [idlName]: ['-3', '5'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-6' },
+         { time: 1000, expected: '10' }]);
+    }, `${property} with two unspecified values`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2 2';
+      const animation = target.animate({ [idlName]: ['-3 -3', '5 5'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-6 -6' },
+         { time: 1000, expected: '10 10' }]);
+    }, `${property} with one unspecified value`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2 2 2';
+      const animation = target.animate({ [idlName]: ['-1 -2 -3', '4 5 6'] },
+                                       { duration: 1000, fill: 'both',
+                                         composite: 'add' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-2 -4 -6' },
+         { time: 1000, expected: '8 10 12' }]);
+    }, `${property}`);
+  },
+  testAccumulation: function(property, setup) {
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2';
+      const animation = target.animate({ [idlName]: ['-3', '5'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-2' },
+         { time: 1000, expected: '6' }]);
+    }, `${property} with two unspecified values`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2 2';
+      const animation = target.animate({ [idlName]: ['-3 -3', '5 5'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '-2 -2' },
+         { time: 1000, expected: '6 6' }]);
+    }, `${property} with one unspecified value`);
+
+    test(t => {
+      const idlName = propertyToIDL(property);
+      const target = createTestElement(t, setup);
+      target.style[idlName] = '2 2 2';
+      const animation = target.animate({ [idlName]: ['-1 -2 -3', '4 5 6'] },
+                                     { duration: 1000, fill: 'both',
+                                       composite: 'accumulate' });
+
+      testAnimationSamples(animation, idlName,
+        [{ time: 0,    expected: '0 -1 -2' },
+         { time: 1000, expected: '5 6 7' }]);
+    }, `${property}`);
+  },
+};
+
 const filterListType = {
   testInterpolation: (property, setup) => {
     test(t => {
@@ -2190,54 +2678,6 @@ const dasharrayType = {
   },
 }
 
-const fontStretchType = {
-  testInterpolation: (property, setup) => {
-    test(t => {
-      const idlName = propertyToIDL(property);
-      const target = createTestElement(t, setup);
-      const animation =
-        target.animate({ [idlName]: ['ultra-condensed', 'extra-condensed'] },
-                       { duration: 1000, fill: 'both' });
-      testAnimationSamples(animation, idlName,
-                           [{ time: 499,  expected: 'ultra-condensed' },
-                            { time: 500,  expected: 'extra-condensed' }]);
-    }, `${property} supports animating as a font-stretch (adjacent values)`);
-
-    test(t => {
-      const idlName = propertyToIDL(property);
-      const target = createTestElement(t, setup);
-      const animation =
-        target.animate({ [idlName]: ['ultra-condensed', 'condensed'] },
-                       { duration: 1000, fill: 'both' });
-      testAnimationSamples(animation, idlName,
-                           [{ time: 500,  expected: 'extra-condensed' }]);
-    }, `${property} supports animating as a font-stretch (between value)`);
-  },
-
-  testAdditionOrAccumulation: (property, setup, composite) => {
-    test(t => {
-      const idlName = propertyToIDL(property);
-      const target = createTestElement(t, setup);
-      target.style[idlName] = 'condensed';
-      const animation =
-        target.animate({ [idlName]: ['expanded', 'ultra-expanded'] },
-                       { duration: 1000, composite });
-      testAnimationSamples(animation, idlName,
-                           [{ time: 0, expected: 'normal' },
-                            { time: 250, expected: 'semi-expanded' }]);
-    },
-    `${property} uses font-stretch behavior for composite type ${composite}`);
-  },
-
-  testAddition: function(property, setup) {
-    this.testAdditionOrAccumulation(property, setup, 'add');
-  },
-
-  testAccumulation: function(property, setup) {
-    this.testAdditionOrAccumulation(property, setup, 'accumulate');
-  },
-}
-
 const fontVariationSettingsType = {
   testInterpolation: (property, setup) => {
     test(t => {
@@ -2316,12 +2756,14 @@ const types = {
   positiveNumber: positiveNumberType,
   opacity: opacityType,
   transformList: transformListType,
+  rotateList: rotateListType,
+  translateList: translateListType,
+  scaleList: scaleListType,
   visibility: visibilityType,
   boxShadowList: boxShadowListType,
   textShadowList: textShadowListType,
   rect: rectType,
   position: positionType,
   dasharray: dasharrayType,
-  fontStretch: fontStretchType,
   fontVariationSettings: fontVariationSettingsType,
 };
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result-expected.txt
new file mode 100644 (file)
index 0000000..6132e4c
--- /dev/null
@@ -0,0 +1,3 @@
+
+PASS Finishing an animation that does not fill forwards causes its animation style to be cleared 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/combining-effects/applying-the-composited-result.html
new file mode 100644 (file)
index 0000000..336115e
--- /dev/null
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Applying the composited result</title>
+<link rel="help"
+  href="https://drafts.csswg.org/web-animations-1/#applying-the-composited-result">
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../../testcommon.js"></script>
+<div id="log"></div>
+<script>
+'use strict';
+
+promise_test(async t => {
+  const div = createDiv(t);
+  div.style.marginLeft = '10px';
+  const animation = div.animate(
+    { marginLeft: ['100px', '200px'] },
+    100 * MS_PER_SEC
+  );
+  await animation.ready;
+
+  animation.finish();
+
+  const marginLeft = parseFloat(getComputedStyle(div).marginLeft);
+  assert_equals(marginLeft, 10, 'The computed style should be reset');
+}, 'Finishing an animation that does not fill forwards causes its animation'
+   + ' style to be cleared');
+
+</script>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance-expected.txt
new file mode 100644 (file)
index 0000000..441506a
--- /dev/null
@@ -0,0 +1,3 @@
+
+PASS Interval distance is calculated correctly (precision test) 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/animation-model/keyframe-effects/effect-value-interval-distance.html
new file mode 100644 (file)
index 0000000..6bf5d8c
--- /dev/null
@@ -0,0 +1,36 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>The effect value of a keyframe effect: Calculating the interval
+  distance between keyframes</title>
+<link rel="help" href="https://drafts.csswg.org/web-animations/#the-effect-value-of-a-keyframe-animation-effect">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../testcommon.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+test(t => {
+  // In Firefox there was a floating precision bug in the calculation of the
+  // progress at the end of the 0.2<->1.0 interval. This test exercises that
+  // calculation in case other UAs suffer from the same problem.
+  const target = createDiv(t);
+  const anim = target.animate(
+    [
+      { opacity: 0 },
+      { offset: 0.2, opacity: 1, easing: 'step-end' },
+      { opacity: 0 },
+    ],
+    {
+      duration: 1000,
+      fill: 'forwards',
+    }
+  );
+
+  anim.currentTime = 1000;
+  assert_equals(getComputedStyle(target).opacity, '0');
+}, 'Interval distance is calculated correctly (precision test)');
+
+</script>
+</body>
index c2e9702..142d49d 100644 (file)
@@ -20,13 +20,13 @@ test(t => {
                   iterations: 10,
                   iterationComposite: 'accumulate' });
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).alignContent, 'flex-end',
     'Animated align-content style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).alignContent, 'flex-start',
     'Animated align-content style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).alignContent, 'flex-end',
     'Animated align-content style at 50s of the third iteration');
 }, 'iteration composition of discrete type animation (align-content)');
@@ -41,13 +41,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft, '5px',
     'Animated margin-left style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).marginLeft, '20px',
     'Animated margin-left style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft, '25px',
     'Animated margin-left style at 50s of the third iteration');
 }, 'iteration composition of <length> type animation');
@@ -66,13 +66,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width, '25px',
     'Animated width style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).width, '100px',
     'Animated width style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width, '125px',
     'Animated width style at 50s of the third iteration');
 }, 'iteration composition of <percentage> type animation');
@@ -87,13 +87,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).color, 'rgb(60, 60, 60)',
     'Animated color style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).color, 'rgb(240, 240, 240)',
     'Animated color style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).color, 'rgb(255, 255, 255)',
     'Animated color style at 50s of the third iteration');
 }, 'iteration composition of <color> type animation');
@@ -108,13 +108,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).color, 'rgb(30, 90, 30)',
     'Animated color style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).color, 'rgb(120, 240, 120)',
     'Animated color style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   // The green color is (240 + 180) / 2 = 210
   assert_equals(getComputedStyle(div).color, 'rgb(150, 210, 150)',
     'Animated color style at 50s of the third iteration');
@@ -131,13 +131,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).flexGrow, '5',
     'Animated flex-grow style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).flexGrow, '20',
     'Animated flex-grow style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).flexGrow, '25',
     'Animated flex-grow style at 50s of the third iteration');
 }, 'iteration composition of <number> type animation');
@@ -154,13 +154,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).clip, 'rect(5px, 5px, 5px, 5px)',
     'Animated clip style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).clip, 'rect(20px, 20px, 20px, 20px)',
     'Animated clip style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).clip, 'rect(25px, 25px, 25px, 25px)',
     'Animated clip style at 50s of the third iteration');
 }, 'iteration composition of <shape> type animation');
@@ -175,13 +175,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width, '5px',
     'Animated calc width style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).width, '20px',
     'Animated calc width style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width, '25px',
     'Animated calc width style at 50s of the third iteration');
 }, 'iteration composition of <calc()> value animation');
@@ -200,15 +200,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width, '10px',
     // 100px * 5% + 5px
     'Animated calc width style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).width,
     '40px', // 100px * (10% + 10%) + (10px + 10px)
     'Animated calc width style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).width,
     '50px', // (40px + 60px) / 2
     'Animated calc width style at 50s of the third iteration');
@@ -225,13 +225,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).opacity, '0.2',
     'Animated opacity style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).opacity, '0.8',
     'Animated opacity style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).opacity, '1', // (0.8 + 1.2) * 0.5
     'Animated opacity style at 50s of the third iteration');
 }, 'iteration composition of opacity animation');
@@ -247,15 +247,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).boxShadow,
     'rgb(60, 60, 60) 5px 5px 5px 0px',
     'Animated box-shadow style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).boxShadow,
     'rgb(240, 240, 240) 20px 20px 20px 0px',
     'Animated box-shadow style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).boxShadow,
     'rgb(255, 255, 255) 25px 25px 25px 0px',
     'Animated box-shadow style at 50s of the third iteration');
@@ -271,13 +271,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter, 'blur(5px)',
     'Animated filter blur style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter, 'blur(20px)',
     'Animated filter blur style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter, 'blur(25px)',
     'Animated filter blur style at 50s of the third iteration');
 }, 'iteration composition of filter blur animation');
@@ -293,15 +293,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(1.4)',
     'Animated filter brightness style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(2.6)', // brightness(1) + brightness(0.8) + brightness(0.8)
     'Animated filter brightness style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(3)', // (brightness(2.6) + brightness(3.4)) * 0.5
     'Animated filter brightness style at 50s of the third iteration');
@@ -318,15 +318,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(0.5)',
     'Animated filter brightness style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(0)', // brightness(1) is an identity element, not accumulated.
     'Animated filter brightness style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(0.5)', // brightness(1) is an identity element, not accumulated.
     'Animated filter brightness style at 50s of the third iteration');
@@ -343,15 +343,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'drop-shadow(rgb(60, 60, 60) 5px 5px 5px)',
     'Animated filter drop-shadow style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     'drop-shadow(rgb(240, 240, 240) 20px 20px 20px)',
     'Animated filter drop-shadow style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'drop-shadow(rgb(255, 255, 255) 25px 25px 25px)',
     'Animated filter drop-shadow style at 50s of the third iteration');
@@ -368,15 +368,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(1.5) contrast(1.5)',
     'Animated filter list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(3) contrast(3)',
     'Animated filter list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'brightness(3.5) contrast(3.5)',
     'Animated filter list at 50s of the third iteration');
@@ -393,18 +393,18 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'contrast(2) brightness(2)', // discrete
     'Animated filter list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     // We can't accumulate 'contrast(2) brightness(2)' onto
     // the first list 'brightness(1) contrast(1)' because of
     // mismatch of the order.
     'brightness(1) contrast(1)',
     'Animated filter list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     // We *can* accumulate 'contrast(2) brightness(2)' onto
     // the same list 'contrast(2) brightness(2)' here.
@@ -424,15 +424,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'sepia(0.5) contrast(1.5)',
     'Animated filter list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).filter,
     'sepia(2) contrast(3)',
     'Animated filter list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).filter,
     'sepia(2.5) contrast(3.5)',
     'Animated filter list at 50s of the third iteration');
@@ -448,15 +448,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0, 1, -1, 0, 0, 0)', // rotate(90deg)
     'Animated transform(rotate) style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(1, 0, 0, 1, 0, 0)', // rotate(360deg)
     'Animated transform(rotate) style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0, 1, -1, 0, 0, 0)', // rotate(450deg)
     'Animated transform(rotate) style at 50s of the third iteration');
@@ -472,16 +472,16 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0.5, 0, 0, 0.5, 0, 0)', // scale(0.5)
     'Animated transform(scale) style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0, 0, 0, 0, 0, 0)', // scale(0); scale(1) is an identity element,
                                 // not accumulated.
     'Animated transform(scale) style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0.5, 0, 0, 0.5, 0, 0)', // scale(0.5); scale(1) an identity
                                     // element, not accumulated.
@@ -498,15 +498,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(1.5, 0, 0, 1.5, 0, 0)', // scale(1.5)
     'Animated transform(scale) style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(3, 0, 0, 3, 0, 0)', // scale(1 + (2 -1) + (2 -1))
     'Animated transform(scale) style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(3.5, 0, 0, 3.5, 0, 0)', // (scale(3) + scale(4)) * 0.5
     'Animated transform(scale) style at 50s of the third iteration');
@@ -522,15 +522,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(1, 0, 0, 1, 0, 0)', // scale(1)
     'Animated transform(scale) style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(2, 0, 0, 2, 0, 0)', // (scale(0) + scale(2-1)*2)
     'Animated transform(scale) style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(3, 0, 0, 3, 0, 0)', // (scale(2) + scale(4)) * 0.5
     'Animated transform(scale) style at 50s of the third iteration');
@@ -547,15 +547,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0, 1, -1, 0, 0, 5)', // rotate(90deg) translateX(5px)
     'Animated transform list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(1, 0, 0, 1, 20, 0)', // rotate(360deg) translateX(20px)
     'Animated transform list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(0, 1, -1, 0, 0, 25)', // rotate(450deg) translateX(25px)
     'Animated transform list at 50s of the third iteration');
@@ -572,16 +572,16 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(2.5, 0, 0, 2.5, 15, 0)',
     'Animated transform of matrix function at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // scale(2) + (scale(3-1)*2) + translateX(30px)*2
     'matrix(6, 0, 0, 6, 60, 0)',
     'Animated transform of matrix function at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // from: matrix(6, 0, 0, 6, 60, 0)
     // to:   matrix(7, 0, 0, 7, 90, 0)
@@ -601,20 +601,20 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // Interpolate between matrix(2, 0, 0, 2,  0, 0) = translateX(0px) scale(2)
     //                 and matrix(3, 0, 0, 3, 30, 0) = scale(3) translateX(10px)
     'matrix(2.5, 0, 0, 2.5, 15, 0)',
     'Animated transform list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // 'from' and 'to' value are mismatched, so accumulate
     // matrix(2, 0, 0, 2, 0, 0) onto matrix(3, 0, 0, 3, 30, 0) * 2
     //  = scale(2) + (scale(3-1)*2) + translateX(30px)*2
     'matrix(6, 0, 0, 6, 60, 0)',
     'Animated transform list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // Interpolate between matrix(6, 0, 0, 6, 60, 0)
     //                 and matrix(7, 0, 0, 7, 210, 0) = scale(7) translate(30px)
@@ -636,20 +636,20 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // Interpolate between matrix(1, 0, 0, 1,  0, 0) = translateX(0px)
     //                 and matrix(2, 0, 0, 2, 20, 0) = scale(2) translateX(10px)
     'matrix(1.5, 0, 0, 1.5, 10, 0)',
     'Animated transform list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // 'from' and 'to' value are mismatched, so accumulate
     // matrix(1, 0, 0, 1, 0, 0) onto matrix(2, 0, 0, 2, 20, 0) * 2
     //  = scale(1) + (scale(2-1)*2) + translateX(20px)*2
     'matrix(3, 0, 0, 3, 40, 0)',
     'Animated transform list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // Interpolate between matrix(3, 0, 0, 3, 40, 0)
     //                 and matrix(4, 0, 0, 4, 120, 0) =
@@ -670,17 +670,17 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // translateX(none) -> translateX(10px) @ 50%
     'matrix(1, 0, 0, 1, 5, 0)',
     'Animated transform list at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // translateX(10px * 2 + none) -> translateX(10px * 2 + 10px) @ 0%
     'matrix(1, 0, 0, 1, 20, 0)',
     'Animated transform list at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // translateX(10px * 2 + none) -> translateX(10px * 2 + 10px) @ 50%
     'matrix(1, 0, 0, 1, 25, 0)',
@@ -704,16 +704,16 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 40, 1)',
     'Animated transform of matrix3d function at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // translateZ(30px) + (translateZ(50px)*2)
     'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 130, 1)',
     'Animated transform of matrix3d function at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     // from: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 130, 1)
     // to:   matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 150, 1)
@@ -736,11 +736,11 @@ test(t => {
   assert_matrix_equals(getComputedStyle(div).transform,
     'matrix(1, 0, 0, 1, 0, 0)', // Actually not rotated at all.
     'Animated transform of rotate3d function at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     rotate3dToMatrix3d(1, 1, 0, Math.PI), // 180deg
     'Animated transform of rotate3d function at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_matrix_equals(getComputedStyle(div).transform,
     rotate3dToMatrix3d(1, 1, 0, 225 * Math.PI / 180), //((270 + 180) * 0.5)deg
     'Animated transform of rotate3d function at 50s of the third iteration');
@@ -756,13 +756,13 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft, '15px',
     'Animated margin-left style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).marginLeft, '50px', // 10px + 20px + 20px
     'Animated margin-left style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft, '55px', // (50px + 60px) * 0.5
     'Animated margin-left style at 50s of the third iteration');
 }, 'iteration composition starts with non-zero value animation');
@@ -777,15 +777,15 @@ test(t => {
                   iterationComposite: 'accumulate' });
   anim.pause();
 
-  anim.currentTime = anim.effect.timing.duration / 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft,
     '0px',
     'Animated margin-left style at 50s of the first iteration');
-  anim.currentTime = anim.effect.timing.duration * 2;
+  anim.currentTime = anim.effect.getComputedTiming().duration * 2;
   assert_equals(getComputedStyle(div).marginLeft,
     '-10px', // 10px + -10px + -10px
     'Animated margin-left style at 0s of the third iteration');
-  anim.currentTime += anim.effect.timing.duration / 2;
+  anim.currentTime += anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft,
     '-20px', // (-10px + -30px) * 0.5
     'Animated margin-left style at 50s of the third iteration');
@@ -801,17 +801,22 @@ test(t => {
   anim.pause();
 
   anim.currentTime =
-    anim.effect.timing.duration * 2 + anim.effect.timing.duration / 2;
+    anim.effect.getComputedTiming().duration * 2 +
+    anim.effect.getComputedTiming().duration / 2;
   assert_equals(getComputedStyle(div).marginLeft, '25px',
     'Animated style at 50s of the third iteration');
 
   // double its duration.
-  anim.effect.timing.duration = anim.effect.timing.duration * 2;
+  anim.effect.updateTiming({
+    duration: anim.effect.getComputedTiming().duration * 2
+  });
   assert_equals(getComputedStyle(div).marginLeft, '12.5px',
     'Animated style at 25s of the first iteration');
 
   // half of original.
-  anim.effect.timing.duration = anim.effect.timing.duration / 4;
+  anim.effect.updateTiming({
+    duration: anim.effect.getComputedTiming().duration / 4
+  });
   assert_equals(getComputedStyle(div).marginLeft, '50px',
       'Animated style at 50s of the fourth iteration');
 }, 'duration changes with an iteration composition operation of accumulate');
index d6f5cb0..a695886 100644 (file)
@@ -3,7 +3,6 @@ PASS Element.animate() creates an Animation object
 PASS Element.animate() creates an Animation object in the relevant realm of the target element 
 PASS Element.animate() creates an Animation object with a KeyframeEffect 
 PASS Element.animate() creates an Animation object with a KeyframeEffect that is created in the relevant realm of the target element 
-PASS Element.animate() creates an Animation object with a KeyframeEffect whose AnimationEffectTiming object is created in the relevant realm of the target element 
 PASS Element.animate() accepts empty keyframe lists (input: []) 
 PASS Element.animate() accepts empty keyframe lists (input: null) 
 PASS Element.animate() accepts empty keyframe lists (input: undefined) 
@@ -81,6 +80,22 @@ PASS Element.animate() does not accept a keyframe sequence with an invalid easin
 PASS Element.animate() does not accept property-indexed keyframes with an invalid composite value 
 PASS Element.animate() does not accept property-indexed keyframes with an invalid composite value as one of the array values 
 PASS Element.animate() does not accept keyframes with an invalid composite value 
+PASS Element.animate() accepts a double as an options argument 
+PASS Element.animate() accepts a KeyframeAnimationOptions argument 
+PASS Element.animate() accepts an absent options argument 
+PASS Element.animate() does not accept invalid delay value: NaN 
+PASS Element.animate() does not accept invalid delay value: Infinity 
+PASS Element.animate() does not accept invalid delay value: -Infinity 
+PASS Element.animate() accepts a duration of 'auto' using a dictionary object 
+PASS Element.animate() does not accept invalid duration value: -1 
+PASS Element.animate() does not accept invalid duration value: NaN 
+PASS Element.animate() does not accept invalid duration value: -Infinity 
+PASS Element.animate() does not accept invalid duration value: "abc" 
+PASS Element.animate() does not accept invalid duration value: -1 using a dictionary object 
+PASS Element.animate() does not accept invalid duration value: NaN using a dictionary object 
+PASS Element.animate() does not accept invalid duration value: -Infinity using a dictionary object 
+PASS Element.animate() does not accept invalid duration value: "abc" using a dictionary object 
+PASS Element.animate() does not accept invalid duration value: "100" using a dictionary object 
 PASS Element.animate() does not accept invalid easing: '' 
 PASS Element.animate() does not accept invalid easing: '7' 
 PASS Element.animate() does not accept invalid easing: 'test' 
@@ -110,14 +125,18 @@ PASS Element.animate() does not accept invalid easing: 'frames(a)'
 PASS Element.animate() does not accept invalid easing: 'frames(2.0)' 
 PASS Element.animate() does not accept invalid easing: 'frames(2.5)' 
 PASS Element.animate() does not accept invalid easing: 'frames(2 3)' 
-PASS Element.animate() accepts a double as an options argument 
-PASS Element.animate() accepts a KeyframeAnimationOptions argument 
-PASS Element.animate() accepts an absent options argument 
+PASS Element.animate() does not accept invalid iterationStart value: -1 
+PASS Element.animate() does not accept invalid iterationStart value: NaN 
+PASS Element.animate() does not accept invalid iterationStart value: Infinity 
+PASS Element.animate() does not accept invalid iterationStart value: -Infinity 
+PASS Element.animate() does not accept invalid iterations value: -1 
+PASS Element.animate() does not accept invalid iterations value: -Infinity 
+PASS Element.animate() does not accept invalid iterations value: NaN 
 PASS Element.animate() correctly sets the id attribute when no id is specified 
 PASS Element.animate() correctly sets the id attribute 
 PASS Element.animate() correctly sets the Animation's timeline 
 PASS Element.animate() correctly sets the Animation's timeline when triggered on an element in a different document 
 PASS Element.animate() calls play on the Animation 
-FAIL CSSPseudoElement.animate() creates an Animation object assert_equals: expected Element node <div class="pseudo"></div> but got null
-FAIL CSSPseudoElement.animate() creates an Animation object targeting to the correct CSSPseudoElement object assert_equals: expected Element node <div class="pseudo"></div> but got null
+PASS CSSPseudoElement.animate() creates an Animation object 
+PASS CSSPseudoElement.animate() creates an Animation object targeting to the correct CSSPseudoElement object 
 
index 36c4ee1..cbec1b0 100644 (file)
@@ -8,6 +8,8 @@
 <script src="../../resources/easing-tests.js"></script>
 <script src="../../resources/keyframe-utils.js"></script>
 <script src="../../resources/keyframe-tests.js"></script>
+<script src="../../resources/timing-utils.js"></script>
+<script src="../../resources/timing-tests.js"></script>
 <body>
 <div id="log"></div>
 <iframe width="10" height="10" id="iframe"></iframe>
@@ -17,8 +19,7 @@
 // Tests on Element
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate(null);
+  const anim = createDiv(t).animate(null);
   assert_class_string(anim, 'Animation', 'Returned object is an Animation');
 }, 'Element.animate() creates an Animation object');
 
@@ -57,26 +58,9 @@ test(t => {
 }, 'Element.animate() creates an Animation object with a KeyframeEffect'
    + ' that is created in the relevant realm of the target element');
 
-test(t => {
-  const iframe = window.frames[0];
-  const div = createDiv(t, iframe.document);
-  const anim = div.animate(null);
-  assert_equals(Object.getPrototypeOf(anim.effect.timing),
-                iframe.AnimationEffectTiming.prototype,
-                'The prototype of the created AnimationEffectTiming is that'
-                + ' defined on the relevant global for the target element');
-  assert_not_equals(Object.getPrototypeOf(anim.effect.timing),
-                    AnimationEffectTiming.prototype,
-                    'The prototype of the created AnimationEffectTiming is NOT'
-                    + ' that of the current global');
-}, 'Element.animate() creates an Animation object with a KeyframeEffect'
-   + ' whose AnimationEffectTiming object is created in the relevant realm'
-   + ' of the target element');
-
 for (const subtest of gEmptyKeyframeListTests) {
   test(t => {
-    const div = createDiv(t);
-    const anim = div.animate(subtest, 2000);
+    const anim = createDiv(t).animate(subtest, 2000);
     assert_not_equals(anim, null);
   }, 'Element.animate() accepts empty keyframe lists ' +
      `(input: ${JSON.stringify(subtest)})`);
@@ -84,8 +68,7 @@ for (const subtest of gEmptyKeyframeListTests) {
 
 for (const subtest of gKeyframesTests) {
   test(t => {
-    const div = createDiv(t);
-    const anim = div.animate(subtest.input, 2000);
+    const anim = createDiv(t).animate(subtest.input, 2000);
     assert_frame_lists_equal(anim.effect.getKeyframes(), subtest.output);
   }, `Element.animate() accepts ${subtest.desc}`);
 }
@@ -99,54 +82,101 @@ for (const subtest of gInvalidKeyframesTests) {
   }, `Element.animate() does not accept ${subtest.desc}`);
 }
 
-for (const invalidEasing of gInvalidEasings) {
-  test(t => {
-    const div = createDiv(t);
-    assert_throws(new TypeError, () => {
-      div.animate({ easing: invalidEasing }, 2000);
-    });
-  }, `Element.animate() does not accept invalid easing: '${invalidEasing}'`);
-}
-
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_equals(anim.effect.timing.duration, 2000);
-  // Also check that unspecified parameters receive their default values
-  assert_equals(anim.effect.timing.fill, 'auto');
+  const anim = createDiv(t).animate(null, 2000);
+  assert_equals(anim.effect.getTiming().duration, 2000);
+  assert_default_timing_except(anim.effect, ['duration']);
 }, 'Element.animate() accepts a double as an options argument');
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { duration: Infinity, fill: 'forwards' });
-  assert_equals(anim.effect.timing.duration, Infinity);
-  assert_equals(anim.effect.timing.fill, 'forwards');
-  // Also check that unspecified parameters receive their default values
-  assert_equals(anim.effect.timing.direction, 'normal');
+  const anim = createDiv(t).animate(null,
+                                    { duration: Infinity, fill: 'forwards' });
+  assert_equals(anim.effect.getTiming().duration, Infinity);
+  assert_equals(anim.effect.getTiming().fill, 'forwards');
+  assert_default_timing_except(anim.effect, ['duration', 'fill']);
 }, 'Element.animate() accepts a KeyframeAnimationOptions argument');
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] });
-  assert_equals(anim.effect.timing.duration, 'auto');
+  const anim = createDiv(t).animate(null);
+  assert_default_timing_except(anim.effect, []);
 }, 'Element.animate() accepts an absent options argument');
 
+for (const invalid of gBadDelayValues) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, { delay: invalid });
+    });
+  }, `Element.animate() does not accept invalid delay value: ${invalid}`);
+}
+
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
+  const anim = createDiv(t).animate(null, { duration: 'auto' });
+  assert_equals(anim.effect.getTiming().duration, 'auto', 'set duration \'auto\'');
+  assert_equals(anim.effect.getComputedTiming().duration, 0,
+                'getComputedTiming() after set duration \'auto\'');
+}, 'Element.animate() accepts a duration of \'auto\' using a dictionary'
+   + ' object');
+
+for (const invalid of gBadDurationValues) {
+  if (typeof invalid === 'string' && !isNaN(parseFloat(invalid))) {
+    continue;
+  }
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, invalid);
+    });
+  }, 'Element.animate() does not accept invalid duration value: '
+     + (typeof invalid === 'string' ? `"${invalid}"` : invalid));
+}
+
+for (const invalid of gBadDurationValues) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, { duration: invalid });
+    });
+  }, 'Element.animate() does not accept invalid duration value: '
+     + (typeof invalid === 'string' ? `"${invalid}"` : invalid)
+     + ' using a dictionary object');
+}
+
+for (const invalidEasing of gInvalidEasings) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate({ easing: invalidEasing }, 2000);
+    });
+  }, `Element.animate() does not accept invalid easing: '${invalidEasing}'`);
+}
+
+for (const invalid of gBadIterationStartValues) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, { iterationStart: invalid });
+    });
+  }, 'Element.animate() does not accept invalid iterationStart value: ' +
+     invalid);
+}
+
+for (const invalid of gBadIterationsValues) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, { iterations: invalid });
+    });
+  }, 'Element.animate() does not accept invalid iterations value: ' +
+     invalid);
+}
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
   assert_equals(anim.id, '');
 }, 'Element.animate() correctly sets the id attribute when no id is specified');
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, { id: 'test' });
+  const anim = createDiv(t).animate(null, { id: 'test' });
   assert_equals(anim.id, 'test');
 }, 'Element.animate() correctly sets the id attribute');
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
+  const anim = createDiv(t).animate(null, 2000);
   assert_equals(anim.timeline, document.timeline);
 }, 'Element.animate() correctly sets the Animation\'s timeline');
 
@@ -157,7 +187,7 @@ async_test(t => {
 
   iframe.addEventListener('load', t.step_func(() => {
     const div = createDiv(t, iframe.contentDocument);
-    const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
+    const anim = div.animate(null, 2000);
     assert_equals(anim.timeline, iframe.contentDocument.timeline);
     iframe.remove();
     t.done();
@@ -168,21 +198,20 @@ async_test(t => {
    'triggered on an element in a different document');
 
 test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
+  const anim = createDiv(t).animate(null, 2000);
   assert_equals(anim.playState, 'running');
 }, 'Element.animate() calls play on the Animation');
 
 // Tests on CSSPseudoElement
 
 test(t => {
-  const pseudoTarget = createPseudo(t, 'before');
+  const pseudoTarget = getPseudoElement(t, 'before');
   const anim = pseudoTarget.animate(null);
   assert_class_string(anim, 'Animation', 'The returned object is an Animation');
 }, 'CSSPseudoElement.animate() creates an Animation object');
 
 test(t => {
-  const pseudoTarget = createPseudo(t, 'before');
+  const pseudoTarget = getPseudoElement(t, 'before');
   const anim = pseudoTarget.animate(null);
   assert_equals(anim.effect.target, pseudoTarget,
                 'The returned Animation targets to the correct object');
index d05e2aa..182b5cb 100644 (file)
@@ -75,12 +75,14 @@ test(t => {
   assert_array_equals(div.getAnimations(), [],
                       'Animation should not be returned when it is finished');
 
-  animation.effect.timing.duration += 100 * MS_PER_SEC;
+  animation.effect.updateTiming({
+    duration: animation.effect.getTiming().duration + 100 * MS_PER_SEC,
+  });
   assert_array_equals(div.getAnimations(), [animation],
                       'Animation should be returned after extending the'
                       + ' duration');
 
-  animation.effect.timing.duration = 0;
+  animation.effect.updateTiming({ duration: 0 });
   assert_array_equals(div.getAnimations(), [],
                       'Animation should not be returned after setting the'
                       + ' duration to zero');
@@ -91,13 +93,13 @@ test(t => {
   const div = createDiv(t);
   const animation = div.animate(null, 100 * MS_PER_SEC);
 
-  animation.effect.timing.endDelay = -200 * MS_PER_SEC;
+  animation.effect.updateTiming({ endDelay: -200 * MS_PER_SEC });
   assert_array_equals(div.getAnimations(), [],
                       'Animation should not be returned after setting a'
                       + ' negative end delay such that the end time is less'
                       + ' than the current time');
 
-  animation.effect.timing.endDelay = 100 * MS_PER_SEC;
+  animation.effect.updateTiming({ endDelay: 100 * MS_PER_SEC });
   assert_array_equals(div.getAnimations(), [animation],
                       'Animation should be returned after setting a positive'
                       + ' end delay such that the end time is more than the'
@@ -113,17 +115,17 @@ test(t => {
   assert_array_equals(div.getAnimations(), [],
                       'Animation should not be returned when it is finished');
 
-  animation.effect.timing.iterations = 10;
+  animation.effect.updateTiming({ iterations: 10 });
   assert_array_equals(div.getAnimations(), [animation],
                       'Animation should be returned after inreasing the'
                       + ' number of iterations');
 
-  animation.effect.timing.iterations = 0;
+  animation.effect.updateTiming({ iterations: 0 });
   assert_array_equals(div.getAnimations(), [],
                       'Animations should not be returned after setting the'
                       + ' iteration count to zero');
 
-  animation.effect.timing.iterations = Infinity;
+  animation.effect.updateTiming({ iterations: Infinity });
   assert_array_equals(div.getAnimations(), [animation],
                       'Animation should be returned after inreasing the'
                       + ' number of iterations to infinity');
index be1bb5d..711a339 100644 (file)
@@ -29,7 +29,7 @@ test(t => {
   const div = createDiv(t);
   const animation = div.animate({ marginLeft: ['100px', '200px'] },
                                 100 * MS_PER_SEC);
-  animation.effect.timing.easing = 'linear';
+  animation.effect.updateTiming({ easing: 'linear' });
   animation.cancel();
   assert_equals(getComputedStyle(div).marginLeft, '0px',
                 'margin-left style is not animated after cancelling');
index c00c66e..fcbaab1 100644 (file)
@@ -14,7 +14,7 @@
 const gTarget = document.getElementById('target');
 
 function createEffect() {
-  return new KeyframeEffectReadOnly(gTarget, { opacity: [0, 1] });
+  return new KeyframeEffect(gTarget, { opacity: [0, 1] });
 }
 
 function createNull() {
@@ -82,10 +82,9 @@ for (const args of gTestArguments) {
 }
 
 test(t => {
-  const effect = new KeyframeEffectReadOnly(null,
-                                            { left: ['10px', '20px'] },
-                                            { duration: 10000,
-                                              fill: 'forwards' });
+  const effect = new KeyframeEffect(null,
+                                    { left: ['10px', '20px'] },
+                                    { duration: 10000, fill: 'forwards' });
   const anim = new Animation(effect, document.timeline);
   anim.pause();
   assert_equals(effect.getComputedTiming().progress, 0.0);
@@ -100,7 +99,7 @@ async_test(t => {
 
   iframe.addEventListener('load', t.step_func(() => {
     const div = createDiv(t, iframe.contentDocument);
-    const effect = new KeyframeEffectReadOnly(div, null, 10000);
+    const effect = new KeyframeEffect(div, null, 10000);
     const anim = new Animation(effect);
     assert_equals(anim.timeline, document.timeline);
     iframe.remove();
index 175fc31..cb8bc09 100644 (file)
@@ -14,7 +14,7 @@ test(t => {
   const anim = new Animation();
   assert_equals(anim.effect, null, 'initial effect is null');
 
-  const newEffect = new KeyframeEffectReadOnly(createDiv(t), null);
+  const newEffect = new KeyframeEffect(createDiv(t), null);
   anim.effect = newEffect;
   assert_equals(anim.effect, newEffect, 'new effect is set');
 }, 'effect is set correctly.');
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish-expected.txt
deleted file mode 100644 (file)
index bf7f8f5..0000000
+++ /dev/null
@@ -1,17 +0,0 @@
-
-PASS Test exceptions when finishing non-running animation 
-PASS Test exceptions when finishing infinite animation 
-PASS Test finishing of animation 
-PASS Test finishing of animation with a current time past the effect end 
-PASS Test finishing of reversed animation 
-PASS Test finishing of reversed animation with a current time less than zero 
-PASS Test finish() while paused 
-PASS Test finish() while pause-pending with positive playbackRate 
-PASS Test finish() while pause-pending with negative playbackRate 
-PASS Test finish() while play-pending 
-PASS Test finish() during aborted pause 
-PASS Test resetting of computed style 
-PASS Test finish() resolves finished promise synchronously 
-PASS Test finish() resolves finished promise synchronously with an animation without a target 
-PASS Test normally finished animation resolves finished promise synchronously with an animation without a target 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/finish.html
deleted file mode 100644 (file)
index 1f81867..0000000
+++ /dev/null
@@ -1,246 +0,0 @@
-<!DOCTYPE html>
-<meta charset=utf-8>
-<title>Animation.finish</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animation-finish">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../../testcommon.js"></script>
-<body>
-<div id="log"></div>
-<script>
-'use strict';
-
-const gKeyFrames = { 'marginLeft': ['100px', '200px'] };
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.playbackRate = 0;
-
-  assert_throws({name: 'InvalidStateError'}, () => {
-    animation.finish();
-  });
-}, 'Test exceptions when finishing non-running animation');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames,
-                                { duration : 100 * MS_PER_SEC,
-                                  iterations : Infinity });
-
-  assert_throws({name: 'InvalidStateError'}, () => {
-    animation.finish();
-  });
-}, 'Test exceptions when finishing infinite animation');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.finish();
-
-  assert_equals(animation.currentTime, 100 * MS_PER_SEC,
-                'After finishing, the currentTime should be set to the end ' +
-                'of the active duration');
-}, 'Test finishing of animation');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-   // 1s past effect end
-  animation.currentTime =
-    animation.effect.getComputedTiming().endTime + 1 * MS_PER_SEC;
-  animation.finish();
-
-  assert_equals(animation.currentTime, 100 * MS_PER_SEC,
-                'After finishing, the currentTime should be set back to the ' +
-                'end of the active duration');
-}, 'Test finishing of animation with a current time past the effect end');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.currentTime = 100 * MS_PER_SEC;
-  return animation.finished.then(() => {
-    animation.playbackRate = -1;
-    animation.finish();
-
-    assert_equals(animation.currentTime, 0,
-                  'After finishing a reversed animation the currentTime ' +
-                  'should be set to zero');
-  });
-}, 'Test finishing of reversed animation');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.currentTime = 100 * MS_PER_SEC;
-  return animation.finished.then(() => {
-    animation.playbackRate = -1;
-    animation.currentTime = -1000;
-    animation.finish();
-
-    assert_equals(animation.currentTime, 0,
-                  'After finishing a reversed animation the currentTime ' +
-                  'should be set back to zero');
-  });
-}, 'Test finishing of reversed animation with a current time less than zero');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.pause();
-  return animation.ready.then(() => {
-    animation.finish();
-
-    assert_equals(animation.playState, 'finished',
-                  'The play state of a paused animation should become ' +
-                  '"finished" after finish() is called');
-    assert_times_equal(animation.startTime,
-                       animation.timeline.currentTime - 100 * MS_PER_SEC,
-                       'The start time of a paused animation should be set ' +
-                       'after calling finish()');
-  });
-}, 'Test finish() while paused');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.pause();
-  // Update playbackRate so we can test that the calculated startTime
-  // respects it
-  animation.playbackRate = 2;
-  // While animation is still pause-pending call finish()
-  animation.finish();
-
-  assert_equals(animation.playState, 'finished',
-                'The play state of a pause-pending animation should become ' +
-                '"finished" after finish() is called');
-  assert_times_equal(animation.startTime,
-                     animation.timeline.currentTime - 100 * MS_PER_SEC / 2,
-                     'The start time of a pause-pending animation should ' +
-                     'be set after calling finish()');
-}, 'Test finish() while pause-pending with positive playbackRate');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.pause();
-  animation.playbackRate = -2;
-  animation.finish();
-
-  assert_equals(animation.playState, 'finished',
-                'The play state of a pause-pending animation should become ' +
-                '"finished" after finish() is called');
-  assert_equals(animation.startTime, animation.timeline.currentTime,
-                'The start time of a pause-pending animation should be ' +
-                'set after calling finish()');
-}, 'Test finish() while pause-pending with negative playbackRate');
-
-test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  animation.playbackRate = 0.5;
-  animation.finish();
-
-  assert_equals(animation.playState, 'finished',
-                'The play state of a play-pending animation should become ' +
-                '"finished" after finish() is called');
-  assert_times_equal(animation.startTime,
-                     animation.timeline.currentTime - 100 * MS_PER_SEC / 0.5,
-                     'The start time of a play-pending animation should ' +
-                     'be set after calling finish()');
-}, 'Test finish() while play-pending');
-
-// FIXME: Add a test for when we are play-pending without an active timeline.
-// - In that case even after calling finish() we should still be pending but
-//   the current time should be updated
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  return animation.ready.then(() => {
-    animation.pause();
-    animation.play();
-    // We are now in the unusual situation of being play-pending whilst having
-    // a resolved start time. Check that finish() still triggers a transition
-    // to the finished state immediately.
-    animation.finish();
-
-    assert_equals(animation.playState, 'finished',
-                  'After aborting a pause then calling finish() the play ' +
-                  'state of an animation should become "finished" immediately');
-  });
-}, 'Test finish() during aborted pause');
-
-promise_test(t => {
-  const div = createDiv(t);
-  div.style.marginLeft = '10px';
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  return animation.ready.then(() => {
-    animation.finish();
-    const marginLeft = parseFloat(getComputedStyle(div).marginLeft);
-
-    assert_equals(marginLeft, 10,
-                  'The computed style should be reset when finish() is ' +
-                  'called');
-  });
-}, 'Test resetting of computed style');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
-  let resolvedFinished = false;
-  animation.finished.then(() => {
-    resolvedFinished = true;
-  });
-
-  return animation.ready.then(() => {
-    animation.finish();
-  }).then(() => {
-    assert_true(resolvedFinished,
-      'Animation.finished should be resolved soon after ' +
-      'Animation.finish()');
-  });
-}, 'Test finish() resolves finished promise synchronously');
-
-promise_test(t => {
-  const effect = new KeyframeEffectReadOnly(null, gKeyFrames, 100 * MS_PER_SEC);
-  const animation = new Animation(effect, document.timeline);
-  let resolvedFinished = false;
-  animation.finished.then(() => {
-    resolvedFinished = true;
-  });
-
-  return animation.ready.then(() => {
-    animation.finish();
-  }).then(() => {
-    assert_true(resolvedFinished,
-                'Animation.finished should be resolved soon after ' +
-                'Animation.finish()');
-  });
-}, 'Test finish() resolves finished promise synchronously with an animation ' +
-   'without a target');
-
-promise_test(t => {
-  const effect = new KeyframeEffectReadOnly(null, gKeyFrames, 100 * MS_PER_SEC);
-  const animation = new Animation(effect, document.timeline);
-  animation.play();
-
-  let resolvedFinished = false;
-  animation.finished.then(() => {
-    resolvedFinished = true;
-  });
-
-  return animation.ready.then(() => {
-    animation.currentTime = animation.effect.getComputedTiming().endTime - 1;
-    return waitForAnimationFrames(2);
-  }).then(() => {
-    assert_true(resolvedFinished,
-                'Animation.finished should be resolved soon after ' +
-                'Animation finishes normally');
-  });
-}, 'Test normally finished animation resolves finished promise synchronously ' +
-   'with an animation without a target');
-
-</script>
-</body>
index 79700f3..563d4ba 100644 (file)
@@ -189,7 +189,7 @@ promise_test(t => {
   animation.currentTime = HALF_DUR;
   return animation.ready.then(() => {
     currentTimeBeforeShortening = animation.currentTime;
-    animation.effect.timing.duration = QUARTER_DUR;
+    animation.effect.updateTiming({ duration: QUARTER_DUR });
     // Below we use gotNextFrame to check that shortening of the animation
     // duration causes the finished promise to resolve, rather than it just
     // getting resolved on the next animation frame. This relies on the fact
@@ -206,7 +206,7 @@ promise_test(t => {
     assert_equals(animation.currentTime, currentTimeBeforeShortening,
                   'currentTime should be unchanged when duration shortened');
     const previousFinishedPromise = animation.finished;
-    animation.effect.timing.duration = 100 * MS_PER_SEC;
+    animation.effect.updateTiming({ duration: 100 * MS_PER_SEC });
     assert_not_equals(animation.finished, previousFinishedPromise,
                       'Finished promise should change after lengthening the ' +
                       'duration causes the animation to become active');
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness-expected.txt
deleted file mode 100644 (file)
index 12c06fd..0000000
+++ /dev/null
@@ -1,44 +0,0 @@
-
-PASS Animation interface: existence and properties of interface object 
-PASS Animation interface object length 
-PASS Animation interface object name 
-PASS Animation interface: existence and properties of interface prototype object 
-PASS Animation interface: existence and properties of interface prototype object's "constructor" property 
-PASS Animation interface: existence and properties of interface prototype object's @@unscopables property 
-PASS Animation interface: attribute id 
-PASS Animation interface: attribute effect 
-PASS Animation interface: attribute timeline 
-PASS Animation interface: attribute startTime 
-PASS Animation interface: attribute currentTime 
-PASS Animation interface: attribute playbackRate 
-PASS Animation interface: attribute playState 
-PASS Animation interface: attribute pending 
-PASS Animation interface: attribute ready 
-PASS Animation interface: attribute finished 
-PASS Animation interface: attribute onfinish 
-PASS Animation interface: attribute oncancel 
-PASS Animation interface: operation cancel() 
-PASS Animation interface: operation finish() 
-PASS Animation interface: operation play() 
-PASS Animation interface: operation pause() 
-PASS Animation interface: operation reverse() 
-PASS Animation must be primary interface of new Animation() 
-PASS Stringification of new Animation() 
-PASS Animation interface: new Animation() must inherit property "id" with the proper type 
-PASS Animation interface: new Animation() must inherit property "effect" with the proper type 
-PASS Animation interface: new Animation() must inherit property "timeline" with the proper type 
-PASS Animation interface: new Animation() must inherit property "startTime" with the proper type 
-PASS Animation interface: new Animation() must inherit property "currentTime" with the proper type 
-PASS Animation interface: new Animation() must inherit property "playbackRate" with the proper type 
-PASS Animation interface: new Animation() must inherit property "playState" with the proper type 
-PASS Animation interface: new Animation() must inherit property "pending" with the proper type 
-PASS Animation interface: new Animation() must inherit property "ready" with the proper type 
-PASS Animation interface: new Animation() must inherit property "finished" with the proper type 
-PASS Animation interface: new Animation() must inherit property "onfinish" with the proper type 
-PASS Animation interface: new Animation() must inherit property "oncancel" with the proper type 
-PASS Animation interface: new Animation() must inherit property "cancel()" with the proper type 
-PASS Animation interface: new Animation() must inherit property "finish()" with the proper type 
-PASS Animation interface: new Animation() must inherit property "play()" with the proper type 
-PASS Animation interface: new Animation() must inherit property "pause()" with the proper type 
-PASS Animation interface: new Animation() must inherit property "reverse()" with the proper type 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.html
deleted file mode 100644 (file)
index 3075146..0000000
+++ /dev/null
@@ -1,48 +0,0 @@
-<!doctype html>
-<meta charset=utf-8>
-<title>Animation IDL</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#animation">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/WebIDLParser.js"></script>
-<script src="/resources/idlharness.js"></script>
-<div id="log"></div>
-<script type="text/plain" id="Animation-IDL">
-enum AnimationPlayState { "idle", "pending", "running", "paused", "finished" };
-
-[Constructor (optional AnimationEffectReadOnly? effect = null,
-              optional AnimationTimeline? timeline)]
-interface Animation : EventTarget {
-             attribute DOMString                id;
-             attribute AnimationEffectReadOnly? effect;
-             attribute AnimationTimeline?       timeline;
-             attribute double?                  startTime;
-             attribute double?                  currentTime;
-             attribute double                   playbackRate;
-    readonly attribute AnimationPlayState       playState;
-    readonly attribute boolean                  pending;
-    readonly attribute Promise<Animation>       ready;
-    readonly attribute Promise<Animation>       finished;
-             attribute EventHandler             onfinish;
-             attribute EventHandler             oncancel;
-    void cancel ();
-    void finish ();
-    void play ();
-    void pause ();
-    void reverse ();
-};
-</script>
-<script>
-'use strict';
-
-const idlArray = new IdlArray();
-
-idlArray.add_untested_idls('interface AnimationTimeline {};');
-idlArray.add_untested_idls('interface EventHandler {};');
-idlArray.add_untested_idls('interface EventTarget {};');
-idlArray.add_idls(document.getElementById('Animation-IDL').textContent);
-idlArray.add_objects( { Animation: ['new Animation()'] } );
-
-idlArray.test();
-
-</script>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.window.js b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/idlharness.window.js
new file mode 100644 (file)
index 0000000..14b8395
--- /dev/null
@@ -0,0 +1,21 @@
+// META: script=/resources/WebIDLParser.js
+// META: script=/resources/idlharness.js
+
+// https://w3c.github.io/web-animations/#animation
+
+'use strict';
+
+promise_test(async () => {
+  const srcs = ['web-animations', 'dom', 'html'];
+  const [idl, dom, html] = await Promise.all(
+      srcs.map(i => fetch(`/interfaces/${i}.idl`).then(r => r.text())));
+
+  const idlArray = new IdlArray();
+  idlArray.add_idls(idl, {only: ['Animation', 'AnimationPlayState']});
+  idlArray.add_dependency_idls(idl);
+  idlArray.add_dependency_idls(dom);
+  idlArray.add_dependency_idls(html);
+  idlArray.add_untested_idls('interface CSSPseudoElement {};');
+  idlArray.add_objects( { Animation: ['new Animation()'] } );
+  idlArray.test();
+}, 'Animation interface.');
index 79d1d70..2df3cfb 100644 (file)
@@ -71,7 +71,7 @@ async_test(t => {
   animation.finish();
 }, 'onfinish event is fired when animation.finish() is called');
 
-promise_test(t => {
+promise_test(async t => {
   const div = createDiv(t);
   const animation = div.animate({}, 100 * MS_PER_SEC);
 
@@ -82,38 +82,36 @@ promise_test(t => {
   animation.currentTime = 100 * MS_PER_SEC / 2;
   animation.pause();
 
-  return animation.ready.then(() => {
-    animation.currentTime = 100 * MS_PER_SEC;
-    return waitForAnimationFrames(2);
-  });
+  await animation.ready;
+  animation.currentTime = 100 * MS_PER_SEC;
+  await waitForAnimationFrames(2);
 }, 'onfinish event is not fired when paused');
 
-promise_test(t => {
+promise_test(async t => {
   const div = createDiv(t);
   const animation = div.animate({}, 100 * MS_PER_SEC);
   animation.onfinish = event => {
     assert_unreached('onfinish event should not be fired');
   };
 
-  return animation.ready.then(() => {
-    animation.playbackRate = 0;
-    animation.currentTime = 100 * MS_PER_SEC;
-    return waitForAnimationFrames(2);
-  });
+  await animation.ready;
+  animation.playbackRate = 0;
+  animation.currentTime = 100 * MS_PER_SEC;
+  await waitForAnimationFrames(2);
 }, 'onfinish event is not fired when the playbackRate is zero');
 
-promise_test(t => {
+promise_test(async t => {
   const div = createDiv(t);
   const animation = div.animate({}, 100 * MS_PER_SEC);
+
   animation.onfinish = event => {
     assert_unreached('onfinish event should not be fired');
   };
 
-  return animation.ready.then(() => {
-    animation.currentTime = 100 * MS_PER_SEC;
-    animation.currentTime = 100 * MS_PER_SEC / 2;
-    return waitForAnimationFrames(2);
-  });
+  await animation.ready;
+  animation.currentTime = 100 * MS_PER_SEC;
+  animation.currentTime = 100 * MS_PER_SEC / 2;
+  await waitForAnimationFrames(2);
 }, 'onfinish event is not fired when the animation falls out ' +
    'finished state immediately');
 
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate-expected.txt
deleted file mode 100644 (file)
index 191a9cf..0000000
+++ /dev/null
@@ -1,5 +0,0 @@
-
-PASS Test the initial effect of setting playbackRate on currentTime 
-PASS Test the effect of setting playbackRate on currentTime 
-PASS Test the effect of setting playbackRate while playing animation 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/Animation/playbackRate.html
deleted file mode 100644 (file)
index be5bf96..0000000
+++ /dev/null
@@ -1,84 +0,0 @@
-<!DOCTYPE html>
-<meta charset=utf-8>
-<title>Animation.playbackRate</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animation-playbackrate">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../../testcommon.js"></script>
-<body>
-<div id="log"></div>
-<script>
-'use strict';
-
-function assert_playbackrate(animation,
-                             previousAnimationCurrentTime,
-                             previousTimelineCurrentTime,
-                             description) {
-  const animationCurrentTimeDifference =
-    animation.currentTime - previousAnimationCurrentTime;
-  const timelineCurrentTimeDifference =
-    animation.timeline.currentTime - previousTimelineCurrentTime;
-
-  assert_times_equal(animationCurrentTimeDifference,
-                     timelineCurrentTimeDifference * animation.playbackRate,
-                     description);
-}
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(null, 100 * MS_PER_SEC);
-  return animation.ready.then(() => {
-    animation.currentTime = 7 * MS_PER_SEC; // ms
-    animation.playbackRate = 0.5;
-
-    assert_equals(animation.currentTime, 7 * MS_PER_SEC,
-      'Reducing Animation.playbackRate should not change the currentTime ' +
-      'of a playing animation');
-    animation.playbackRate = 2;
-    assert_equals(animation.currentTime, 7 * MS_PER_SEC,
-      'Increasing Animation.playbackRate should not change the currentTime ' +
-      'of a playing animation');
-  });
-}, 'Test the initial effect of setting playbackRate on currentTime');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(null, 100 * MS_PER_SEC);
-  animation.playbackRate = 2;
-  let previousTimelineCurrentTime;
-  let previousAnimationCurrentTime;
-  return animation.ready.then(() => {
-    previousAnimationCurrentTime = animation.currentTime;
-    previousTimelineCurrentTime = animation.timeline.currentTime;
-    return waitForAnimationFrames(1);
-  }).then(() => {
-    assert_playbackrate(animation,
-      previousAnimationCurrentTime,
-      previousTimelineCurrentTime,
-      'animation.currentTime should be 2 times faster than timeline.');
-  });
-}, 'Test the effect of setting playbackRate on currentTime');
-
-promise_test(t => {
-  const div = createDiv(t);
-  const animation = div.animate(null, 100 * MS_PER_SEC);
-  animation.playbackRate = 2;
-  let previousTimelineCurrentTime;
-  let previousAnimationCurrentTime;
-  return animation.ready.then(() => {
-    previousAnimationCurrentTime = animation.currentTime;
-    previousTimelineCurrentTime = animation.timeline.currentTime;
-    animation.playbackRate = 1;
-    return waitForAnimationFrames(1);
-  }).then(() => {
-    assert_equals(animation.playbackRate, 1,
-      'sanity check: animation.playbackRate is still 1.');
-    assert_playbackrate(animation,
-      previousAnimationCurrentTime,
-      previousTimelineCurrentTime,
-      'animation.currentTime should be the same speed as timeline now.');
-  });
-}, 'Test the effect of setting playbackRate while playing animation');
-
-</script>
-</body>
index ff94b23..461c4e9 100644 (file)
@@ -1,4 +1,4 @@
-<!DOCTYPE html><!-- webkit-test-runner [ experimental:WebAnimationsCSSIntegrationEnabled=true ] -->
+<!DOCTYPE html>
 <meta charset=utf-8>
 <title>Animation.ready</title>
 <link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animation-ready">
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <meta charset=utf-8>
-<title>AnimationEffectTiming.getComputedTiming</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffectreadonly-getcomputedtiming">
+<title>AnimationEffect.getComputedTiming</title>
+<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffect-getcomputedtiming">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="../../testcommon.js"></script>
@@ -15,10 +15,13 @@ test(t => {
 
   const ct = effect.getComputedTiming();
   assert_equals(ct.delay, 0, 'computed delay');
+  assert_equals(ct.endDelay, 0, 'computed endDelay');
   assert_equals(ct.fill, 'none', 'computed fill');
+  assert_equals(ct.iterationStart, 0.0, 'computed iterationStart');
   assert_equals(ct.iterations, 1.0, 'computed iterations');
   assert_equals(ct.duration, 0, 'computed duration');
   assert_equals(ct.direction, 'normal', 'computed direction');
+  assert_equals(ct.easing, 'linear', 'computed easing');
 }, 'values of getComputedTiming() when a KeyframeEffect is ' +
    'constructed without any KeyframeEffectOptions object');
 
@@ -28,15 +31,21 @@ const gGetComputedTimingTests = [
     expected: { } },
   { desc:     'a normal KeyframeEffectOptions object',
     input:    { delay: 1000,
+                endDelay: 2000,
                 fill: 'auto',
+                iterationStart: 0.5,
                 iterations: 5.5,
                 duration: 'auto',
-                direction: 'alternate' },
+                direction: 'alternate',
+                easing: 'steps(2)' },
     expected: { delay: 1000,
+                endDelay: 2000,
                 fill: 'none',
+                iterationStart: 0.5,
                 iterations: 5.5,
                 duration: 0,
-                direction: 'alternate' } },
+                direction: 'alternate',
+                easing: 'steps(2)' } },
   { desc:     'a double value',
     input:    3000,
     timing:   { duration: 3000 },
@@ -78,14 +87,20 @@ for (const stest of gGetComputedTimingTests) {
     const ct = effect.getComputedTiming();
     assert_equals(ct.delay, expected('delay', 0),
                   'computed delay');
+    assert_equals(ct.endDelay, expected('endDelay', 0),
+                  'computed endDelay');
     assert_equals(ct.fill, expected('fill', 'none'),
                   'computed fill');
+    assert_equals(ct.iterationStart, expected('iterationStart', 0),
+                  'computed iterations');
     assert_equals(ct.iterations, expected('iterations', 1),
                   'computed iterations');
     assert_equals(ct.duration, expected('duration', 0),
                   'computed duration');
     assert_equals(ct.direction, expected('direction', 'normal'),
                   'computed direction');
+    assert_equals(ct.easing, expected('easing', 'linear'),
+                  'computed easing');
 
   }, 'values of getComputedTiming() when a KeyframeEffect is'
      + ` constructed by ${stest.desc}`);
@@ -195,7 +210,5 @@ for (const stest of gEndTimeTests) {
 
   }, `getComputedTiming().endTime for ${stest.desc}`);
 }
-
-done();
 </script>
 </body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming-expected.txt
new file mode 100644 (file)
index 0000000..f946400
--- /dev/null
@@ -0,0 +1,72 @@
+
+PASS Allows setting the delay to a positive number 
+PASS Allows setting the delay to a negative number 
+PASS Allows setting the delay of an animation in progress: positive delay that causes the animation to be no longer in-effect 
+PASS Allows setting the delay of an animation in progress: negative delay that seeks into the active interval 
+PASS Allows setting the delay of an animation in progress: large negative delay that causes the animation to be finished 
+PASS Throws when setting invalid delay value: NaN 
+PASS Throws when setting invalid delay value: Infinity 
+PASS Throws when setting invalid delay value: -Infinity 
+PASS Allows setting the endDelay to a positive number 
+PASS Allows setting the endDelay to a negative number 
+PASS Throws when setting the endDelay to infinity 
+PASS Throws when setting the endDelay to negative infinity 
+PASS Allows setting the fill to 'none' 
+PASS Allows setting the fill to 'forwards' 
+PASS Allows setting the fill to 'backwards' 
+PASS Allows setting the fill to 'both' 
+PASS Allows setting the iterationStart of an animation in progress: backwards-filling 
+PASS Allows setting the iterationStart of an animation in progress: active phase 
+PASS Allows setting the iterationStart of an animation in progress: forwards-filling 
+PASS Throws when setting invalid iterationStart value: -1 
+PASS Throws when setting invalid iterationStart value: NaN 
+PASS Throws when setting invalid iterationStart value: Infinity 
+PASS Throws when setting invalid iterationStart value: -Infinity 
+PASS Allows setting iterations to a double value 
+PASS Allows setting iterations to infinity 
+PASS Throws when setting invalid iterations value: -1 
+PASS Throws when setting invalid iterations value: -Infinity 
+PASS Throws when setting invalid iterations value: NaN 
+PASS Allows setting the iterations of an animation in progress 
+PASS Allows setting the duration to 123.45 
+PASS Allows setting the duration to auto 
+PASS Allows setting the duration to Infinity 
+PASS Throws when setting invalid duration: -1 
+PASS Throws when setting invalid duration: NaN 
+PASS Throws when setting invalid duration: -Infinity 
+PASS Throws when setting invalid duration: "abc" 
+PASS Throws when setting invalid duration: "100" 
+PASS Allows setting the duration of an animation in progress 
+PASS Allows setting the duration of an animation in progress such that the the start and current time do not change 
+PASS Allows setting the direction to each of the possible keywords 
+PASS Allows setting the direction of an animation in progress from 'normal' to 'reverse' 
+PASS Allows setting the direction of an animation in progress from 'normal' to 'reverse' while at start of active interval 
+PASS Allows setting the direction of an animation in progress from 'normal' to 'reverse' while filling backwards 
+PASS Allows setting the direction of an animation in progress from 'normal' to 'alternate' 
+PASS Allows setting the direction of an animation in progress from 'alternate' to 'alternate-reverse' 
+PASS Allows setting the easing to a step-start function 
+PASS Allows setting the easing to a steps(1, start) function 
+PASS Allows setting the easing to a steps(2, start) function 
+PASS Allows setting the easing to a step-end function 
+PASS Allows setting the easing to a steps(1) function 
+PASS Allows setting the easing to a steps(1, end) function 
+PASS Allows setting the easing to a steps(2, end) function 
+FAIL Allows setting the easing to a frames function Type error
+PASS Allows setting the easing to a linear function 
+PASS Allows setting the easing to a ease function 
+PASS Allows setting the easing to a ease-in function 
+PASS Allows setting the easing to a ease-in-out function 
+PASS Allows setting the easing to a ease-out function 
+PASS Allows setting the easing to a easing function which produces values greater than 1 
+PASS Allows setting the easing to a easing function which produces values less than 1 
+PASS Updates the specified value when setting the easing to 'ease' 
+PASS Updates the specified value when setting the easing to 'linear' 
+PASS Updates the specified value when setting the easing to 'ease-in' 
+PASS Updates the specified value when setting the easing to 'ease-out' 
+PASS Updates the specified value when setting the easing to 'ease-in-out' 
+PASS Updates the specified value when setting the easing to 'cubic-bezier(0.1, 5, 0.23, 0)' 
+PASS Updates the specified value when setting the easing to 'steps(3, start)' 
+PASS Updates the specified value when setting the easing to 'steps(3)' 
+FAIL Updates the specified value when setting the easing to 'frames(3)' Type error
+PASS Allows setting the easing of an animation in progress 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffect/updateTiming.html
new file mode 100644 (file)
index 0000000..746f0d7
--- /dev/null
@@ -0,0 +1,475 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>AnimationEffect.updateTiming</title>
+<link rel="help" href="https://drafts.csswg.org/web-animations-1/#dom-animationeffect-updatetiming">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../testcommon.js"></script>
+<script src="../../resources/easing-tests.js"></script>
+<script src="../../resources/timing-tests.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+// ------------------------------
+//  delay
+// ------------------------------
+
+test(t => {
+  const anim = createDiv(t).animate(null, 100);
+  anim.effect.updateTiming({ delay: 100 });
+  assert_equals(anim.effect.getTiming().delay, 100, 'set delay 100');
+  assert_equals(anim.effect.getComputedTiming().delay, 100,
+                  'getComputedTiming() after set delay 100');
+}, 'Allows setting the delay to a positive number');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 100);
+  anim.effect.updateTiming({ delay: -100 });
+  assert_equals(anim.effect.getTiming().delay, -100, 'set delay -100');
+  assert_equals(anim.effect.getComputedTiming().delay, -100,
+                'getComputedTiming() after set delay -100');
+}, 'Allows setting the delay to a negative number');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 100);
+  anim.effect.updateTiming({ delay: 100 });
+  assert_equals(anim.effect.getComputedTiming().progress, null);
+  assert_equals(anim.effect.getComputedTiming().currentIteration, null);
+}, 'Allows setting the delay of an animation in progress: positive delay that'
+   + ' causes the animation to be no longer in-effect');
+
+test(t => {
+  const anim = createDiv(t).animate(null, { fill: 'both', duration: 100 });
+  anim.effect.updateTiming({ delay: -50 });
+  assert_equals(anim.effect.getComputedTiming().progress, 0.5);
+}, 'Allows setting the delay of an animation in progress: negative delay that'
+   + ' seeks into the active interval');
+
+test(t => {
+  const anim = createDiv(t).animate(null, { fill: 'both', duration: 100 });
+  anim.effect.updateTiming({ delay: -100 });
+  assert_equals(anim.effect.getComputedTiming().progress, 1);
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 0);
+}, 'Allows setting the delay of an animation in progress: large negative delay'
+   + ' that causes the animation to be finished');
+
+for (const invalid of gBadDelayValues) {
+  test(t => {
+    const anim = createDiv(t).animate(null);
+    assert_throws({ name: 'TypeError' }, () => {
+      anim.effect.updateTiming({ delay: invalid });
+    });
+  }, `Throws when setting invalid delay value: ${invalid}`);
+}
+
+
+// ------------------------------
+//  endDelay
+// ------------------------------
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  anim.effect.updateTiming({ endDelay: 123.45 });
+  assert_time_equals_literal(anim.effect.getTiming().endDelay, 123.45,
+                             'set endDelay 123.45');
+  assert_time_equals_literal(anim.effect.getComputedTiming().endDelay, 123.45,
+                             'getComputedTiming() after set endDelay 123.45');
+}, 'Allows setting the endDelay to a positive number');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  anim.effect.updateTiming({ endDelay: -1000 });
+  assert_equals(anim.effect.getTiming().endDelay, -1000, 'set endDelay -1000');
+  assert_equals(anim.effect.getComputedTiming().endDelay, -1000,
+                'getComputedTiming() after set endDelay -1000');
+}, 'Allows setting the endDelay to a negative number');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  assert_throws({ name: 'TypeError' }, () => {
+    anim.effect.updateTiming({ endDelay: Infinity });
+  });
+}, 'Throws when setting the endDelay to infinity');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  assert_throws({ name: 'TypeError' }, () => {
+    anim.effect.updateTiming({ endDelay: -Infinity });
+  });
+}, 'Throws when setting the endDelay to negative infinity');
+
+
+// ------------------------------
+//  fill
+// ------------------------------
+
+for (const fill of ['none', 'forwards', 'backwards', 'both']) {
+  test(t => {
+    const anim = createDiv(t).animate(null, 100);
+    anim.effect.updateTiming({ fill });
+    assert_equals(anim.effect.getTiming().fill, fill, 'set fill ' + fill);
+    assert_equals(anim.effect.getComputedTiming().fill, fill,
+                  'getComputedTiming() after set fill ' + fill);
+  }, `Allows setting the fill to '${fill}'`);
+}
+
+
+// ------------------------------
+//  iterationStart
+// ------------------------------
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { iterationStart: 0.2,
+                                      iterations: 1,
+                                      fill: 'both',
+                                      duration: 100,
+                                      delay: 1 });
+  anim.effect.updateTiming({ iterationStart: 2.5 });
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.5);
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 2);
+}, 'Allows setting the iterationStart of an animation in progress:'
+   + ' backwards-filling');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { iterationStart: 0.2,
+                                      iterations: 1,
+                                      fill: 'both',
+                                      duration: 100,
+                                      delay: 0 });
+  anim.effect.updateTiming({ iterationStart: 2.5 });
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.5);
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 2);
+}, 'Allows setting the iterationStart of an animation in progress:'
+   + ' active phase');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { iterationStart: 0.2,
+                                      iterations: 1,
+                                      fill: 'both',
+                                      duration: 100,
+                                      delay: 0 });
+  anim.finish();
+  anim.effect.updateTiming({ iterationStart: 2.5 });
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.5);
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 3);
+}, 'Allows setting the iterationStart of an animation in progress:'
+   + ' forwards-filling');
+
+for (const invalid of gBadIterationStartValues) {
+  test(t => {
+    const anim = createDiv(t).animate(null);
+    assert_throws({ name: 'TypeError' }, () => {
+      anim.effect.updateTiming({ iterationStart: invalid });
+    }, `setting ${invalid}`);
+  }, `Throws when setting invalid iterationStart value: ${invalid}`);
+}
+
+// ------------------------------
+//  iterations
+// ------------------------------
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  anim.effect.updateTiming({ iterations: 2 });
+  assert_equals(anim.effect.getTiming().iterations, 2, 'set duration 2');
+  assert_equals(anim.effect.getComputedTiming().iterations, 2,
+                       'getComputedTiming() after set iterations 2');
+}, 'Allows setting iterations to a double value');
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+  anim.effect.updateTiming({ iterations: Infinity });
+  assert_equals(anim.effect.getTiming().iterations, Infinity,
+                'set duration Infinity');
+  assert_equals(anim.effect.getComputedTiming().iterations, Infinity,
+                       'getComputedTiming() after set iterations Infinity');
+}, 'Allows setting iterations to infinity');
+
+for (const invalid of gBadIterationsValues) {
+  test(t => {
+    const anim = createDiv(t).animate(null);
+    assert_throws({ name: 'TypeError' }, () => {
+      anim.effect.updateTiming({ iterations: invalid });
+    });
+  }, `Throws when setting invalid iterations value: ${invalid}`);
+}
+
+test(t => {
+  const anim = createDiv(t).animate(null, { duration: 100000, fill: 'both' });
+
+  anim.finish();
+
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress when animation is finished');
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
+                'current iteration when animation is finished');
+
+  anim.effect.updateTiming({ iterations: 2 });
+
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress,
+                             0,
+                             'progress after adding an iteration');
+  assert_time_equals_literal(anim.effect.getComputedTiming().currentIteration,
+                             1,
+                             'current iteration after adding an iteration');
+
+  anim.effect.updateTiming({ iterations: 0 });
+
+  assert_equals(anim.effect.getComputedTiming().progress, 0,
+                'progress after setting iterations to zero');
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
+                'current iteration after setting iterations to zero');
+
+  anim.effect.updateTiming({ iterations: Infinity });
+
+  assert_equals(anim.effect.getComputedTiming().progress, 0,
+                'progress after setting iterations to Infinity');
+  assert_equals(anim.effect.getComputedTiming().currentIteration, 1,
+                'current iteration after setting iterations to Infinity');
+}, 'Allows setting the iterations of an animation in progress');
+
+
+// ------------------------------
+//  duration
+// ------------------------------
+
+for (const duration of gGoodDurationValues) {
+  test(t => {
+    const anim = createDiv(t).animate(null, 2000);
+    anim.effect.updateTiming({ duration: duration.specified });
+    if (typeof duration.specified === 'number') {
+      assert_time_equals_literal(anim.effect.getTiming().duration,
+                                 duration.specified,
+                                 'Updates specified duration');
+    } else {
+      assert_equals(anim.effect.getTiming().duration, duration.specified,
+                    'Updates specified duration');
+    }
+    assert_time_equals_literal(anim.effect.getComputedTiming().duration,
+                               duration.computed,
+                               'Updates computed duration');
+  }, `Allows setting the duration to ${duration.specified}`);
+}
+
+for (const invalid of gBadDurationValues) {
+  test(t => {
+    assert_throws(new TypeError, () => {
+      createDiv(t).animate(null, { duration: invalid });
+    });
+  }, 'Throws when setting invalid duration: '
+     + (typeof invalid === 'string' ? `"${invalid}"` : invalid));
+}
+
+test(t => {
+  const anim = createDiv(t).animate(null, { duration: 100000, fill: 'both' });
+  anim.finish();
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress when animation is finished');
+  anim.effect.updateTiming({ duration: anim.effect.getTiming().duration * 2 });
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.5,
+                             'progress after doubling the duration');
+  anim.effect.updateTiming({ duration: 0 });
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress after setting duration to zero');
+  anim.effect.updateTiming({ duration: 'auto' });
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress after setting duration to \'auto\'');
+}, 'Allows setting the duration of an animation in progress');
+
+promise_test(t => {
+  const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
+  return anim.ready.then(() => {
+    const originalStartTime   = anim.startTime;
+    const originalCurrentTime = anim.currentTime;
+    assert_time_equals_literal(
+      anim.effect.getComputedTiming().duration,
+      100 * MS_PER_SEC,
+      'Initial duration should be as set on KeyframeEffect'
+    );
+
+    anim.effect.updateTiming({ duration: 200 * MS_PER_SEC });
+    assert_time_equals_literal(
+      anim.effect.getComputedTiming().duration,
+      200 * MS_PER_SEC,
+      'Effect duration should have been updated'
+    );
+    assert_times_equal(anim.startTime, originalStartTime,
+                       'startTime should be unaffected by changing effect ' +
+                       'duration');
+    assert_times_equal(anim.currentTime, originalCurrentTime,
+                       'currentTime should be unaffected by changing effect ' +
+                       'duration');
+  });
+}, 'Allows setting the duration of an animation in progress such that the' +
+   ' the start and current time do not change');
+
+
+// ------------------------------
+//  direction
+// ------------------------------
+
+test(t => {
+  const anim = createDiv(t).animate(null, 2000);
+
+  const directions = ['normal', 'reverse', 'alternate', 'alternate-reverse'];
+  for (const direction of directions) {
+    anim.effect.updateTiming({ direction: direction });
+    assert_equals(anim.effect.getTiming().direction, direction,
+                  `set direction to ${direction}`);
+  }
+}, 'Allows setting the direction to each of the possible keywords');
+
+test(t => {
+  const anim = createDiv(t).animate(null, {
+    duration: 10000,
+    direction: 'normal',
+  });
+  anim.currentTime = 7000;
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
+                             'progress before updating direction');
+
+  anim.effect.updateTiming({ direction: 'reverse' });
+
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
+                             'progress after updating direction');
+}, 'Allows setting the direction of an animation in progress from \'normal\' to'
+   + ' \'reverse\'');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { duration: 10000, direction: 'normal' });
+  assert_equals(anim.effect.getComputedTiming().progress, 0,
+                'progress before updating direction');
+
+  anim.effect.updateTiming({ direction: 'reverse' });
+
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress after updating direction');
+}, 'Allows setting the direction of an animation in progress from \'normal\' to'
+   + ' \'reverse\' while at start of active interval');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { fill: 'backwards',
+                                      duration: 10000,
+                                      delay: 10000,
+                                      direction: 'normal' });
+  assert_equals(anim.effect.getComputedTiming().progress, 0,
+                'progress before updating direction');
+
+  anim.effect.updateTiming({ direction: 'reverse' });
+
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'progress after updating direction');
+}, 'Allows setting the direction of an animation in progress from \'normal\' to'
+   + ' \'reverse\' while filling backwards');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { iterations: 2,
+                                      duration: 10000,
+                                      direction: 'normal' });
+  anim.currentTime = 17000;
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
+                             'progress before updating direction');
+
+  anim.effect.updateTiming({ direction: 'alternate' });
+
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
+                             'progress after updating direction');
+}, 'Allows setting the direction of an animation in progress from \'normal\' to'
+   + ' \'alternate\'');
+
+test(t => {
+  const anim = createDiv(t).animate(null,
+                                    { iterations: 2,
+                                      duration: 10000,
+                                      direction: 'alternate' });
+  anim.currentTime = 17000;
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
+                             'progress before updating direction');
+
+  anim.effect.updateTiming({ direction: 'alternate-reverse' });
+
+  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
+                             'progress after updating direction');
+}, 'Allows setting the direction of an animation in progress from \'alternate\''
+   + ' to \'alternate-reverse\'');
+
+
+// ------------------------------
+//  easing
+// ------------------------------
+
+function assert_progress(animation, currentTime, easingFunction) {
+  animation.currentTime = currentTime;
+  const portion = currentTime / animation.effect.getTiming().duration;
+  assert_approx_equals(animation.effect.getComputedTiming().progress,
+                       easingFunction(portion),
+                       0.01,
+                       'The progress of the animation should be approximately'
+                       + ` ${easingFunction(portion)} at ${currentTime}ms`);
+}
+
+for (const options of gEasingTests) {
+  test(t => {
+    const target = createDiv(t);
+    const anim = target.animate(null,
+                                { duration: 1000 * MS_PER_SEC,
+                                  fill: 'forwards' });
+    anim.effect.updateTiming({ easing: options.easing });
+    assert_equals(anim.effect.getTiming().easing,
+                  options.serialization || options.easing);
+
+    const easing = options.easingFunction;
+    assert_progress(anim, 0, easing);
+    assert_progress(anim, 250 * MS_PER_SEC, easing);
+    assert_progress(anim, 500 * MS_PER_SEC, easing);
+    assert_progress(anim, 750 * MS_PER_SEC, easing);
+    assert_progress(anim, 1000 * MS_PER_SEC, easing);
+  }, `Allows setting the easing to a ${options.desc}`);
+}
+
+for (const easing of gRoundtripEasings) {
+  test(t => {
+    const anim = createDiv(t).animate(null);
+    anim.effect.updateTiming({ easing: easing });
+    assert_equals(anim.effect.getTiming().easing, easing);
+  }, `Updates the specified value when setting the easing to '${easing}'`);
+}
+
+test(t => {
+  const delay = 1000 * MS_PER_SEC;
+
+  const target = createDiv(t);
+  const anim = target.animate(null,
+                              { duration: 1000 * MS_PER_SEC,
+                                fill: 'both',
+                                delay: delay,
+                                easing: 'steps(2, start)' });
+
+  anim.effect.updateTiming({ easing: 'steps(2, end)' });
+  assert_equals(anim.effect.getComputedTiming().progress, 0,
+                'easing replace to steps(2, end) at before phase');
+
+  anim.currentTime = delay + 750 * MS_PER_SEC;
+  assert_equals(anim.effect.getComputedTiming().progress, 0.5,
+                'change currentTime to active phase');
+
+  anim.effect.updateTiming({ easing: 'steps(2, start)' });
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'easing replace to steps(2, start) at active phase');
+
+  anim.currentTime = delay + 1500 * MS_PER_SEC;
+  anim.effect.updateTiming({ easing: 'steps(2, end)' });
+  assert_equals(anim.effect.getComputedTiming().progress, 1,
+                'easing replace to steps(2, end) again at after phase');
+}, 'Allows setting the easing of an animation in progress');
+
+</script>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay-expected.txt
deleted file mode 100644 (file)
index ea19f7f..0000000
+++ /dev/null
@@ -1,9 +0,0 @@
-
-PASS Has the default value 0 
-PASS Can be set to a positive number 
-PASS Can be set to a negative number 
-PASS Can set a positive delay on an animation without a backwards fill to make it no longer active 
-PASS Can set a negative delay to seek into the active interval 
-PASS Can set a large negative delay to finishing an animation 
-PASS Throws when setting invalid values 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/delay.html
deleted file mode 100644 (file)
index 41f099b..0000000
+++ /dev/null
@@ -1,78 +0,0 @@
-<!DOCTYPE html>
-<meta charset=utf-8>
-<title>AnimationEffectTiming.delay</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffecttiming-delay">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../../testcommon.js"></script>
-<body>
-<div id="log"></div>
-<script>
-'use strict';
-
-test(t => {
-  const anim = createDiv(t).animate(null);
-  assert_equals(anim.effect.timing.delay, 0);
-}, 'Has the default value 0');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 100);
-  anim.effect.timing.delay = 100;
-  assert_equals(anim.effect.timing.delay, 100, 'set delay 100');
-  assert_equals(anim.effect.getComputedTiming().delay, 100,
-                  'getComputedTiming() after set delay 100');
-}, 'Can be set to a positive number');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 100);
-  anim.effect.timing.delay = -100;
-  assert_equals(anim.effect.timing.delay, -100, 'set delay -100');
-  assert_equals(anim.effect.getComputedTiming().delay, -100,
-                'getComputedTiming() after set delay -100');
-}, 'Can be set to a negative number');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 100);
-  anim.effect.timing.delay = 100;
-  assert_equals(anim.effect.getComputedTiming().progress, null);
-  assert_equals(anim.effect.getComputedTiming().currentIteration, null);
-}, 'Can set a positive delay on an animation without a backwards fill to'
-   + ' make it no longer active');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { fill: 'both',
-                             duration: 100 });
-  anim.effect.timing.delay = -50;
-  assert_equals(anim.effect.getComputedTiming().progress, 0.5);
-}, 'Can set a negative delay to seek into the active interval');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { fill: 'both',
-                             duration: 100 });
-  anim.effect.timing.delay = -100;
-  assert_equals(anim.effect.getComputedTiming().progress, 1);
-  assert_equals(anim.effect.getComputedTiming().currentIteration, 0);
-}, 'Can set a large negative delay to finishing an animation');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate(null);
-  for (let invalid of [NaN, Infinity]) {
-    assert_throws({ name: 'TypeError' }, () => {
-      anim.effect.timing.delay = invalid;
-    }, `setting ${invalid}`);
-    assert_throws({ name: 'TypeError' }, () => {
-      div.animate({}, { delay: invalid });
-    }, `animate() with ${invalid}`);
-  }
-}, 'Throws when setting invalid values');
-
-</script>
-</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction-expected.txt
deleted file mode 100644 (file)
index f64500b..0000000
+++ /dev/null
@@ -1,9 +0,0 @@
-
-PASS Has the default value 'normal' 
-PASS Can be set to each of the possible keywords 
-PASS Can be changed from 'normal' to 'reverse' while in progress 
-PASS Can be changed from 'normal' to 'reverse' while at start of active interval 
-PASS Can be changed from 'normal' to 'reverse' while filling backwards 
-PASS Can be changed from 'normal' to 'alternate' while in progress 
-PASS Can be changed from 'alternate' to 'alternate-reverse' while in progress 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/direction.html
deleted file mode 100644 (file)
index 3238f5d..0000000
+++ /dev/null
@@ -1,108 +0,0 @@
-<!DOCTYPE html>
-<meta charset=utf-8>
-<title>AnimationEffectTiming.direction</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffecttiming-direction">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../../testcommon.js"></script>
-<body>
-<div id="log"></div>
-<script>
-'use strict';
-
-test(t => {
-  const anim = createDiv(t).animate(null);
-  assert_equals(anim.effect.timing.direction, 'normal');
-}, 'Has the default value \'normal\'');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-
-  const directions = ['normal', 'reverse', 'alternate', 'alternate-reverse'];
-  for (const direction of directions) {
-    anim.effect.timing.direction = direction;
-    assert_equals(anim.effect.timing.direction, direction,
-                  `set direction to ${direction}`);
-  }
-}, 'Can be set to each of the possible keywords');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate(null, { duration: 10000, direction: 'normal' });
-  anim.currentTime = 7000;
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
-                             'progress before updating direction');
-
-  anim.effect.timing.direction = 'reverse';
-
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
-                             'progress after updating direction');
-}, 'Can be changed from \'normal\' to \'reverse\' while in progress');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { duration: 10000,
-                             direction: 'normal' });
-  assert_equals(anim.effect.getComputedTiming().progress, 0,
-                'progress before updating direction');
-
-  anim.effect.timing.direction = 'reverse';
-
-  assert_equals(anim.effect.getComputedTiming().progress, 1,
-                'progress after updating direction');
-}, 'Can be changed from \'normal\' to \'reverse\' while at start of active'
-   + ' interval');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { fill: 'backwards',
-                             duration: 10000,
-                             delay: 10000,
-                             direction: 'normal' });
-  assert_equals(anim.effect.getComputedTiming().progress, 0,
-                'progress before updating direction');
-
-  anim.effect.timing.direction = 'reverse';
-
-  assert_equals(anim.effect.getComputedTiming().progress, 1,
-                'progress after updating direction');
-}, 'Can be changed from \'normal\' to \'reverse\' while filling backwards');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { iterations: 2,
-                             duration: 10000,
-                             direction: 'normal' });
-  anim.currentTime = 17000;
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
-                             'progress before updating direction');
-
-  anim.effect.timing.direction = 'alternate';
-
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
-                             'progress after updating direction');
-}, 'Can be changed from \'normal\' to \'alternate\' while in progress');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] },
-                           { iterations: 2,
-                             duration: 10000,
-                             direction: 'alternate' });
-  anim.currentTime = 17000;
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.3,
-                             'progress before updating direction');
-
-  anim.effect.timing.direction = 'alternate-reverse';
-
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.7,
-                             'progress after updating direction');
-}, 'Can be changed from \'alternate\' to \'alternate-reverse\' while in'
-   + ' progress');
-
-</script>
-</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration-expected.txt
deleted file mode 100644 (file)
index 16c5334..0000000
+++ /dev/null
@@ -1,22 +0,0 @@
-
-PASS Has the default value 'auto' 
-PASS Can be set to a double value 
-PASS Can be set to the string 'auto' 
-PASS Can be set to 'auto' using a dictionary object 
-PASS Can be set to Infinity 
-PASS animate() throws when passed a negative number 
-PASS animate() throws when passed negative Infinity 
-PASS animate() throws when passed a NaN value 
-PASS animate() throws when passed a negative number using a dictionary object 
-PASS animate() throws when passed negative Infinity using a dictionary object 
-PASS animate() throws when passed a NaN value using a dictionary object 
-PASS animate() throws when passed a string other than 'auto' using a dictionary object 
-PASS animate() throws when passed a string containing a number using a dictionary object 
-PASS Throws when setting a negative number 
-PASS Throws when setting negative infinity 
-PASS Throws when setting a NaN value 
-PASS Throws when setting a string other than 'auto' 
-PASS Throws when setting a string containing a number 
-PASS Extending an effect's duration does not change the start or current time 
-PASS Can be updated while the animation is in progress 
-
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration.html b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/duration.html
deleted file mode 100644 (file)
index 42913f5..0000000
+++ /dev/null
@@ -1,190 +0,0 @@
-<!DOCTYPE html>
-<meta charset=utf-8>
-<title>AnimationEffectTiming.duration</title>
-<link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffecttiming-duration">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../../testcommon.js"></script>
-<body>
-<div id="log"></div>
-<script>
-'use strict';
-
-test(t => {
-  const anim = createDiv(t).animate(null);
-  assert_equals(anim.effect.timing.duration, 'auto');
-}, 'Has the default value \'auto\'');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  anim.effect.timing.duration = 123.45;
-  assert_time_equals_literal(anim.effect.timing.duration, 123.45,
-                             'set duration 123.45');
-  assert_time_equals_literal(anim.effect.getComputedTiming().duration, 123.45,
-                             'getComputedTiming() after set duration 123.45');
-}, 'Can be set to a double value');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  anim.effect.timing.duration = 'auto';
-  assert_equals(anim.effect.timing.duration, 'auto', 'set duration \'auto\'');
-  assert_equals(anim.effect.getComputedTiming().duration, 0,
-                'getComputedTiming() after set duration \'auto\'');
-}, 'Can be set to the string \'auto\'');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, { duration: 'auto' });
-  assert_equals(anim.effect.timing.duration, 'auto', 'set duration \'auto\'');
-  assert_equals(anim.effect.getComputedTiming().duration, 0,
-                'getComputedTiming() after set duration \'auto\'');
-}, 'Can be set to \'auto\' using a dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  anim.effect.timing.duration = Infinity;
-  assert_equals(anim.effect.timing.duration, Infinity, 'set duration Infinity');
-  assert_equals(anim.effect.getComputedTiming().duration, Infinity,
-                'getComputedTiming() after set duration Infinity');
-}, 'Can be set to Infinity');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, -1);
-  });
-}, 'animate() throws when passed a negative number');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, -Infinity);
-  });
-}, 'animate() throws when passed negative Infinity');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, NaN);
-  });
-}, 'animate() throws when passed a NaN value');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, { duration: -1 });
-  });
-}, 'animate() throws when passed a negative number using a dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, { duration: -Infinity });
-  });
-}, 'animate() throws when passed negative Infinity using a dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, { duration: NaN });
-  });
-}, 'animate() throws when passed a NaN value using a dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, { duration: 'abc' });
-  });
-}, 'animate() throws when passed a string other than \'auto\' using a'
-   + ' dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  assert_throws({ name: 'TypeError' }, () => {
-    div.animate({ opacity: [ 0, 1 ] }, { duration: '100' });
-  });
-}, 'animate() throws when passed a string containing a number using a'
-   + ' dictionary object');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_throws({ name: 'TypeError' }, () => {
-    anim.effect.timing.duration = -1;
-  });
-}, 'Throws when setting a negative number');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_throws({ name: 'TypeError' }, () => {
-    anim.effect.timing.duration = -Infinity;
-  });
-}, 'Throws when setting negative infinity');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_throws({ name: 'TypeError' }, () => {
-    anim.effect.timing.duration = NaN;
-  });
-}, 'Throws when setting a NaN value');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_throws({ name: 'TypeError' }, () => {
-    anim.effect.timing.duration = 'abc';
-  });
-}, 'Throws when setting a string other than \'auto\'');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
-  assert_throws({ name: 'TypeError' }, () => {
-    anim.effect.timing.duration = '100';
-  });
-}, 'Throws when setting a string containing a number');
-
-promise_test(t => {
-  const anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
-  return anim.ready.then(() => {
-    const originalStartTime   = anim.startTime;
-    const originalCurrentTime = anim.currentTime;
-    assert_equals(anim.effect.getComputedTiming().duration, 100 * MS_PER_SEC,
-                  'Initial duration should be as set on KeyframeEffect');
-
-    anim.effect.timing.duration = 200 * MS_PER_SEC;
-    assert_equals(anim.effect.getComputedTiming().duration, 200 * MS_PER_SEC,
-                  'Effect duration should have been updated');
-    assert_times_equal(anim.startTime, originalStartTime,
-                       'startTime should be unaffected by changing effect ' +
-                       'duration');
-    assert_times_equal(anim.currentTime, originalCurrentTime,
-                       'currentTime should be unaffected by changing effect ' +
-                       'duration');
-  });
-}, 'Extending an effect\'s duration does not change the start or current time');
-
-test(t => {
-  const div = createDiv(t);
-  const anim = div.animate(null, { duration: 100000, fill: 'both' });
-  anim.finish();
-  assert_equals(anim.effect.getComputedTiming().progress, 1,
-                'progress when animation is finished');
-  anim.effect.timing.duration *= 2;
-  assert_time_equals_literal(anim.effect.getComputedTiming().progress, 0.5,
-                             'progress after doubling the duration');
-  anim.effect.timing.duration = 0;
-  assert_equals(anim.effect.getComputedTiming().progress, 1,
-                'progress after setting duration to zero');
-  anim.effect.timing.duration = 'auto';
-  assert_equals(anim.effect.getComputedTiming().progress, 1,
-                'progress after setting duration to \'auto\'');
-}, 'Can be updated while the animation is in progress');
-
-</script>
-</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/web-animations/interfaces/AnimationEffectTiming/easing-expected.txt
deleted file mode 100644 (file)
index 5232730..0000000
+++ /dev/null
@@ -1,57 +0,0 @@
-
-PASS Has the default value 'linear' 
-PASS step-start function 
-PASS steps(1, start) function 
-PASS steps(2, start) function 
-PASS step-end function 
-PASS steps(1) function 
-PASS steps(1, end) function 
-PASS steps(2, end) function 
-FAIL frames function Type error
-PASS linear function 
-PASS ease function 
-PASS ease-in function 
-PASS ease-in-out function 
-PASS ease-out function 
-PASS easing function which produces values greater than 1 
-PASS easing function which produces values less than 1 
-PASS Throws on invalid easing: '' 
-PASS Throws on invalid easing: '7' 
-PASS Throws on invalid easing: 'test' 
-PASS Throws on invalid easing: 'initial' 
-PASS Throws on invalid easing: 'inherit' 
-PASS Throws on invalid easing: 'unset' 
-PASS Throws on invalid easing: 'unrecognized' 
-PASS Throws on invalid easing: 'var(--x)' 
-PASS Throws on inval