--- a/testing/web-platform/tests/web-animations/keyframe-effect/effect-easing.html
+++ b/testing/web-platform/tests/web-animations/keyframe-effect/effect-easing.html
@@ -430,17 +430,17 @@ test(function(t) {
});
assert_style_left_at(anim, 1000, function(x) {
return easing(easing(x))
});
}, 'effect easing which produces negative values and the tangent on ' +
'the lower boundary is infinity with keyframe easing producing ' +
'negative values');
-var gStepStartEasingTests = [
+var gStepTimingFunctionTests = [
{
description: 'Test bounds point of step-start easing',
keyframe: [ { width: '0px' },
{ width: '100px' } ],
effect: {
delay: 1000,
duration: 1000,
fill: 'both',
@@ -643,19 +643,66 @@ var gStepStartEasingTests = [
{ currentTime: 999, progress: 0, width: '0px' },
{ currentTime: 1000, progress: 0, width: '50px' },
{ currentTime: 1499, progress: 0.499, width: '50px' },
{ currentTime: 1500, progress: 0.5, width: '100px' },
{ currentTime: 2000, progress: 1, width: '100px' },
{ currentTime: 2500, progress: 1, width: '100px' }
]
},
+ {
+ description: 'Test bounds point of step-end easing ' +
+ 'with iterationStart and delay',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ duration: 1000,
+ fill: 'both',
+ delay: 1000,
+ iterationStart: 0.5,
+ easing: 'steps(2, end)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0 },
+ { currentTime: 999, progress: 0 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1499, progress: 0.5 },
+ { currentTime: 1500, progress: 0 },
+ { currentTime: 1999, progress: 0 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-end easing ' +
+ 'with iterationStart not at a transition point',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ iterationStart: 0.75,
+ easing: 'steps(2, end)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0.5 },
+ { currentTime: 999, progress: 0.5 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1249, progress: 0.5 },
+ { currentTime: 1250, progress: 0 },
+ { currentTime: 1749, progress: 0 },
+ { currentTime: 1750, progress: 0.5 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 },
+ ]
+ }
]
-gStepStartEasingTests.forEach(function(options) {
+gStepTimingFunctionTests.forEach(function(options) {
test(function(t) {
var target = createDiv(t);
var animation = target.animate(options.keyframe, options.effect);
options.conditions.forEach(function(condition) {
animation.currentTime = condition.currentTime;
if (typeof condition.progress !== 'undefined') {
assert_equals(animation.effect.getComputedTiming().progress,
condition.progress,