зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1415448 - Use arrow functions in web-platform-tests/web-animations; r=hiro
MozReview-Commit-ID: HE0vIxhhh3j --HG-- extra : rebase_source : c53e6a7849ff96430c20ad2fb38bbd3c329a6734
This commit is contained in:
Родитель
3062e80d46
Коммит
2462c3ad6e
|
@ -51,24 +51,24 @@ Guidelines for writing tests
|
|||
e.g.
|
||||
|
||||
```javascript
|
||||
test(function(t) {
|
||||
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(function(t) {
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
test(t => {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
createDiv(t).animate(null, -1);
|
||||
});
|
||||
}, 'Setting a negative duration throws a TypeError');
|
||||
```
|
||||
|
||||
```javascript
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_greater_than(animation.startTime, 0, 'startTime when running');
|
||||
});
|
||||
}, 'startTime is resolved when running');
|
||||
|
|
|
@ -24,7 +24,7 @@ for (var property in gCSSProperties) {
|
|||
|
||||
var animationTypes = gCSSProperties[property].types;
|
||||
var setupFunction = gCSSProperties[property].setup;
|
||||
animationTypes.forEach(function(animationType) {
|
||||
animationTypes.forEach(animationType => {
|
||||
var typeObject;
|
||||
var animationTypeString;
|
||||
if (typeof animationType === 'string') {
|
||||
|
@ -39,7 +39,7 @@ for (var property in gCSSProperties) {
|
|||
// 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(function(t) {
|
||||
test(t => {
|
||||
assert_own_property(typeObject, 'testAccumulation', animationTypeString +
|
||||
' should have testAccumulation property');
|
||||
assert_equals(typeof typeObject.testAccumulation, 'function',
|
||||
|
|
|
@ -24,7 +24,7 @@ for (var property in gCSSProperties) {
|
|||
|
||||
var animationTypes = gCSSProperties[property].types;
|
||||
var setupFunction = gCSSProperties[property].setup;
|
||||
animationTypes.forEach(function(animationType) {
|
||||
animationTypes.forEach(animationType => {
|
||||
var typeObject;
|
||||
var animationTypeString;
|
||||
if (typeof animationType === 'string') {
|
||||
|
@ -39,7 +39,7 @@ for (var property in gCSSProperties) {
|
|||
// 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(function(t) {
|
||||
test(t => {
|
||||
assert_own_property(typeObject, 'testAddition', animationTypeString +
|
||||
' should have testAddition property');
|
||||
assert_equals(typeof typeObject.testAddition, 'function',
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
|
||||
var anim = div.animate({ fontStyle: [ 'normal', 'italic' ] },
|
||||
|
@ -31,7 +31,7 @@ test(function(t) {
|
|||
'Animation produces \'to\' value during forwards fill');
|
||||
}, 'Test animating discrete values');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var originalHeight = getComputedStyle(div).height;
|
||||
|
||||
|
@ -53,7 +53,7 @@ test(function(t) {
|
|||
'Animation produces \'to\' value during forwards fill');
|
||||
}, 'Test discrete animation is used when interpolation fails');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var originalHeight = getComputedStyle(div).height;
|
||||
|
||||
|
@ -83,7 +83,7 @@ test(function(t) {
|
|||
}, 'Test discrete animation is used only for pairs of values that cannot'
|
||||
+ ' be interpolated');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var originalHeight = getComputedStyle(div).height;
|
||||
|
||||
|
@ -107,7 +107,7 @@ test(function(t) {
|
|||
}, 'Test the 50% switch point for discrete animation is based on the'
|
||||
+ ' effect easing');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var originalHeight = getComputedStyle(div).height;
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@ for (var property in gCSSProperties) {
|
|||
|
||||
var animationTypes = gCSSProperties[property].types;
|
||||
var setupFunction = gCSSProperties[property].setup;
|
||||
animationTypes.forEach(function(animationType) {
|
||||
animationTypes.forEach(animationType => {
|
||||
var typeObject;
|
||||
var animationTypeString;
|
||||
if (typeof animationType === 'string') {
|
||||
|
@ -39,7 +39,7 @@ for (var property in gCSSProperties) {
|
|||
// 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(function(t) {
|
||||
test(t => {
|
||||
assert_own_property(typeObject, 'testInterpolation', animationTypeString +
|
||||
' should have testInterpolation property');
|
||||
assert_equals(typeof typeObject.testInterpolation, 'function',
|
||||
|
|
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
|
@ -13,7 +13,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ visibility: ['hidden','visible'] },
|
||||
{ duration: 100 * MS_PER_SEC, fill: 'both' });
|
||||
|
@ -32,7 +32,7 @@ test(function(t) {
|
|||
|
||||
}, 'Visibility clamping behavior');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ visibility: ['hidden', 'visible'] },
|
||||
{ duration: 100 * MS_PER_SEC, fill: 'both',
|
||||
|
|
|
@ -9,8 +9,8 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
[ 'accumulate', 'add' ].forEach(function(composite) {
|
||||
test(function(t) {
|
||||
[ 'accumulate', 'add' ].forEach(composite => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var anim =
|
||||
|
@ -21,7 +21,7 @@
|
|||
'Animated margin-left style at 50%');
|
||||
}, composite + ' onto the base value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anims = [];
|
||||
anims.push(div.animate({ marginLeft: ['10px', '20px'],
|
||||
|
@ -31,7 +31,7 @@
|
|||
composite },
|
||||
100));
|
||||
|
||||
anims.forEach(function(anim) {
|
||||
anims.forEach(anim => {
|
||||
anim.currentTime = 50;
|
||||
});
|
||||
|
||||
|
@ -39,7 +39,7 @@
|
|||
'Animated style at 50%');
|
||||
}, composite + ' onto an underlying animation value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var anim =
|
||||
|
@ -52,7 +52,7 @@
|
|||
'Animated style at 50%');
|
||||
}, 'Composite when mixing ' + composite + ' and replace');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var anim =
|
||||
|
@ -66,7 +66,7 @@
|
|||
}, composite + ' specified on a keyframe overrides the composite mode of ' +
|
||||
'the effect');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var anim =
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<div id="log"></div>
|
||||
<script>
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.fontSize = '10px';
|
||||
var animation = div.animate([ { marginLeft: '10em' },
|
||||
|
@ -22,7 +22,7 @@ test(function(t) {
|
|||
'Effect value after updating font-size');
|
||||
}, 'Effect values reflect changes to font-size on element');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var parentDiv = createDiv(t);
|
||||
var div = createDiv(t);
|
||||
parentDiv.appendChild(div);
|
||||
|
@ -38,7 +38,7 @@ test(function(t) {
|
|||
'Effect value after updating font-size on parent element');
|
||||
}, 'Effect values reflect changes to font-size on parent element');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var parentDiv = createDiv(t);
|
||||
var div = createDiv(t);
|
||||
parentDiv.appendChild(div);
|
||||
|
@ -50,14 +50,14 @@ promise_test(function(t) {
|
|||
animation.currentTime = 500;
|
||||
parentDiv.style.fontSize = '20px';
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(getComputedStyle(div).marginLeft, '300px',
|
||||
'Effect value after updating font-size on parent element');
|
||||
});
|
||||
}, 'Effect values reflect changes to font-size when computed style is not'
|
||||
+ ' immediately flushed');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var divWith10pxFontSize = createDiv(t);
|
||||
divWith10pxFontSize.style.fontSize = '10px';
|
||||
var divWith20pxFontSize = createDiv(t);
|
||||
|
@ -69,7 +69,7 @@ promise_test(function(t) {
|
|||
{ marginLeft: '20em' } ], 1000);
|
||||
animation.pause();
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 500;
|
||||
|
||||
divWith10pxFontSize.appendChild(div);
|
||||
|
@ -81,7 +81,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Effect values reflect changes to font-size from reparenting');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var divA = createDiv(t);
|
||||
divA.style.fontSize = '10px';
|
||||
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate([ { offset: 0, opacity: 0 },
|
||||
{ offset: 0, opacity: 0.1 },
|
||||
|
@ -47,7 +47,7 @@ test(function(t) {
|
|||
}, 'Overlapping keyframes at 0 and 1 use the appropriate value when the'
|
||||
+ ' progress is outside the range [0, 1]');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate([ { offset: 0, opacity: 0 },
|
||||
{ offset: 0.5, opacity: 0.3 },
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
// Test that applying easing to keyframes is applied as expected
|
||||
|
||||
gEasingTests.forEach(params => {
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const target = createDiv(t);
|
||||
const anim = target.animate([ { width: '0px' },
|
||||
// We put the easing on the second keyframe
|
||||
|
@ -47,7 +47,7 @@ gEasingTests.forEach(params => {
|
|||
gEasingTests.forEach(params => {
|
||||
const linearEquivalentEasings = [ 'cubic-bezier(0, 0, 0, 0)',
|
||||
'cubic-bezier(1, 1, 1, 1)' ];
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
linearEquivalentEasings.forEach(linearEquivalentEasing => {
|
||||
const timing = { duration: 1000,
|
||||
fill: 'forwards',
|
||||
|
|
|
@ -16,13 +16,13 @@
|
|||
|
||||
// Tests on Element
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null);
|
||||
assert_class_string(anim, 'Animation', 'Returned object is an Animation');
|
||||
}, 'Element.animate() creates an Animation object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var iframe = window.frames[0];
|
||||
var div = createDiv(t, iframe.document);
|
||||
var anim = Element.prototype.animate.call(div, null);
|
||||
|
@ -35,14 +35,14 @@ test(function(t) {
|
|||
}, 'Element.animate() creates an Animation object in the relevant realm of'
|
||||
+ ' the target element');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = Element.prototype.animate.call(div, null);
|
||||
assert_class_string(anim.effect, 'KeyframeEffect',
|
||||
'Returned Animation has a KeyframeEffect');
|
||||
}, 'Element.animate() creates an Animation object with a KeyframeEffect');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var iframe = window.frames[0];
|
||||
var div = createDiv(t, iframe.document);
|
||||
var anim = Element.prototype.animate.call(div, null);
|
||||
|
@ -57,7 +57,7 @@ test(function(t) {
|
|||
}, 'Element.animate() creates an Animation object with a KeyframeEffect'
|
||||
+ ' that is created in the relevant realm of the target element');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var iframe = window.frames[0];
|
||||
var div = createDiv(t, iframe.document);
|
||||
var anim = div.animate(null);
|
||||
|
@ -73,8 +73,8 @@ test(function(t) {
|
|||
+ ' whose AnimationEffectTiming object is created in the relevant realm'
|
||||
+ ' of the target element');
|
||||
|
||||
gEmptyKeyframeListTests.forEach(function(subTest) {
|
||||
test(function(t) {
|
||||
gEmptyKeyframeListTests.forEach(subTest => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(subTest, 2000);
|
||||
assert_not_equals(anim, null);
|
||||
|
@ -82,25 +82,25 @@ gEmptyKeyframeListTests.forEach(function(subTest) {
|
|||
`(input: ${JSON.stringify(subTest)})`);
|
||||
});
|
||||
|
||||
gKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(subtest.input, 2000);
|
||||
assert_frame_lists_equal(anim.effect.getKeyframes(), subtest.output);
|
||||
}, 'Element.animate() accepts ' + subtest.desc);
|
||||
});
|
||||
|
||||
gInvalidKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gInvalidKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws(new TypeError, function() {
|
||||
assert_throws(new TypeError, () => {
|
||||
div.animate(subtest.input, 2000);
|
||||
});
|
||||
}, 'Element.animate() does not accept ' + subtest.desc);
|
||||
});
|
||||
|
||||
gInvalidEasings.forEach(invalidEasing => {
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws(new TypeError, () => {
|
||||
div.animate({ easing: invalidEasing }, 2000);
|
||||
|
@ -108,7 +108,7 @@ gInvalidEasings.forEach(invalidEasing => {
|
|||
}, `Element.animate() does not accept invalid easing: '${invalidEasing}'`);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_equals(anim.effect.timing.duration, 2000);
|
||||
|
@ -116,7 +116,7 @@ test(function(t) {
|
|||
assert_equals(anim.effect.timing.fill, 'auto');
|
||||
}, 'Element.animate() accepts a double as an options argument');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ duration: Infinity, fill: 'forwards' });
|
||||
|
@ -126,36 +126,36 @@ test(function(t) {
|
|||
assert_equals(anim.effect.timing.direction, 'normal');
|
||||
}, 'Element.animate() accepts a KeyframeAnimationOptions argument');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] });
|
||||
assert_equals(anim.effect.timing.duration, 'auto');
|
||||
}, 'Element.animate() accepts an absent options argument');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_equals(anim.id, '');
|
||||
}, 'Element.animate() correctly sets the id attribute when no id is specified');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, { id: 'test' });
|
||||
assert_equals(anim.id, 'test');
|
||||
}, 'Element.animate() correctly sets the id attribute');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_equals(anim.timeline, document.timeline);
|
||||
}, 'Element.animate() correctly sets the Animation\'s timeline');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var iframe = document.createElement('iframe');
|
||||
iframe.width = 10;
|
||||
iframe.height = 10;
|
||||
|
||||
iframe.addEventListener('load', t.step_func(function() {
|
||||
iframe.addEventListener('load', t.step_func(() => {
|
||||
var div = createDiv(t, iframe.contentDocument);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_equals(anim.timeline, iframe.contentDocument.timeline);
|
||||
|
@ -167,7 +167,7 @@ async_test(function(t) {
|
|||
}, 'Element.animate() correctly sets the Animation\'s timeline when ' +
|
||||
'triggered on an element in a different document');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
@ -175,13 +175,13 @@ test(function(t) {
|
|||
|
||||
// Tests on CSSPseudoElement
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var pseudoTarget = createPseudo(t, 'before');
|
||||
var anim = pseudoTarget.animate(null);
|
||||
assert_class_string(anim, 'Animation', 'The returned object is an Animation');
|
||||
}, 'CSSPseudoElement.animate() creates an Animation object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var pseudoTarget = createPseudo(t, 'before');
|
||||
var anim = pseudoTarget.animate(null);
|
||||
assert_equals(anim.effect.target, pseudoTarget,
|
||||
|
|
|
@ -9,19 +9,19 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_array_equals(div.getAnimations(), []);
|
||||
}, 'Returns an empty array for an element with no animations');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animationA = div.animate(null, 100 * MS_PER_SEC);
|
||||
var animationB = div.animate(null, 100 * MS_PER_SEC);
|
||||
assert_array_equals(div.getAnimations(), [animationA, animationB]);
|
||||
}, 'Returns both animations for an element with two animations');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var divA = createDiv(t);
|
||||
var divB = createDiv(t);
|
||||
var animationA = divA.animate(null, 100 * MS_PER_SEC);
|
||||
|
@ -30,7 +30,7 @@ test(function(t) {
|
|||
assert_array_equals(divB.getAnimations(), [animationB], 'divB');
|
||||
}, 'Returns only the animations specific to each sibling element');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var divParent = createDiv(t);
|
||||
var divChild = createDiv(t);
|
||||
divParent.appendChild(divChild);
|
||||
|
@ -41,14 +41,14 @@ test(function(t) {
|
|||
assert_array_equals(divChild.getAnimations(), [animationChild], 'divChild');
|
||||
}, 'Returns only the animations specific to each parent/child element');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
animation.finish();
|
||||
assert_array_equals(div.getAnimations(), []);
|
||||
}, 'Does not return finished animations that do not fill forwards');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, {
|
||||
duration: 100 * MS_PER_SEC,
|
||||
|
@ -58,7 +58,7 @@ test(function(t) {
|
|||
assert_array_equals(div.getAnimations(), [animation]);
|
||||
}, 'Returns finished animations that fill forwards');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, {
|
||||
duration: 100 * MS_PER_SEC,
|
||||
|
@ -67,7 +67,7 @@ test(function(t) {
|
|||
assert_array_equals(div.getAnimations(), [animation]);
|
||||
}, 'Returns animations in their delay phase');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
|
@ -87,7 +87,7 @@ test(function(t) {
|
|||
}, 'Returns animations based on dynamic changes to individual'
|
||||
+ ' animations\' duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
|
@ -105,7 +105,7 @@ test(function(t) {
|
|||
}, 'Returns animations based on dynamic changes to individual'
|
||||
+ ' animations\' end delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
|
@ -130,7 +130,7 @@ test(function(t) {
|
|||
}, 'Returns animations based on dynamic changes to individual'
|
||||
+ ' animations\' iteration count');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null,
|
||||
{ duration: 100 * MS_PER_SEC,
|
||||
|
|
|
@ -10,11 +10,11 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({transform: ['translate(100px)', 'translate(100px)']},
|
||||
100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_not_equals(getComputedStyle(div).transform, 'none',
|
||||
'transform style is animated before cancelling');
|
||||
animation.cancel();
|
||||
|
@ -23,7 +23,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Animated style is cleared after calling Animation.cancel()');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({marginLeft: ['100px', '200px']},
|
||||
100 * MS_PER_SEC);
|
||||
|
@ -38,11 +38,11 @@ test(function(t) {
|
|||
+ ' seeked');
|
||||
}, 'After cancelling an animation, it can still be seeked');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({marginLeft:['100px', '200px']},
|
||||
100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.cancel();
|
||||
assert_equals(getComputedStyle(div).marginLeft, '0px',
|
||||
'margin-left style is not animated after cancelling');
|
||||
|
@ -50,7 +50,7 @@ promise_test(function(t) {
|
|||
assert_equals(getComputedStyle(div).marginLeft, '100px',
|
||||
'margin-left style is animated after re-starting animation');
|
||||
return animation.ready;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(animation.playState, 'running',
|
||||
'Animation succeeds in running after being re-started');
|
||||
});
|
||||
|
|
|
@ -64,8 +64,8 @@ var gTestArguments = [
|
|||
},
|
||||
];
|
||||
|
||||
gTestArguments.forEach(function(args) {
|
||||
test(function(t) {
|
||||
gTestArguments.forEach(args => {
|
||||
test(t => {
|
||||
var effect = args.createEffect();
|
||||
var animation = new Animation(effect, args.timeline);
|
||||
|
||||
|
@ -81,7 +81,7 @@ gTestArguments.forEach(function(args) {
|
|||
}, "Animation can be constructed " + args.description);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(null,
|
||||
{ left: ["10px", "20px"] },
|
||||
{ duration: 10000,
|
||||
|
@ -95,10 +95,10 @@ test(function(t) {
|
|||
assert_equals(effect.getComputedTiming().progress, 1.0);
|
||||
}, "Animation constructed by an effect with null target runs normally");
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var iframe = document.createElement('iframe');
|
||||
|
||||
iframe.addEventListener('load', t.step_func(function() {
|
||||
iframe.addEventListener('load', t.step_func(() => {
|
||||
var div = createDiv(t, iframe.contentDocument);
|
||||
var effect = new KeyframeEffectReadOnly(div, null, 10000);
|
||||
var anim = new Animation(effect);
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = new Animation();
|
||||
assert_equals(anim.effect, null, "initial effect is null");
|
||||
|
||||
|
@ -19,7 +19,7 @@ test(function(t) {
|
|||
assert_equals(anim.effect, newEffect, "new effect is set");
|
||||
}, "effect is set correctly.");
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({ left: ['100px', '100px'] },
|
||||
{ fill: 'forwards' });
|
||||
|
|
|
@ -12,28 +12,28 @@
|
|||
|
||||
var gKeyFrames = { 'marginLeft': ['100px', '200px'] };
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 0;
|
||||
|
||||
assert_throws({name: 'InvalidStateError'}, function() {
|
||||
assert_throws({name: 'InvalidStateError'}, () => {
|
||||
animation.finish();
|
||||
});
|
||||
}, 'Test exceptions when finishing non-running animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames,
|
||||
{duration : 100 * MS_PER_SEC,
|
||||
iterations : Infinity});
|
||||
|
||||
assert_throws({name: 'InvalidStateError'}, function() {
|
||||
assert_throws({name: 'InvalidStateError'}, () => {
|
||||
animation.finish();
|
||||
});
|
||||
}, 'Test exceptions when finishing infinite animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.finish();
|
||||
|
@ -43,7 +43,7 @@ test(function(t) {
|
|||
'of the active duration');
|
||||
}, 'Test finishing of animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
// 1s past effect end
|
||||
|
@ -56,11 +56,11 @@ test(function(t) {
|
|||
'end of the active duration');
|
||||
}, 'Test finishing of animation with a current time past the effect end');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
animation.playbackRate = -1;
|
||||
animation.finish();
|
||||
|
||||
|
@ -70,11 +70,11 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test finishing of reversed animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
animation.playbackRate = -1;
|
||||
animation.currentTime = -1000;
|
||||
animation.finish();
|
||||
|
@ -85,11 +85,11 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test finishing of reversed animation with a current time less than zero');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.pause();
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.finish();
|
||||
|
||||
assert_equals(animation.playState, 'finished',
|
||||
|
@ -102,7 +102,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test finish() while paused');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.pause();
|
||||
|
@ -121,7 +121,7 @@ test(function(t) {
|
|||
'be set after calling finish()');
|
||||
}, 'Test finish() while pause-pending with positive playbackRate');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.pause();
|
||||
|
@ -136,7 +136,7 @@ test(function(t) {
|
|||
'set after calling finish()');
|
||||
}, 'Test finish() while pause-pending with negative playbackRate');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 0.5;
|
||||
|
@ -155,10 +155,10 @@ test(function(t) {
|
|||
// - In that case even after calling finish() we should still be pending but
|
||||
// the current time should be updated
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.pause();
|
||||
animation.play();
|
||||
// We are now in the unusual situation of being play-pending whilst having
|
||||
|
@ -172,11 +172,11 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test finish() during aborted pause');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.finish();
|
||||
var marginLeft = parseFloat(getComputedStyle(div).marginLeft);
|
||||
|
||||
|
@ -186,34 +186,34 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test resetting of computed style');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
var resolvedFinished = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
resolvedFinished = true;
|
||||
});
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.finish();
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_true(resolvedFinished,
|
||||
'Animation.finished should be resolved soon after ' +
|
||||
'Animation.finish()');
|
||||
});
|
||||
}, 'Test finish() resolves finished promise synchronously');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(null, gKeyFrames, 100 * MS_PER_SEC);
|
||||
var animation = new Animation(effect, document.timeline);
|
||||
var resolvedFinished = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
resolvedFinished = true;
|
||||
});
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.finish();
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_true(resolvedFinished,
|
||||
'Animation.finished should be resolved soon after ' +
|
||||
'Animation.finish()');
|
||||
|
@ -221,20 +221,20 @@ promise_test(function(t) {
|
|||
}, 'Test finish() resolves finished promise synchronously with an animation ' +
|
||||
'without a target');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(null, gKeyFrames, 100 * MS_PER_SEC);
|
||||
var animation = new Animation(effect, document.timeline);
|
||||
animation.play();
|
||||
|
||||
var resolvedFinished = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
resolvedFinished = true;
|
||||
});
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = animation.effect.getComputedTiming().endTime - 1;
|
||||
return waitForAnimationFrames(2);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_true(resolvedFinished,
|
||||
'Animation.finished should be resolved soon after ' +
|
||||
'Animation finishes normally');
|
||||
|
|
|
@ -10,11 +10,11 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.finished, previousFinishedPromise,
|
||||
'Finished promise is the same object when playing starts');
|
||||
animation.pause();
|
||||
|
@ -27,18 +27,18 @@ promise_test(function(t) {
|
|||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
|
||||
return animation.finished;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(animation.finished, previousFinishedPromise,
|
||||
'Finished promise is the same object when playing completes');
|
||||
});
|
||||
}, 'Test pausing then playing does not change the finished promise');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
animation.finish();
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
assert_equals(animation.finished, previousFinishedPromise,
|
||||
'Finished promise is the same object when playing completes');
|
||||
animation.play();
|
||||
|
@ -53,12 +53,12 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test restarting a finished animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise;
|
||||
animation.finish();
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
previousFinishedPromise = animation.finished;
|
||||
animation.playbackRate = -1;
|
||||
assert_not_equals(animation.finished, previousFinishedPromise,
|
||||
|
@ -66,7 +66,7 @@ promise_test(function(t) {
|
|||
'finished promise');
|
||||
animation.currentTime = 0;
|
||||
return animation.finished;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
previousFinishedPromise = animation.finished;
|
||||
animation.play();
|
||||
assert_not_equals(animation.finished, previousFinishedPromise,
|
||||
|
@ -75,12 +75,12 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test restarting a reversed finished animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
animation.finish();
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC + 1000;
|
||||
assert_equals(animation.finished, previousFinishedPromise,
|
||||
'Finished promise is unchanged jumping past end of ' +
|
||||
|
@ -88,71 +88,71 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test redundant finishing of animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
// Setup callback to run if finished promise is resolved
|
||||
var finishPromiseResolved = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
finishPromiseResolved = true;
|
||||
});
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
// Jump to mid-way in interval and pause
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
animation.pause();
|
||||
return animation.ready;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
// Jump to the end
|
||||
// (But don't use finish() since that should unpause as well)
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(2);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_false(finishPromiseResolved,
|
||||
'Finished promise should not resolve when paused');
|
||||
});
|
||||
}, 'Finished promise does not resolve when paused');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
// Setup callback to run if finished promise is resolved
|
||||
var finishPromiseResolved = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
finishPromiseResolved = true;
|
||||
});
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
// Jump to mid-way in interval and pause
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
animation.pause();
|
||||
// Jump to the end
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(2);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_false(finishPromiseResolved,
|
||||
'Finished promise should not resolve when pause-pending');
|
||||
});
|
||||
}, 'Finished promise does not resolve when pause-pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.finish();
|
||||
return animation.finished.then(function(resolvedAnimation) {
|
||||
return animation.finished.then(resolvedAnimation => {
|
||||
assert_equals(resolvedAnimation, animation,
|
||||
'Object identity of animation passed to Promise callback'
|
||||
+ ' matches the animation object owning the Promise');
|
||||
});
|
||||
}, 'The finished promise is fulfilled with its Animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
|
||||
// Set up listeners on finished promise
|
||||
var retPromise = animation.finished.then(function() {
|
||||
var retPromise = animation.finished.then(() => {
|
||||
assert_unreached('finished promise was fulfilled');
|
||||
}).catch(function(err) {
|
||||
}).catch(err => {
|
||||
assert_equals(err.name, 'AbortError',
|
||||
'finished promise is rejected with AbortError');
|
||||
assert_not_equals(animation.finished, previousFinishedPromise,
|
||||
|
@ -166,12 +166,12 @@ promise_test(function(t) {
|
|||
}, 'finished promise is rejected when an animation is cancelled by calling ' +
|
||||
'cancel()');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
animation.finish();
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
animation.cancel();
|
||||
assert_not_equals(animation.finished, previousFinishedPromise,
|
||||
'A new finished promise should be created when'
|
||||
|
@ -179,14 +179,14 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'cancelling an already-finished animation replaces the finished promise');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
// The spec says we still create a new finished promise and reject the old
|
||||
// one even if we're already idle. That behavior might change, but for now
|
||||
// test that we do that.
|
||||
var retPromise = animation.finished.catch(function(err) {
|
||||
var retPromise = animation.finished.catch(err => {
|
||||
assert_equals(err.name, 'AbortError',
|
||||
'finished promise is rejected with AbortError');
|
||||
});
|
||||
|
@ -200,7 +200,7 @@ promise_test(function(t) {
|
|||
return retPromise;
|
||||
}, 'cancelling an idle animation still replaces the finished promise');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
const HALF_DUR = 100 * MS_PER_SEC / 2;
|
||||
|
@ -208,7 +208,7 @@ promise_test(function(t) {
|
|||
var gotNextFrame = false;
|
||||
var currentTimeBeforeShortening;
|
||||
animation.currentTime = HALF_DUR;
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
currentTimeBeforeShortening = animation.currentTime;
|
||||
animation.effect.timing.duration = QUARTER_DUR;
|
||||
// Below we use gotNextFrame to check that shortening of the animation
|
||||
|
@ -216,12 +216,12 @@ promise_test(function(t) {
|
|||
// getting resolved on the next animation frame. This relies on the fact
|
||||
// that the promises are resolved as a micro-task before the next frame
|
||||
// happens.
|
||||
waitForAnimationFrames(1).then(function() {
|
||||
waitForAnimationFrames(1).then(() => {
|
||||
gotNextFrame = true;
|
||||
});
|
||||
|
||||
return animation.finished;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_false(gotNextFrame, 'shortening of the animation duration should ' +
|
||||
'resolve the finished promise');
|
||||
assert_equals(animation.currentTime, currentTimeBeforeShortening,
|
||||
|
@ -234,16 +234,16 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test finished promise changes for animation duration changes');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var retPromise = animation.ready.then(function() {
|
||||
var retPromise = animation.ready.then(() => {
|
||||
animation.playbackRate = 0;
|
||||
animation.currentTime = 100 * MS_PER_SEC + 1000;
|
||||
return waitForAnimationFrames(2);
|
||||
});
|
||||
|
||||
animation.finished.then(t.step_func(function() {
|
||||
animation.finished.then(t.step_func(() => {
|
||||
assert_unreached('finished promise should not resolve when playbackRate ' +
|
||||
'is zero');
|
||||
}));
|
||||
|
@ -251,21 +251,21 @@ promise_test(function(t) {
|
|||
return retPromise;
|
||||
}, 'Test finished promise changes when playbackRate == 0');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.playbackRate = -1;
|
||||
return animation.finished;
|
||||
});
|
||||
}, 'Test finished promise resolves when reaching to the natural boundary.');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
animation.finish();
|
||||
return animation.finished.then(function() {
|
||||
return animation.finished.then(() => {
|
||||
animation.currentTime = 0;
|
||||
assert_not_equals(animation.finished, previousFinishedPromise,
|
||||
'Finished promise should change once a prior ' +
|
||||
|
@ -275,7 +275,7 @@ promise_test(function(t) {
|
|||
}, 'Test finished promise changes when a prior finished promise resolved ' +
|
||||
'and the animation falls out finished state');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
|
@ -287,7 +287,7 @@ test(function(t) {
|
|||
}, 'Test no new finished promise generated when finished state ' +
|
||||
'is checked asynchronously');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var previousFinishedPromise = animation.finished;
|
||||
|
@ -299,17 +299,17 @@ test(function(t) {
|
|||
}, 'Test new finished promise generated when finished state ' +
|
||||
'is checked synchronously');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var resolvedFinished = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
resolvedFinished = true;
|
||||
});
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.finish();
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_true(resolvedFinished,
|
||||
'Animation.finished should be resolved even if ' +
|
||||
'the finished state is changed soon');
|
||||
|
@ -318,18 +318,18 @@ promise_test(function(t) {
|
|||
}, 'Test synchronous finished promise resolved even if finished state ' +
|
||||
'is changed soon');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var resolvedFinished = false;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
resolvedFinished = true;
|
||||
});
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
animation.finish();
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_true(resolvedFinished,
|
||||
'Animation.finished should be resolved soon after finish() is ' +
|
||||
'called even if there are other asynchronous promises just before it');
|
||||
|
@ -337,26 +337,26 @@ promise_test(function(t) {
|
|||
}, 'Test synchronous finished promise resolved even if asynchronous ' +
|
||||
'finished promise happens just before synchronous promise');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.finished.then(t.step_func(function() {
|
||||
animation.finished.then(t.step_func(() => {
|
||||
assert_unreached('Animation.finished should not be resolved');
|
||||
}));
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
});
|
||||
}, 'Test finished promise is not resolved when the animation ' +
|
||||
'falls out finished state immediately');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
animation.finished.then(t.step_func(function() {
|
||||
animation.finished.then(t.step_func(() => {
|
||||
assert_unreached('Animation.finished should not be resolved');
|
||||
}));
|
||||
animation.currentTime = 0;
|
||||
|
@ -366,24 +366,24 @@ promise_test(function(t) {
|
|||
'falls out finished state even though the current finished ' +
|
||||
'promise is generated soon after animation state became finished');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
var ready = false;
|
||||
animation.ready.then(
|
||||
t.step_func(function() {
|
||||
t.step_func(() => {
|
||||
ready = true;
|
||||
}),
|
||||
t.unreached_func('Ready promise must not be rejected')
|
||||
);
|
||||
|
||||
var testSuccess = animation.finished.then(
|
||||
t.step_func(function() {
|
||||
t.step_func(() => {
|
||||
assert_true(ready, 'Ready promise has resolved');
|
||||
}),
|
||||
t.unreached_func('Finished promise must not be rejected')
|
||||
);
|
||||
|
||||
var timeout = waitForAnimationFrames(3).then(function() {
|
||||
var timeout = waitForAnimationFrames(3).then(() => {
|
||||
return Promise.reject('Finished promise did not arrive in time');
|
||||
});
|
||||
|
||||
|
@ -391,24 +391,24 @@ promise_test(function(t) {
|
|||
return Promise.race([timeout, testSuccess]);
|
||||
}, 'Finished promise should be resolved after the ready promise is resolved');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
var caught = false;
|
||||
animation.ready.then(
|
||||
t.unreached_func('Ready promise must not be resolved'),
|
||||
t.step_func(function() {
|
||||
t.step_func(() => {
|
||||
caught = true;
|
||||
})
|
||||
);
|
||||
|
||||
var testSuccess = animation.finished.then(
|
||||
t.unreached_func('Finished promise must not be resolved'),
|
||||
t.step_func(function() {
|
||||
t.step_func(() => {
|
||||
assert_true(caught, 'Ready promise has been rejected');
|
||||
})
|
||||
);
|
||||
|
||||
var timeout = waitForAnimationFrames(3).then(function() {
|
||||
var timeout = waitForAnimationFrames(3).then(() => {
|
||||
return Promise.reject('Finished promise was not rejected in time');
|
||||
});
|
||||
|
||||
|
|
|
@ -10,13 +10,13 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
assert_equals(animation.id, '', 'id for Animation is initially empty');
|
||||
}, 'Animation.id initial value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.id = 'anim';
|
||||
|
|
|
@ -10,15 +10,15 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var finishedTimelineTime;
|
||||
animation.finished.then().catch(function() {
|
||||
animation.finished.then().catch(() => {
|
||||
finishedTimelineTime = animation.timeline.currentTime;
|
||||
});
|
||||
|
||||
animation.oncancel = t.step_func_done(function(event) {
|
||||
animation.oncancel = t.step_func_done(event => {
|
||||
assert_equals(event.currentTime, null,
|
||||
'event.currentTime should be null');
|
||||
assert_equals(event.timelineTime, finishedTimelineTime,
|
||||
|
|
|
@ -10,15 +10,15 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
var finishedTimelineTime;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
finishedTimelineTime = animation.timeline.currentTime;
|
||||
});
|
||||
|
||||
animation.onfinish = t.step_func_done(function(event) {
|
||||
animation.onfinish = t.step_func_done(event => {
|
||||
assert_equals(event.currentTime, 0,
|
||||
'event.currentTime should be zero');
|
||||
assert_equals(event.timelineTime, finishedTimelineTime,
|
||||
|
@ -30,16 +30,16 @@ async_test(function(t) {
|
|||
}, 'onfinish event is fired when the currentTime < 0 and ' +
|
||||
'the playbackRate < 0');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
|
||||
var finishedTimelineTime;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
finishedTimelineTime = animation.timeline.currentTime;
|
||||
});
|
||||
|
||||
animation.onfinish = t.step_func_done(function(event) {
|
||||
animation.onfinish = t.step_func_done(event => {
|
||||
assert_equals(event.currentTime, 100 * MS_PER_SEC,
|
||||
'event.currentTime should be the effect end');
|
||||
assert_equals(event.timelineTime, finishedTimelineTime,
|
||||
|
@ -51,16 +51,16 @@ async_test(function(t) {
|
|||
}, 'onfinish event is fired when the currentTime > 0 and ' +
|
||||
'the playbackRate > 0');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
|
||||
var finishedTimelineTime;
|
||||
animation.finished.then(function() {
|
||||
animation.finished.then(() => {
|
||||
finishedTimelineTime = animation.timeline.currentTime;
|
||||
});
|
||||
|
||||
animation.onfinish = t.step_func_done(function(event) {
|
||||
animation.onfinish = t.step_func_done(event => {
|
||||
assert_equals(event.currentTime, 100 * MS_PER_SEC,
|
||||
'event.currentTime should be the effect end');
|
||||
assert_equals(event.timelineTime, finishedTimelineTime,
|
||||
|
@ -71,45 +71,45 @@ async_test(function(t) {
|
|||
animation.finish();
|
||||
}, 'onfinish event is fired when animation.finish() is called');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
assert_unreached('onfinish event should not be fired');
|
||||
};
|
||||
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
animation.pause();
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(2);
|
||||
});
|
||||
}, 'onfinish event is not fired when paused');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
assert_unreached('onfinish event should not be fired');
|
||||
};
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.playbackRate = 0;
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(2);
|
||||
});
|
||||
}, 'onfinish event is not fired when the playbackRate is zero');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
assert_unreached('onfinish event should not be fired');
|
||||
};
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 100 * MS_PER_SEC;
|
||||
animation.currentTime = 100 * MS_PER_SEC / 2;
|
||||
return waitForAnimationFrames(2);
|
||||
|
|
|
@ -10,26 +10,26 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 1000 * MS_PER_SEC);
|
||||
var previousCurrentTime = animation.currentTime;
|
||||
|
||||
return animation.ready.then(waitForAnimationFrames(1)).then(function() {
|
||||
return animation.ready.then(waitForAnimationFrames(1)).then(() => {
|
||||
assert_true(animation.currentTime >= previousCurrentTime,
|
||||
'currentTime is initially increasing');
|
||||
animation.pause();
|
||||
return animation.ready;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
previousCurrentTime = animation.currentTime;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(animation.currentTime, previousCurrentTime,
|
||||
'currentTime does not increase after calling pause()');
|
||||
});
|
||||
}, 'pause() a running animation');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 1000 * MS_PER_SEC);
|
||||
|
||||
|
@ -42,7 +42,7 @@ promise_test(function(t) {
|
|||
assert_equals(animation.playState, 'pending', 'initially pause-pending');
|
||||
|
||||
// Check it still resolves as expected
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'paused',
|
||||
'resolves to paused state asynchronously');
|
||||
assert_equals(animation.currentTime, 0,
|
||||
|
@ -50,7 +50,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'pause() from idle');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 1000 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
|
@ -60,13 +60,13 @@ promise_test(function(t) {
|
|||
assert_equals(animation.currentTime, 1000 * MS_PER_SEC,
|
||||
'currentTime is set to the effect end');
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.currentTime, 1000 * MS_PER_SEC,
|
||||
'keeps the initially set currentTime');
|
||||
});
|
||||
}, 'pause() from idle with a negative playbackRate');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 1000 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
|
@ -74,21 +74,21 @@ test(function(t) {
|
|||
animation.playbackRate = -1;
|
||||
|
||||
assert_throws('InvalidStateError',
|
||||
function () { animation.pause(); },
|
||||
() => { animation.pause(); },
|
||||
'Expect InvalidStateError exception on calling pause() ' +
|
||||
'from idle with a negative playbackRate and ' +
|
||||
'infinite-duration animation');
|
||||
}, 'pause() from idle with a negative playbackRate and endless effect');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 1000 * MS_PER_SEC);
|
||||
return animation.ready
|
||||
.then(function(animation) {
|
||||
.then(animation => {
|
||||
animation.finish();
|
||||
animation.pause();
|
||||
return animation.ready;
|
||||
}).then(function(animation) {
|
||||
}).then(animation => {
|
||||
assert_equals(animation.currentTime, 1000 * MS_PER_SEC,
|
||||
'currentTime after pausing finished animation');
|
||||
});
|
||||
|
|
|
@ -10,19 +10,19 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({ transform: ['none', 'translate(10px)']},
|
||||
{ duration : 100 * MS_PER_SEC,
|
||||
iterations : Infinity});
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
// Seek to a time outside the active range so that play() will have to
|
||||
// snap back to the start
|
||||
animation.currentTime = -5 * MS_PER_SEC;
|
||||
animation.playbackRate = -1;
|
||||
|
||||
assert_throws('InvalidStateError',
|
||||
function () { animation.play(); },
|
||||
() => { animation.play(); },
|
||||
'Expected InvalidStateError exception on calling play() ' +
|
||||
'with a negative playbackRate and infinite-duration ' +
|
||||
'animation');
|
||||
|
|
|
@ -10,36 +10,36 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
|
||||
assert_equals(animation.playState, 'pending');
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'running');
|
||||
});
|
||||
}, 'Animation.playState reports \'pending\'->\'running\' when initially ' +
|
||||
'played');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.pause();
|
||||
|
||||
assert_equals(animation.playState, 'pending');
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'paused');
|
||||
});
|
||||
}, 'Animation.playState reports \'pending\'->\'paused\' when pausing');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
assert_equals(animation.playState, 'idle');
|
||||
}, 'Animation.playState is \'idle\' when canceled.');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
|
|
|
@ -26,10 +26,10 @@ function assert_playbackrate(animation,
|
|||
description);
|
||||
}
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 7 * MS_PER_SEC; // ms
|
||||
animation.playbackRate = 0.5;
|
||||
|
||||
|
@ -43,17 +43,17 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test the initial effect of setting playbackRate on currentTime');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 2;
|
||||
var previousTimelineCurrentTime;
|
||||
var previousAnimationCurrentTime;
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
previousAnimationCurrentTime = animation.currentTime;
|
||||
previousTimelineCurrentTime = animation.timeline.currentTime;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_playbackrate(animation,
|
||||
previousAnimationCurrentTime,
|
||||
previousTimelineCurrentTime,
|
||||
|
@ -61,18 +61,18 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Test the effect of setting playbackRate on currentTime');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 2;
|
||||
var previousTimelineCurrentTime;
|
||||
var previousAnimationCurrentTime;
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
previousAnimationCurrentTime = animation.currentTime;
|
||||
previousTimelineCurrentTime = animation.timeline.currentTime;
|
||||
animation.playbackRate = 1;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(animation.playbackRate, 1,
|
||||
'sanity check: animation.playbackRate is still 1.');
|
||||
assert_playbackrate(animation,
|
||||
|
|
|
@ -10,13 +10,13 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
var originalReadyPromise = animation.ready;
|
||||
var pauseReadyPromise;
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.ready, originalReadyPromise,
|
||||
'Ready promise is the same object when playing completes');
|
||||
animation.pause();
|
||||
|
@ -26,18 +26,18 @@ promise_test(function(t) {
|
|||
// Wait for the promise to fulfill since if we abort the pause the ready
|
||||
// promise object is reused.
|
||||
return animation.ready;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
animation.play();
|
||||
assert_not_equals(animation.ready, pauseReadyPromise,
|
||||
'A new ready promise is created when playing');
|
||||
});
|
||||
}, 'A new ready promise is created when play()/pause() is called');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
var promiseBeforeCallingPlay = animation.ready;
|
||||
animation.play();
|
||||
assert_equals(animation.ready, promiseBeforeCallingPlay,
|
||||
|
@ -46,11 +46,11 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Redundant calls to play() do not generate new ready promise objects');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
return animation.ready.then(function(resolvedAnimation) {
|
||||
return animation.ready.then(resolvedAnimation => {
|
||||
assert_equals(resolvedAnimation, animation,
|
||||
'Object identity of Animation passed to Promise callback'
|
||||
+ ' matches the Animation object owning the Promise');
|
||||
|
|
|
@ -11,40 +11,40 @@ href="https://w3c.github.io/web-animations/#dom-animation-starttime">
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = new Animation(new KeyframeEffect(createDiv(t), null),
|
||||
document.timeline);
|
||||
assert_equals(animation.startTime, null, 'startTime is unresolved');
|
||||
}, 'startTime of a newly created (idle) animation is unresolved');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = new Animation(new KeyframeEffect(createDiv(t), null),
|
||||
document.timeline);
|
||||
animation.play();
|
||||
assert_equals(animation.startTime, null, 'startTime is unresolved');
|
||||
}, 'startTime of a play-pending animation is unresolved');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = new Animation(new KeyframeEffect(createDiv(t), null),
|
||||
document.timeline);
|
||||
animation.pause();
|
||||
assert_equals(animation.startTime, null, 'startTime is unresolved');
|
||||
}, 'startTime of a pause-pending animation is unresolved');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null);
|
||||
assert_equals(animation.startTime, null, 'startTime is unresolved');
|
||||
}, 'startTime of a play-pending animation created using Element.animate'
|
||||
+ ' shortcut is unresolved');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_greater_than(animation.startTime, 0, 'startTime when running');
|
||||
});
|
||||
}, 'startTime is resolved when running');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
assert_equals(animation.startTime, null);
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.delay, 0);
|
||||
}, 'Has the default value 0');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100);
|
||||
anim.effect.timing.delay = 100;
|
||||
|
@ -24,7 +24,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set delay 100');
|
||||
}, 'Can be set to a positive number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100);
|
||||
anim.effect.timing.delay = -100;
|
||||
|
@ -33,7 +33,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set delay -100');
|
||||
}, 'Can be set to a negative number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100);
|
||||
anim.effect.timing.delay = 100;
|
||||
|
@ -42,7 +42,7 @@ test(function(t) {
|
|||
}, 'Can set a positive delay on an animation without a backwards fill to'
|
||||
+ ' make it no longer active');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ fill: 'both',
|
||||
|
@ -51,7 +51,7 @@ test(function(t) {
|
|||
assert_equals(anim.effect.getComputedTiming().progress, 0.5);
|
||||
}, 'Can set a negative delay to seek into the active interval');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ fill: 'both',
|
||||
|
@ -61,14 +61,14 @@ test(function(t) {
|
|||
assert_equals(anim.effect.getComputedTiming().currentIteration, 0);
|
||||
}, 'Can set a large negative delay to finishing an animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null);
|
||||
for (let invalid of [NaN, Infinity]) {
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.delay = invalid;
|
||||
}, 'setting ' + invalid);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({}, { delay: invalid });
|
||||
}, 'animate() with ' + invalid);
|
||||
}
|
||||
|
|
|
@ -10,24 +10,24 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.direction, 'normal');
|
||||
}, 'Has the default value \'normal\'');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
|
||||
var directions = ['normal', 'reverse', 'alternate', 'alternate-reverse'];
|
||||
directions.forEach(function(direction) {
|
||||
directions.forEach(direction => {
|
||||
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(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null, { duration: 10000, direction: 'normal' });
|
||||
anim.currentTime = 7000;
|
||||
|
@ -40,7 +40,7 @@ test(function(t) {
|
|||
'progress after updating direction');
|
||||
}, 'Can be changed from \'normal\' to \'reverse\' while in progress');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ duration: 10000,
|
||||
|
@ -55,7 +55,7 @@ test(function(t) {
|
|||
}, 'Can be changed from \'normal\' to \'reverse\' while at start of active'
|
||||
+ ' interval');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ fill: 'backwards',
|
||||
|
@ -71,7 +71,7 @@ test(function(t) {
|
|||
'progress after updating direction');
|
||||
}, 'Can be changed from \'normal\' to \'reverse\' while filling backwards');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ iterations: 2,
|
||||
|
@ -87,7 +87,7 @@ test(function(t) {
|
|||
'progress after updating direction');
|
||||
}, 'Can be changed from \'normal\' to \'alternate\' while in progress');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ iterations: 2,
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.duration, 'auto');
|
||||
}, 'Has the default value \'auto\'');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.duration = 123.45;
|
||||
|
@ -25,7 +25,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set duration 123.45');
|
||||
}, 'Can be set to a double value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.duration = 'auto';
|
||||
|
@ -34,7 +34,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set duration \'auto\'');
|
||||
}, 'Can be set to the string \'auto\'');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, { duration: 'auto' });
|
||||
assert_equals(anim.effect.timing.duration, 'auto', 'set duration \'auto\'');
|
||||
|
@ -42,7 +42,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set duration \'auto\'');
|
||||
}, 'Can be set to \'auto\' using a dictionary object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.duration = Infinity;
|
||||
|
@ -51,107 +51,107 @@ test(function(t) {
|
|||
'getComputedTiming() after set duration Infinity');
|
||||
}, 'Can be set to Infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, -1);
|
||||
});
|
||||
}, 'animate() throws when passed a negative number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, -Infinity);
|
||||
});
|
||||
}, 'animate() throws when passed negative Infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, NaN);
|
||||
});
|
||||
}, 'animate() throws when passed a NaN value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, { duration: -1 });
|
||||
});
|
||||
}, 'animate() throws when passed a negative number using a dictionary object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, { duration: -Infinity });
|
||||
});
|
||||
}, 'animate() throws when passed negative Infinity using a dictionary object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({ opacity: [ 0, 1 ] }, { duration: NaN });
|
||||
});
|
||||
}, 'animate() throws when passed a NaN value using a dictionary object');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
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(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
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(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.duration = -1;
|
||||
});
|
||||
}, 'Throws when setting a negative number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.duration = -Infinity;
|
||||
});
|
||||
}, 'Throws when setting negative infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.duration = NaN;
|
||||
});
|
||||
}, 'Throws when setting a NaN value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.duration = 'abc';
|
||||
});
|
||||
}, 'Throws when setting a string other than \'auto\'');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.duration = '100';
|
||||
});
|
||||
}, 'Throws when setting a string containing a number');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
var originalStartTime = anim.startTime;
|
||||
var originalCurrentTime = anim.currentTime;
|
||||
assert_equals(anim.effect.getComputedTiming().duration, 100 * MS_PER_SEC,
|
||||
|
@ -169,7 +169,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Extending an effect\'s duration does not change the start or current time');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null, { duration: 100000, fill: 'both' });
|
||||
anim.finish();
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.easing, 'linear');
|
||||
}, 'Has the default value \'linear\'');
|
||||
|
@ -26,8 +26,8 @@ function assert_progress(animation, currentTime, easingFunction) {
|
|||
easingFunction(portion) + ' at ' + currentTime + 'ms');
|
||||
}
|
||||
|
||||
gEasingTests.forEach(function(options) {
|
||||
test(function(t) {
|
||||
gEasingTests.forEach(options => {
|
||||
test(t => {
|
||||
var target = createDiv(t);
|
||||
var anim = target.animate([ { opacity: 0 }, { opacity: 1 } ],
|
||||
{ duration: 1000 * MS_PER_SEC,
|
||||
|
@ -45,26 +45,26 @@ gEasingTests.forEach(function(options) {
|
|||
}, options.desc);
|
||||
});
|
||||
|
||||
gInvalidEasings.forEach(function(invalidEasing) {
|
||||
test(function(t) {
|
||||
gInvalidEasings.forEach(invalidEasing => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100 * MS_PER_SEC);
|
||||
assert_throws({ name: 'TypeError' },
|
||||
function() {
|
||||
() => {
|
||||
anim.effect.timing.easing = invalidEasing;
|
||||
});
|
||||
}, 'Throws on invalid easing: \'' + invalidEasing + '\'');
|
||||
});
|
||||
|
||||
gRoundtripEasings.forEach(easing => {
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const anim = createDiv(t).animate(null);
|
||||
anim.effect.timing.easing = easing;
|
||||
assert_equals(anim.effect.timing.easing, easing);
|
||||
}, `Canonical easing '${easing}' is returned as set`);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var delay = 1000 * MS_PER_SEC;
|
||||
|
||||
var target = createDiv(t);
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.endDelay, 0);
|
||||
}, 'Has the default value 0');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.endDelay = 123.45;
|
||||
|
@ -25,7 +25,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set endDelay 123.45');
|
||||
}, 'Can be set to a positive number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.endDelay = -1000;
|
||||
|
@ -34,51 +34,51 @@ test(function(t) {
|
|||
'getComputedTiming() after set endDelay -1000');
|
||||
}, 'Can be set to a negative number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({name: "TypeError"}, function() {
|
||||
assert_throws({name: "TypeError"}, () => {
|
||||
anim.effect.timing.endDelay = Infinity;
|
||||
}, 'we can not assign Infinity to timing.endDelay');
|
||||
}, 'Throws when setting infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({name: "TypeError"}, function() {
|
||||
assert_throws({name: "TypeError"}, () => {
|
||||
anim.effect.timing.endDelay = -Infinity;
|
||||
}, 'we can not assign negative Infinity to timing.endDelay');
|
||||
}, 'Throws when setting negative infinity');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ duration: 100000, endDelay: 50000 });
|
||||
anim.onfinish = t.step_func(function(event) {
|
||||
anim.onfinish = t.step_func(event => {
|
||||
assert_unreached('finish event should not be fired');
|
||||
});
|
||||
|
||||
anim.ready.then(function() {
|
||||
anim.ready.then(() => {
|
||||
anim.currentTime = 100000;
|
||||
return waitForAnimationFrames(2);
|
||||
}).then(t.step_func(function() {
|
||||
}).then(t.step_func(() => {
|
||||
t.done();
|
||||
}));
|
||||
}, 'finish event is not fired at the end of the active interval when the'
|
||||
+ ' endDelay has not expired');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ duration: 100000, endDelay: 30000 });
|
||||
anim.ready.then(function() {
|
||||
anim.ready.then(() => {
|
||||
anim.currentTime = 110000; // during endDelay
|
||||
anim.onfinish = t.step_func(function(event) {
|
||||
anim.onfinish = t.step_func(event => {
|
||||
assert_unreached('onfinish event should not be fired during endDelay');
|
||||
});
|
||||
return waitForAnimationFrames(2);
|
||||
}).then(t.step_func(function() {
|
||||
anim.onfinish = t.step_func(function(event) {
|
||||
}).then(t.step_func(() => {
|
||||
anim.onfinish = t.step_func(event => {
|
||||
t.done();
|
||||
});
|
||||
anim.currentTime = 130000; // after endTime
|
||||
|
|
|
@ -10,13 +10,13 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.fill, 'auto');
|
||||
}, 'Has the default value \'auto\'');
|
||||
|
||||
["none", "forwards", "backwards", "both", ].forEach(function(fill){
|
||||
test(function(t) {
|
||||
["none", "forwards", "backwards", "both", ].forEach(fill => {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100);
|
||||
anim.effect.timing.fill = fill;
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.iterationStart, 0);
|
||||
}, 'Has the default value 0');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ iterationStart: 0.2,
|
||||
|
@ -28,7 +28,7 @@ test(function(t) {
|
|||
assert_equals(anim.effect.getComputedTiming().currentIteration, 2);
|
||||
}, 'Changing the value updates computed timing when backwards-filling');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ iterationStart: 0.2,
|
||||
|
@ -41,7 +41,7 @@ test(function(t) {
|
|||
assert_equals(anim.effect.getComputedTiming().currentIteration, 2);
|
||||
}, 'Changing the value updates computed timing during the active phase');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] },
|
||||
{ iterationStart: 0.2,
|
||||
|
@ -55,14 +55,14 @@ test(function(t) {
|
|||
assert_equals(anim.effect.getComputedTiming().currentIteration, 3);
|
||||
}, 'Changing the value updates computed timing when forwards-filling');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null);
|
||||
for (let invalid of [-1, NaN, Infinity]) {
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.iterationStart = invalid;
|
||||
}, 'setting ' + invalid);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
div.animate({}, { iterationStart: invalid });
|
||||
}, 'animate() with ' + invalid);
|
||||
}
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.timing.iterations, 1);
|
||||
}, 'Has the default value 1');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.iterations = 2;
|
||||
|
@ -24,7 +24,7 @@ test(function(t) {
|
|||
'getComputedTiming() after set iterations 2');
|
||||
}, 'Can be set to a double value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
anim.effect.timing.iterations = Infinity;
|
||||
|
@ -33,31 +33,31 @@ test(function(t) {
|
|||
'getComputedTiming() after set iterations Infinity');
|
||||
}, 'Can be set to infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.iterations = -1;
|
||||
});
|
||||
}, 'Throws when setting a negative number');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.iterations = -Infinity;
|
||||
});
|
||||
}, 'Throws when setting negative infinity');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
||||
assert_throws({ name: 'TypeError' }, function() {
|
||||
assert_throws({ name: 'TypeError' }, () => {
|
||||
anim.effect.timing.iterations = NaN;
|
||||
});
|
||||
}, 'Throws when setting a NaN value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate(null, { duration: 100000, fill: 'both' });
|
||||
|
||||
|
|
|
@ -9,14 +9,14 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const evt = new AnimationPlaybackEvent('finish');
|
||||
assert_equals(evt.type, 'finish');
|
||||
assert_equals(evt.currentTime, null);
|
||||
assert_equals(evt.timelineTime, null);
|
||||
}, 'Event created without an event parameter has null time values');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const evt =
|
||||
new AnimationPlaybackEvent('cancel', {
|
||||
currentTime: -100,
|
||||
|
|
|
@ -13,13 +13,13 @@
|
|||
|
||||
var gKeyFrames = { 'marginLeft': ['100px', '200px'] };
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
assert_equals(document.getAnimations().length, 0,
|
||||
'getAnimations returns an empty sequence for a document ' +
|
||||
'with no animations');
|
||||
}, 'Test document.getAnimations for non-animated content');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim1 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
var anim2 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
|
@ -32,7 +32,7 @@ test(function(t) {
|
|||
'getAnimation only returns running animations');
|
||||
}, 'Test document.getAnimations for script-generated animations')
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim1 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
var anim2 = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
|
@ -41,7 +41,7 @@ test(function(t) {
|
|||
'getAnimations() returns running animations');
|
||||
}, 'Test the order of document.getAnimations with script generated animations')
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(null, gKeyFrames, 100 * MS_PER_SEC);
|
||||
var anim = new Animation(effect, document.timeline);
|
||||
anim.play();
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function() {
|
||||
test(() => {
|
||||
assert_equals(document.timeline, document.timeline,
|
||||
'Document.timeline returns the same object every time');
|
||||
const iframe = document.getElementById('iframe');
|
||||
|
|
|
@ -11,20 +11,20 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.composite, 'replace',
|
||||
'The default value should be replace');
|
||||
}, 'Default value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
anim.effect.composite = 'add';
|
||||
assert_equals(anim.effect.composite, 'add',
|
||||
'The effect composite value should be replaced');
|
||||
}, 'Change composite value');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate({ left: '10px' });
|
||||
|
||||
anim.effect.composite = 'add';
|
||||
|
@ -34,7 +34,7 @@ test(function(t) {
|
|||
'if effect composite is set');
|
||||
}, 'Unspecified keyframe composite value when setting effect composite');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate({ left: '10px', composite: 'replace' });
|
||||
|
||||
anim.effect.composite = 'add';
|
||||
|
|
|
@ -19,16 +19,16 @@
|
|||
|
||||
const target = document.getElementById('target');
|
||||
|
||||
test(function(t) {
|
||||
gEmptyKeyframeListTests.forEach(function(frames) {
|
||||
test(t => {
|
||||
gEmptyKeyframeListTests.forEach(frames => {
|
||||
assert_equals(new KeyframeEffectReadOnly(target, frames)
|
||||
.getKeyframes().length,
|
||||
0, 'number of frames for ' + JSON.stringify(frames));
|
||||
});
|
||||
}, 'A KeyframeEffectReadOnly can be constructed with no frames');
|
||||
|
||||
test(function(t) {
|
||||
gEasingParsingTests.forEach(function(subtest) {
|
||||
test(t => {
|
||||
gEasingParsingTests.forEach(subtest => {
|
||||
const easing = subtest[0];
|
||||
const expected = subtest[1];
|
||||
const effect = new KeyframeEffectReadOnly(target, {
|
||||
|
@ -40,7 +40,7 @@ test(function(t) {
|
|||
}, 'easing values are parsed correctly when passed to the ' +
|
||||
'KeyframeEffectReadOnly constructor in KeyframeEffectOptions');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
gInvalidEasings.forEach(invalidEasing => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target, null, { easing: invalidEasing });
|
||||
|
@ -49,53 +49,51 @@ test(function(t) {
|
|||
}, 'Invalid easing values are correctly rejected when passed to the ' +
|
||||
'KeyframeEffectReadOnly constructor in KeyframeEffectOptions');
|
||||
|
||||
test(function(t) {
|
||||
const getKeyframe = function(composite) {
|
||||
return { left: [ '10px', '20px' ], composite: composite };
|
||||
};
|
||||
gGoodKeyframeCompositeValueTests.forEach(function(composite) {
|
||||
test(t => {
|
||||
const getKeyframe =
|
||||
composite => ({ left: [ '10px', '20px' ], composite: composite });
|
||||
gGoodKeyframeCompositeValueTests.forEach(composite => {
|
||||
const effect = new KeyframeEffectReadOnly(target, getKeyframe(composite));
|
||||
assert_equals(effect.getKeyframes()[0].composite, composite,
|
||||
`resulting composite for '${composite}'`);
|
||||
});
|
||||
gBadCompositeValueTests.forEach(function(composite) {
|
||||
assert_throws(new TypeError, function() {
|
||||
gBadCompositeValueTests.forEach(composite => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target, getKeyframe(composite));
|
||||
});
|
||||
});
|
||||
}, 'composite values are parsed correctly when passed to the ' +
|
||||
'KeyframeEffectReadOnly constructor in property-indexed keyframes');
|
||||
|
||||
test(function(t) {
|
||||
const getKeyframes = function(composite) {
|
||||
return [
|
||||
test(t => {
|
||||
const getKeyframes = composite =>
|
||||
[
|
||||
{ offset: 0, left: '10px', composite: composite },
|
||||
{ offset: 1, left: '20px' }
|
||||
];
|
||||
};
|
||||
gGoodKeyframeCompositeValueTests.forEach(function(composite) {
|
||||
gGoodKeyframeCompositeValueTests.forEach(composite => {
|
||||
const effect = new KeyframeEffectReadOnly(target, getKeyframes(composite));
|
||||
assert_equals(effect.getKeyframes()[0].composite, composite,
|
||||
`resulting composite for '${composite}'`);
|
||||
});
|
||||
gBadCompositeValueTests.forEach(function(composite) {
|
||||
assert_throws(new TypeError, function() {
|
||||
gBadCompositeValueTests.forEach(composite => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target, getKeyframes(composite));
|
||||
});
|
||||
});
|
||||
}, 'composite values are parsed correctly when passed to the ' +
|
||||
'KeyframeEffectReadOnly constructor in regular keyframes');
|
||||
|
||||
test(function(t) {
|
||||
gGoodOptionsCompositeValueTests.forEach(function(composite) {
|
||||
test(t => {
|
||||
gGoodOptionsCompositeValueTests.forEach(composite => {
|
||||
const effect = new KeyframeEffectReadOnly(target, {
|
||||
left: ['10px', '20px']
|
||||
}, { composite: composite });
|
||||
assert_equals(effect.getKeyframes()[0].composite, undefined,
|
||||
`resulting composite for '${composite}'`);
|
||||
});
|
||||
gBadCompositeValueTests.forEach(function(composite) {
|
||||
assert_throws(new TypeError, function() {
|
||||
gBadCompositeValueTests.forEach(composite => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target, {
|
||||
left: ['10px', '20px']
|
||||
}, { composite: composite });
|
||||
|
@ -104,13 +102,13 @@ test(function(t) {
|
|||
}, 'composite value is absent if the composite operation specified on the ' +
|
||||
'keyframe effect is being used');
|
||||
|
||||
gKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(target, subtest.input);
|
||||
assert_frame_lists_equal(effect.getKeyframes(), subtest.output);
|
||||
}, `A KeyframeEffectReadOnly can be constructed with ${subtest.desc}`);
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(target, subtest.input);
|
||||
const secondEffect =
|
||||
new KeyframeEffectReadOnly(target, effect.getKeyframes());
|
||||
|
@ -119,15 +117,15 @@ gKeyframesTests.forEach(function(subtest) {
|
|||
}, `A KeyframeEffectReadOnly constructed with ${subtest.desc} roundtrips`);
|
||||
});
|
||||
|
||||
gInvalidKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
assert_throws(new TypeError, function() {
|
||||
gInvalidKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target, subtest.input);
|
||||
});
|
||||
}, `KeyframeEffectReadOnly constructor throws with ${subtest.desc}`);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ['10px', '20px'] });
|
||||
|
||||
|
@ -147,8 +145,8 @@ test(function(t) {
|
|||
}, 'A KeyframeEffectReadOnly constructed without any ' +
|
||||
'KeyframeEffectOptions object');
|
||||
|
||||
gKeyframeEffectOptionTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gKeyframeEffectOptionTests.forEach(subtest => {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ['10px', '20px'] },
|
||||
subtest.input);
|
||||
|
@ -174,9 +172,9 @@ gKeyframeEffectOptionTests.forEach(function(subtest) {
|
|||
}, `A KeyframeEffectReadOnly constructed by ${subtest.desc}`);
|
||||
});
|
||||
|
||||
gInvalidKeyframeEffectOptionTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
assert_throws(new TypeError, function() {
|
||||
gInvalidKeyframeEffectOptionTests.forEach(subtest => {
|
||||
test(t => {
|
||||
assert_throws(new TypeError, () => {
|
||||
new KeyframeEffectReadOnly(target,
|
||||
{ left: ['10px', '20px'] },
|
||||
subtest.input);
|
||||
|
@ -184,7 +182,7 @@ gInvalidKeyframeEffectOptionTests.forEach(function(subtest) {
|
|||
}, `Invalid KeyframeEffectReadOnly option by ${subtest.desc}`);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(null,
|
||||
{ left: ['10px', '20px'] },
|
||||
{ duration: 100 * MS_PER_SEC,
|
||||
|
@ -193,10 +191,10 @@ test(function(t) {
|
|||
'Effect created with null target has correct target');
|
||||
}, 'A KeyframeEffectReadOnly constructed with null target');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const test_error = { name: 'test' };
|
||||
|
||||
assert_throws(test_error, function() {
|
||||
assert_throws(test_error, () => {
|
||||
new KeyframeEffect(target, { get left() { throw test_error }})
|
||||
});
|
||||
}, 'KeyframeEffect constructor propagates exceptions generated by accessing'
|
||||
|
|
|
@ -13,13 +13,13 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(createDiv(t), null);
|
||||
const copiedEffect = new KeyframeEffectReadOnly(effect);
|
||||
assert_equals(copiedEffect.target, effect.target, 'same target');
|
||||
}, 'Copied KeyframeEffectReadOnly has the same target');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect =
|
||||
new KeyframeEffectReadOnly(null,
|
||||
[ { marginLeft: '0px' },
|
||||
|
@ -52,7 +52,7 @@ test(function(t) {
|
|||
}
|
||||
}, 'Copied KeyframeEffectReadOnly has the same keyframes');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect =
|
||||
new KeyframeEffectReadOnly(null, null,
|
||||
{ iterationComposite: 'accumulate' });
|
||||
|
@ -64,7 +64,7 @@ test(function(t) {
|
|||
'same compositeOperation');
|
||||
}, 'Copied KeyframeEffectReadOnly has the same KeyframeEffectOptions');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(null, null,
|
||||
{ duration: 100 * MS_PER_SEC,
|
||||
delay: -1 * MS_PER_SEC,
|
||||
|
@ -90,7 +90,7 @@ test(function(t) {
|
|||
assert_equals(timingA.easing, timingB.easing, 'same easing');
|
||||
}, 'Copied KeyframeEffectReadOnly has the same timing content');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const effect = new KeyframeEffectReadOnly(createDiv(t), null);
|
||||
assert_equals(effect.constructor.name, 'KeyframeEffectReadOnly');
|
||||
assert_equals(effect.timing.constructor.name,
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
var target = document.getElementById("target");
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ["10px", "20px"] });
|
||||
|
||||
|
@ -69,15 +69,15 @@ var gGetComputedTimingTests = [
|
|||
expected: { fill: "forwards" } }
|
||||
];
|
||||
|
||||
gGetComputedTimingTests.forEach(function(stest) {
|
||||
test(function(t) {
|
||||
gGetComputedTimingTests.forEach(stest => {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ["10px", "20px"] },
|
||||
stest.input);
|
||||
|
||||
// Helper function to provide default expected values when the test does
|
||||
// not supply them.
|
||||
var expected = function(field, defaultValue) {
|
||||
var expected = (field, defaultValue) => {
|
||||
return field in stest.expected ? stest.expected[field] : defaultValue;
|
||||
};
|
||||
|
||||
|
@ -142,8 +142,8 @@ var gActiveDurationTests = [
|
|||
expected: Infinity },
|
||||
];
|
||||
|
||||
gActiveDurationTests.forEach(function(stest) {
|
||||
test(function(t) {
|
||||
gActiveDurationTests.forEach(stest => {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ["10px", "20px"] },
|
||||
stest.input);
|
||||
|
@ -194,8 +194,8 @@ var gEndTimeTests = [
|
|||
expected: 0 }
|
||||
];
|
||||
|
||||
gEndTimeTests.forEach(function(stest) {
|
||||
test(function(t) {
|
||||
gEndTimeTests.forEach(stest => {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffectReadOnly(target,
|
||||
{ left: ["10px", "20px"] },
|
||||
stest.input);
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ alignContent: ['flex-start', 'flex-end'] },
|
||||
|
@ -29,7 +29,7 @@ test(function(t) {
|
|||
'Animated align-content style at 50s of the third iteration');
|
||||
}, 'iterationComposite of discrete type animation (align-content)');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ marginLeft: ['0px', '10px'] },
|
||||
|
@ -50,7 +50,7 @@ test(function(t) {
|
|||
'Animated margin-left style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <length> type animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var parent = createDiv(t);
|
||||
parent.style.width = '100px';
|
||||
var div = createDiv(t);
|
||||
|
@ -75,7 +75,7 @@ test(function(t) {
|
|||
'Animated width style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <percentage> type animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ color: ['rgb(0, 0, 0)', 'rgb(120, 120, 120)'] },
|
||||
|
@ -96,7 +96,7 @@ test(function(t) {
|
|||
'Animated color style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <color> type animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ color: ['rgb(0, 120, 0)', 'rgb(60, 60, 60)'] },
|
||||
|
@ -119,7 +119,7 @@ test(function(t) {
|
|||
}, 'iterationComposite of <color> type animation that green component is ' +
|
||||
'decreasing');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ flexGrow: [0, 10] },
|
||||
|
@ -140,7 +140,7 @@ test(function(t) {
|
|||
'Animated flex-grow style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <number> type animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.position = 'absolute';
|
||||
var anim =
|
||||
|
@ -163,7 +163,7 @@ test(function(t) {
|
|||
'Animated clip style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <shape> type animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ width: ['calc(0vw + 0px)', 'calc(0vw + 10px)'] },
|
||||
|
@ -184,7 +184,7 @@ test(function(t) {
|
|||
'Animated calc width style at 50s of the third iteration');
|
||||
}, 'iterationComposite of <calc()> value animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var parent = createDiv(t);
|
||||
parent.style.width = '100px';
|
||||
var div = createDiv(t);
|
||||
|
@ -213,7 +213,7 @@ test(function(t) {
|
|||
}, 'iterationComposite of <calc()> value animation that the values can\'t' +
|
||||
'be reduced');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ opacity: [0, 0.4] },
|
||||
|
@ -234,7 +234,7 @@ test(function(t) {
|
|||
'Animated opacity style at 50s of the third iteration');
|
||||
}, 'iterationComposite of opacity animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ boxShadow: ['rgb(0, 0, 0) 0px 0px 0px 0px',
|
||||
|
@ -259,7 +259,7 @@ test(function(t) {
|
|||
'Animated box-shadow style at 50s of the third iteration');
|
||||
}, 'iterationComposite of box-shadow animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['blur(0px)', 'blur(10px)'] },
|
||||
|
@ -280,7 +280,7 @@ test(function(t) {
|
|||
'Animated filter blur style at 50s of the third iteration');
|
||||
}, 'iterationComposite of filter blur animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['brightness(1)',
|
||||
|
@ -305,7 +305,7 @@ test(function(t) {
|
|||
'Animated filter brightness style at 50s of the third iteration');
|
||||
}, 'iterationComposite of filter brightness for different unit animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['brightness(0)',
|
||||
|
@ -330,7 +330,7 @@ test(function(t) {
|
|||
'Animated filter brightness style at 50s of the third iteration');
|
||||
}, 'iterationComposite of filter brightness animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['drop-shadow(rgb(0, 0, 0) 0px 0px 0px)',
|
||||
|
@ -355,7 +355,7 @@ test(function(t) {
|
|||
'Animated filter drop-shadow style at 50s of the third iteration');
|
||||
}, 'iterationComposite of filter drop-shadow animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['brightness(1) contrast(1)',
|
||||
|
@ -380,7 +380,7 @@ test(function(t) {
|
|||
'Animated filter list at 50s of the third iteration');
|
||||
}, 'iterationComposite of same filter list animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['brightness(1) contrast(1)',
|
||||
|
@ -411,7 +411,7 @@ test(function(t) {
|
|||
}, 'iterationComposite of discrete filter list because of mismatch ' +
|
||||
'of the order');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ filter: ['sepia(0)',
|
||||
|
@ -436,7 +436,7 @@ test(function(t) {
|
|||
'Animated filter list at 50s of the third iteration');
|
||||
}, 'iterationComposite of different length filter list animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['rotate(0deg)', 'rotate(180deg)'] },
|
||||
|
@ -460,7 +460,7 @@ test(function(t) {
|
|||
'Animated transform(rotate) style at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform(rotate) animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['scale(0)', 'scale(1)'] },
|
||||
|
@ -486,7 +486,7 @@ test(function(t) {
|
|||
'Animated transform(scale) style at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform: [ scale(0), scale(1) ] animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['scale(1)', 'scale(2)'] },
|
||||
|
@ -510,7 +510,7 @@ test(function(t) {
|
|||
'Animated transform(scale) style at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform: [ scale(1), scale(2) ] animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['scale(0)', 'scale(2)'] },
|
||||
|
@ -534,7 +534,7 @@ test(function(t) {
|
|||
'Animated transform(scale) style at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform: scale(2) animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['rotate(0deg) translateX(0px)',
|
||||
|
@ -559,7 +559,7 @@ test(function(t) {
|
|||
'Animated transform list at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform list animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['matrix(2, 0, 0, 2, 0, 0)',
|
||||
|
@ -588,7 +588,7 @@ test(function(t) {
|
|||
'Animated transform of matrix function at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform of matrix function');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['translateX(0px) scale(2)',
|
||||
|
@ -620,7 +620,7 @@ test(function(t) {
|
|||
'Animated transform list at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform list animation whose order is mismatched');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
// Even if each transform list does not have functions which exist in
|
||||
// other pair of the list, we don't fill any missing functions at all.
|
||||
|
@ -656,7 +656,7 @@ test(function(t) {
|
|||
}, 'iterationComposite of transform list animation whose order is mismatched ' +
|
||||
'because of missing functions');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['none',
|
||||
|
@ -684,7 +684,7 @@ test(function(t) {
|
|||
'Animated transform list at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform from none to translate');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['matrix3d(1, 0, 0, 0, ' +
|
||||
|
@ -718,7 +718,7 @@ test(function(t) {
|
|||
'Animated transform of matrix3d function at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform of matrix3d function');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ transform: ['rotate3d(1, 1, 0, 0deg)',
|
||||
|
@ -743,7 +743,7 @@ test(function(t) {
|
|||
'Animated transform of rotate3d function at 50s of the third iteration');
|
||||
}, 'iterationComposite of transform of rotate3d function');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ marginLeft: ['10px', '20px'] },
|
||||
|
@ -764,7 +764,7 @@ test(function(t) {
|
|||
'Animated margin-left style at 50s of the third iteration');
|
||||
}, 'iterationComposite starts with non-zero value animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim =
|
||||
div.animate({ marginLeft: ['10px', '-10px'] },
|
||||
|
@ -788,7 +788,7 @@ test(function(t) {
|
|||
'Animated margin-left style at 50s of the third iteration');
|
||||
}, 'iterationComposite with negative final value animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ marginLeft: ['0px', '10px'] },
|
||||
{ duration: 100 * MS_PER_SEC,
|
||||
|
@ -811,7 +811,7 @@ test(function(t) {
|
|||
'Animated style at 50s of the third iteration');
|
||||
}, 'interationComposite changes');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ marginLeft: ['0px', '10px'] },
|
||||
{ duration: 100 * MS_PER_SEC,
|
||||
|
|
|
@ -15,26 +15,26 @@
|
|||
|
||||
var target = document.getElementById('target');
|
||||
|
||||
test(function(t) {
|
||||
gEmptyKeyframeListTests.forEach(function(frame) {
|
||||
test(t => {
|
||||
gEmptyKeyframeListTests.forEach(frame => {
|
||||
var effect = new KeyframeEffect(target, {});
|
||||
effect.setKeyframes(frame);
|
||||
assert_frame_lists_equal(effect.getKeyframes(), []);
|
||||
});
|
||||
}, 'Keyframes can be replaced with an empty keyframe');
|
||||
|
||||
gKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffect(target, {});
|
||||
effect.setKeyframes(subtest.input);
|
||||
assert_frame_lists_equal(effect.getKeyframes(), subtest.output);
|
||||
}, 'Keyframes can be replaced with ' + subtest.desc);
|
||||
});
|
||||
|
||||
gInvalidKeyframesTests.forEach(function(subtest) {
|
||||
test(function(t) {
|
||||
gInvalidKeyframesTests.forEach(subtest => {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffect(target, {});
|
||||
assert_throws(new TypeError, function() {
|
||||
assert_throws(new TypeError, () => {
|
||||
effect.setKeyframes(subtest.input);
|
||||
});
|
||||
}, 'KeyframeEffect constructor throws with ' + subtest.desc);
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
var gKeyFrames = { 'marginLeft': ['0px', '100px'] };
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var effect = new KeyframeEffect(null, gKeyFrames, 100 * MS_PER_SEC);
|
||||
effect.target = div;
|
||||
|
@ -26,7 +26,7 @@ test(function(t) {
|
|||
'Value at 50% progress');
|
||||
}, 'Test setting target before constructing the associated animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var effect = new KeyframeEffect(null, gKeyFrames, 100 * MS_PER_SEC);
|
||||
|
@ -41,7 +41,7 @@ test(function(t) {
|
|||
'Value at 50% progress after setting new target');
|
||||
}, 'Test setting target from null to a valid target');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
div.style.marginLeft = '10px';
|
||||
var anim = div.animate(gKeyFrames, 100 * MS_PER_SEC);
|
||||
|
@ -55,7 +55,7 @@ test(function(t) {
|
|||
'Value after clearing the target')
|
||||
}, 'Test setting target from a valid target to null');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var a = createDiv(t);
|
||||
var b = createDiv(t);
|
||||
a.style.marginLeft = '10px';
|
||||
|
|
|
@ -20,9 +20,9 @@ var TIME_PRECISION = 0.0005; // ms
|
|||
// Allow implementations to substitute an alternative method for comparing
|
||||
// times based on their precision requirements.
|
||||
if (!window.assert_times_equal) {
|
||||
window.assert_times_equal = function(actual, expected, description) {
|
||||
window.assert_times_equal = (actual, expected, description) => {
|
||||
assert_approx_equals(actual, expected, TIME_PRECISION, description);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// creates div element, appends it to the document body and
|
||||
|
@ -40,7 +40,7 @@ function createElement(test, tagName, doc) {
|
|||
}
|
||||
var element = doc.createElement(tagName || 'div');
|
||||
doc.body.appendChild(element);
|
||||
test.add_cleanup(function() {
|
||||
test.add_cleanup(() => {
|
||||
element.remove();
|
||||
});
|
||||
return element;
|
||||
|
@ -70,7 +70,7 @@ function createStyle(test, rules, doc) {
|
|||
sheet.cssRules.length);
|
||||
}
|
||||
}
|
||||
test.add_cleanup(function() {
|
||||
test.add_cleanup(() => {
|
||||
extraStyle.remove();
|
||||
});
|
||||
}
|
||||
|
@ -93,17 +93,17 @@ function createPseudo(test, type) {
|
|||
|
||||
// Cubic bezier with control points (0, 0), (x1, y1), (x2, y2), and (1, 1).
|
||||
function cubicBezier(x1, y1, x2, y2) {
|
||||
function xForT(t) {
|
||||
const xForT = t => {
|
||||
var omt = 1-t;
|
||||
return 3 * omt * omt * t * x1 + 3 * omt * t * t * x2 + t * t * t;
|
||||
}
|
||||
};
|
||||
|
||||
function yForT(t) {
|
||||
const yForT = t => {
|
||||
var omt = 1-t;
|
||||
return 3 * omt * omt * t * y1 + 3 * omt * t * t * y2 + t * t * t;
|
||||
}
|
||||
};
|
||||
|
||||
function tForX(x) {
|
||||
const tForX = x => {
|
||||
// Binary subdivision.
|
||||
var mint = 0, maxt = 1;
|
||||
for (var i = 0; i < 30; ++i) {
|
||||
|
@ -116,9 +116,9 @@ function cubicBezier(x1, y1, x2, y2) {
|
|||
}
|
||||
}
|
||||
return (mint + maxt) / 2;
|
||||
}
|
||||
};
|
||||
|
||||
return function bezierClosure(x) {
|
||||
return x => {
|
||||
if (x == 0) {
|
||||
return 0;
|
||||
}
|
||||
|
@ -126,31 +126,29 @@ function cubicBezier(x1, y1, x2, y2) {
|
|||
return 1;
|
||||
}
|
||||
return yForT(tForX(x));
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function stepEnd(nsteps) {
|
||||
return function stepEndClosure(x) {
|
||||
return Math.floor(x * nsteps) / nsteps;
|
||||
}
|
||||
return x => Math.floor(x * nsteps) / nsteps;
|
||||
}
|
||||
|
||||
function stepStart(nsteps) {
|
||||
return function stepStartClosure(x) {
|
||||
return x => {
|
||||
var result = Math.floor(x * nsteps + 1.0) / nsteps;
|
||||
return (result > 1.0) ? 1.0 : result;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function framesTiming(nframes) {
|
||||
return function framesClosure(x) {
|
||||
return x => {
|
||||
var result = Math.floor(x * nframes) / (nframes - 1);
|
||||
return (result > 1.0 && x <= 1.0) ? 1.0 : result;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function waitForAnimationFrames(frameCount) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
return new Promise(resolve => {
|
||||
function handleFrame() {
|
||||
if (--frameCount <= 0) {
|
||||
resolve();
|
||||
|
@ -167,7 +165,7 @@ function waitForAnimationFrames(frameCount) {
|
|||
// wall-clock time).
|
||||
function waitForAnimationFramesWithDelay(minDelay) {
|
||||
var startTime = document.timeline.currentTime;
|
||||
return new Promise(function(resolve) {
|
||||
return new Promise(resolve => {
|
||||
(function handleFrame() {
|
||||
if (document.timeline.currentTime - startTime >= minDelay) {
|
||||
resolve();
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var tests = [ { fill: 'none', progress: null },
|
||||
{ fill: 'backwards', progress: 0 },
|
||||
{ fill: 'forwards', progress: null },
|
||||
{ fill: 'both', progress: 0 } ];
|
||||
tests.forEach(function(test) {
|
||||
tests.forEach(test => {
|
||||
var anim = createDiv(t).animate(null, { delay: 1, fill: test.fill });
|
||||
assert_equals(anim.effect.getComputedTiming().progress, test.progress,
|
||||
'Progress in before phase when using \'' + test.fill
|
||||
|
@ -23,36 +23,36 @@ test(function(t) {
|
|||
});
|
||||
}, 'Active time in before phase');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, 1000);
|
||||
anim.currentTime = 500;
|
||||
assert_times_equal(anim.effect.getComputedTiming().progress, 0.5);
|
||||
}, 'Active time in active phase and no start delay is the local time');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000, delay: 500 });
|
||||
anim.currentTime = 1000;
|
||||
assert_times_equal(anim.effect.getComputedTiming().progress, 0.5);
|
||||
}, 'Active time in active phase and positive start delay is the local time'
|
||||
+ ' minus the start delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000, delay: -500 });
|
||||
assert_times_equal(anim.effect.getComputedTiming().progress, 0.5);
|
||||
}, 'Active time in active phase and negative start delay is the local time'
|
||||
+ ' minus the start delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null);
|
||||
assert_equals(anim.effect.getComputedTiming().progress, null);
|
||||
}, 'Active time in after phase with no fill is unresolved');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { fill: 'backwards' });
|
||||
assert_equals(anim.effect.getComputedTiming().progress, null);
|
||||
}, 'Active time in after phase with backwards-only fill is unresolved');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500, // Should have no effect
|
||||
|
@ -62,7 +62,7 @@ test(function(t) {
|
|||
assert_times_equal(anim.effect.getComputedTiming().progress, 0.3);
|
||||
}, 'Active time in after phase with forwards fill is the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 0,
|
||||
iterations: Infinity,
|
||||
fill: 'forwards' });
|
||||
|
@ -72,7 +72,7 @@ test(function(t) {
|
|||
}, 'Active time in after phase with forwards fill, zero-duration, and '
|
||||
+ ' infinite iteration count is the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500,
|
||||
|
@ -84,7 +84,7 @@ test(function(t) {
|
|||
}, 'Active time in after phase with forwards fill and positive end delay'
|
||||
+ ' is the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500,
|
||||
|
@ -96,7 +96,7 @@ test(function(t) {
|
|||
}, 'Active time in after phase with forwards fill and negative end delay'
|
||||
+ ' is the active duration + end delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500,
|
||||
|
@ -108,7 +108,7 @@ test(function(t) {
|
|||
}, 'Active time in after phase with forwards fill and negative end delay'
|
||||
+ ' greater in magnitude than the active duration is zero');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500,
|
||||
|
@ -121,7 +121,7 @@ test(function(t) {
|
|||
+ ' greater in magnitude than the sum of the active duration and start delay'
|
||||
+ ' is zero');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, { duration: 1000,
|
||||
iterations: 2.3,
|
||||
delay: 500,
|
||||
|
@ -131,7 +131,7 @@ test(function(t) {
|
|||
assert_times_equal(anim.effect.getComputedTiming().progress, 0.3);
|
||||
}, 'Active time in after phase with \'both\' fill is the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
// Create an effect with a non-zero duration so we ensure we're not just
|
||||
// testing the after-phase behavior.
|
||||
var effect = new KeyframeEffect(null, null, 1);
|
||||
|
|
|
@ -38,11 +38,11 @@ function runTests(tests, description) {
|
|||
}
|
||||
}
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, { delay: 1 });
|
||||
assert_equals(anim.effect.getComputedTiming().currentIteration, null);
|
||||
anim.finished.then(t.step_func(function() {
|
||||
anim.finished.then(t.step_func(() => {
|
||||
assert_equals(anim.effect.getComputedTiming().currentIteration, null);
|
||||
t.done();
|
||||
}));
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, 10 * MS_PER_SEC);
|
||||
for (var seconds of [-1, 0, 5, 10, 20]) {
|
||||
anim.currentTime = seconds * MS_PER_SEC;
|
||||
|
@ -17,7 +17,7 @@ test(function(t) {
|
|||
}
|
||||
}, 'Local time is current time for animation effects associated with an animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var effect = new KeyframeEffect(createDiv(t), null, 10 * MS_PER_SEC);
|
||||
assert_equals(effect.getComputedTiming().localTime, null);
|
||||
}, 'Local time is unresolved for animation effects not associated with an animation');
|
||||
|
|
|
@ -47,89 +47,89 @@ function assert_phase_at_time(animation, phase, currentTime) {
|
|||
}
|
||||
}
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
|
||||
[ { currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'active' },
|
||||
{ currentTime: 1, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for a simple animation effect');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1, delay: 1 });
|
||||
|
||||
[ { currentTime: 0, phase: 'before' },
|
||||
{ currentTime: 1, phase: 'active' },
|
||||
{ currentTime: 2, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a positive start delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1, delay: -1 });
|
||||
|
||||
[ { currentTime: -2, phase: 'before' },
|
||||
{ currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative start delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1, endDelay: 1 });
|
||||
|
||||
[ { currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'active' },
|
||||
{ currentTime: 1, phase: 'after' },
|
||||
{ currentTime: 2, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a positive end delay');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 2, endDelay: -1 });
|
||||
|
||||
[ { currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'active' },
|
||||
{ currentTime: 0.9, phase: 'active' },
|
||||
{ currentTime: 1, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative end delay lesser'
|
||||
+ ' in magnitude than the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1, endDelay: -1 });
|
||||
|
||||
[ { currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'after' },
|
||||
{ currentTime: 1, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative end delay equal'
|
||||
+ ' in magnitude to the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1, endDelay: -2 });
|
||||
|
||||
[ { currentTime: -2, phase: 'before' },
|
||||
{ currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative end delay'
|
||||
+ ' greater in magnitude than the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 2,
|
||||
delay: 1,
|
||||
endDelay: -1 });
|
||||
|
@ -137,13 +137,13 @@ test(function(t) {
|
|||
[ { currentTime: 0, phase: 'before' },
|
||||
{ currentTime: 1, phase: 'active' },
|
||||
{ currentTime: 2, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a positive start delay'
|
||||
+ ' and a negative end delay lesser in magnitude than the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1,
|
||||
delay: -1,
|
||||
endDelay: -1 });
|
||||
|
@ -151,13 +151,13 @@ test(function(t) {
|
|||
[ { currentTime: -2, phase: 'before' },
|
||||
{ currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative start delay'
|
||||
+ ' and a negative end delay equal in magnitude to the active duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, { duration: 1,
|
||||
delay: -1,
|
||||
endDelay: -2 });
|
||||
|
@ -166,14 +166,14 @@ test(function(t) {
|
|||
{ currentTime: -2, phase: 'before' },
|
||||
{ currentTime: -1, phase: 'before' },
|
||||
{ currentTime: 0, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for an animation effect with a negative start delay'
|
||||
+ ' and a negative end delay equal greater in magnitude than the active'
|
||||
+ ' duration');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
animation.playbackRate = -1;
|
||||
|
||||
|
@ -181,7 +181,7 @@ test(function(t) {
|
|||
{ currentTime: 0, phase: 'before' },
|
||||
{ currentTime: 1, phase: 'active' },
|
||||
{ currentTime: 2, phase: 'after' } ]
|
||||
.forEach(function(test) {
|
||||
.forEach(test => {
|
||||
assert_phase_at_time(animation, test.phase, test.currentTime);
|
||||
});
|
||||
}, 'Phase calculation for a simple animation effect with negative playback'
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
const retPromise = animation.ready.then(() => {
|
||||
assert_unreached('ready promise was fulfilled');
|
||||
|
@ -26,12 +26,12 @@ promise_test(function(t) {
|
|||
}, 'A play-pending ready promise should be rejected when the animation is'
|
||||
+ ' canceled');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return animation.ready.then(() => {
|
||||
animation.pause();
|
||||
// Set up listeners on pause-pending ready promise
|
||||
var retPromise = animation.ready.then(function() {
|
||||
var retPromise = animation.ready.then(() => {
|
||||
assert_unreached('ready promise was fulfilled');
|
||||
}).catch(err => {
|
||||
assert_equals(err.name, 'AbortError',
|
||||
|
@ -43,15 +43,15 @@ promise_test(function(t) {
|
|||
}, 'A pause-pending ready promise should be rejected when the animation is'
|
||||
+ ' canceled');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null);
|
||||
animation.cancel();
|
||||
return animation.ready.then(function(p) {
|
||||
return animation.ready.then(p => {
|
||||
assert_equals(p, animation);
|
||||
});
|
||||
}, 'When an animation is canceled, it should create a resolved Promise');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const animation = createDiv(t).animate(null);
|
||||
const promise = animation.ready;
|
||||
animation.cancel();
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -21,12 +21,12 @@ test(function(t) {
|
|||
'state');
|
||||
}, 'The current time returns the hold time when set');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.currentTime, null);
|
||||
});
|
||||
}, 'The current time is unresolved when there is no associated timeline ' +
|
||||
|
@ -35,7 +35,7 @@ promise_test(function(t) {
|
|||
// FIXME: Test that the current time is unresolved when we have an inactive
|
||||
// timeline if we find a way of creating an inactive timeline!
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -45,7 +45,7 @@ test(function(t) {
|
|||
}, 'The current time is unresolved when the start time is unresolved ' +
|
||||
'(and no hold time is set)');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -62,13 +62,12 @@ test(function(t) {
|
|||
}, 'The current time is calculated from the timeline time, start time and ' +
|
||||
'playback rate');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 0;
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
return animation.ready.then(() => waitForAnimationFrames(1))
|
||||
.then(() => {
|
||||
assert_times_equal(animation.currentTime, 0);
|
||||
});
|
||||
}, 'The current time does not progress if playback rate is 0');
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
const promise = animation.ready;
|
||||
let readyResolved = false;
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
const promise = animation.ready;
|
||||
animation.pause();
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.currentTime = 1 * MS_PER_SEC;
|
||||
assert_times_equal(animation.currentTime, 1 * MS_PER_SEC);
|
||||
|
@ -19,7 +19,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.currentTime, 1 * MS_PER_SEC);
|
||||
}, 'Playing a running animation leaves the current time unchanged');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.finish();
|
||||
assert_times_equal(animation.currentTime, 100 * MS_PER_SEC);
|
||||
|
@ -27,7 +27,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.currentTime, 0);
|
||||
}, 'Playing a finished animation seeks back to the start');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = -1;
|
||||
animation.currentTime = 0;
|
||||
|
@ -36,7 +36,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.currentTime, 100 * MS_PER_SEC);
|
||||
}, 'Playing a finished and reversed animation seeks to end');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
animation.cancel();
|
||||
const promise = animation.ready;
|
||||
|
@ -45,7 +45,7 @@ test(function(t) {
|
|||
}, 'The ready promise should be replaced if the animation is not already'
|
||||
+ ' pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
const promise = animation.ready;
|
||||
return promise.then(p => {
|
||||
|
|
|
@ -11,14 +11,14 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
|
||||
// Wait a frame because if currentTime is still 0 when we call
|
||||
// reverse(), it will throw (per spec).
|
||||
return animation.ready.then(waitForAnimationFrames(1)).then(function() {
|
||||
return animation.ready.then(waitForAnimationFrames(1)).then(() => {
|
||||
assert_greater_than_equal(animation.currentTime, 0,
|
||||
'currentTime expected to be greater than 0, one frame after starting');
|
||||
animation.currentTime = 50 * MS_PER_SEC;
|
||||
|
@ -29,23 +29,23 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Reversing an animation inverts the playback rate');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
animation.currentTime = 50 * MS_PER_SEC;
|
||||
animation.pause();
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.reverse();
|
||||
return animation.ready;
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(animation.playState, 'running',
|
||||
'Animation.playState should be "running" after reverse()');
|
||||
});
|
||||
}, 'Reversing an animation plays a pausing animation');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.currentTime = 50 * MS_PER_SEC;
|
||||
|
@ -56,7 +56,7 @@ test(function(t) {
|
|||
'the animation duration');
|
||||
}, 'Reversing an animation maintains the same current time');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, { duration: 200 * MS_PER_SEC,
|
||||
delay: -100 * MS_PER_SEC });
|
||||
|
@ -69,7 +69,7 @@ test(function(t) {
|
|||
'The playState is still pending after calling reverse');
|
||||
}, 'Reversing an animation does not cause it to leave the pending state');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, { duration: 200 * MS_PER_SEC,
|
||||
delay: -100 * MS_PER_SEC });
|
||||
|
@ -84,7 +84,7 @@ promise_test(function(t) {
|
|||
});
|
||||
}, 'Reversing an animation does not cause it to resolve the ready promise');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.currentTime = 200 * MS_PER_SEC;
|
||||
|
@ -96,7 +96,7 @@ test(function(t) {
|
|||
}, 'Reversing an animation when playbackRate > 0 and currentTime > ' +
|
||||
'effect end should make it play from the end');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
|
||||
|
@ -109,7 +109,7 @@ test(function(t) {
|
|||
}, 'Reversing an animation when playbackRate > 0 and currentTime < 0 ' +
|
||||
'should make it play from the end');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = -1;
|
||||
|
@ -122,7 +122,7 @@ test(function(t) {
|
|||
}, 'Reversing an animation when playbackRate < 0 and currentTime < 0 ' +
|
||||
'should make it play from the start');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = -1;
|
||||
|
@ -135,21 +135,21 @@ test(function(t) {
|
|||
}, 'Reversing an animation when playbackRate < 0 and currentTime > effect ' +
|
||||
'end should make it play from the start');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
animation.currentTime = -200 * MS_PER_SEC;
|
||||
|
||||
assert_throws('InvalidStateError',
|
||||
function () { animation.reverse(); },
|
||||
() => { animation.reverse(); },
|
||||
'reverse() should throw InvalidStateError ' +
|
||||
'if the playbackRate > 0 and the currentTime < 0 ' +
|
||||
'and the target effect is positive infinity');
|
||||
}, 'Reversing an animation when playbackRate > 0 and currentTime < 0 ' +
|
||||
'and the target effect end is positive infinity should throw an exception');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate({}, { duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity });
|
||||
animation.currentTime = -200 * MS_PER_SEC;
|
||||
|
@ -159,7 +159,7 @@ test(function(t) {
|
|||
assert_equals(animation.playbackRate, 1, 'playbackRate remains unchanged');
|
||||
}, 'When reversing throws an exception, the playback rate remains unchanged');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
|
@ -175,7 +175,7 @@ test(function(t) {
|
|||
'and the target effect end is positive infinity should NOT throw an ' +
|
||||
'exception');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, {duration: 100 * MS_PER_SEC,
|
||||
iterations: Infinity});
|
||||
|
@ -191,7 +191,7 @@ test(function(t) {
|
|||
'and the target effect end is positive infinity should make it play ' +
|
||||
'from the start');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation = div.animate({}, 100 * MS_PER_SEC);
|
||||
animation.playbackRate = 0;
|
||||
|
@ -206,12 +206,12 @@ test(function(t) {
|
|||
}, 'Reversing when when playbackRate == 0 should preserve the current ' +
|
||||
'time and playback rate');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var div = createDiv(t);
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(div, null, 100 * MS_PER_SEC), null);
|
||||
|
||||
assert_throws('InvalidStateError', function() { animation.reverse(); });
|
||||
assert_throws('InvalidStateError', () => { animation.reverse(); });
|
||||
}, 'Reversing an animation without an active timeline throws an ' +
|
||||
'InvalidStateError');
|
||||
|
||||
|
|
|
@ -10,8 +10,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
test(t => {
|
||||
// It should only be possible to set *either* the start time or the current
|
||||
// time for an animation that does not have an active timeline.
|
||||
|
||||
|
@ -41,8 +40,7 @@ test(function(t)
|
|||
|
||||
}, 'Setting the start time of an animation without an active timeline');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
test(t => {
|
||||
// Setting an unresolved start time on an animation without an active
|
||||
// timeline should not clear the current time.
|
||||
|
||||
|
@ -66,8 +64,7 @@ test(function(t)
|
|||
}, 'Setting an unresolved start time an animation without an active timeline'
|
||||
+ ' does not clear the current time');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -93,8 +90,7 @@ test(function(t)
|
|||
+ ' start time');
|
||||
}, 'Setting the start time clears the hold time');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -115,14 +111,13 @@ test(function(t)
|
|||
+ ' start time');
|
||||
}, 'Setting an unresolved start time sets the hold time');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
var readyPromiseCallbackCalled = false;
|
||||
animation.ready.then(function() { readyPromiseCallbackCalled = true; } );
|
||||
animation.ready.then(() => { readyPromiseCallbackCalled = true; } );
|
||||
|
||||
// Put the animation in the play-pending state
|
||||
animation.play();
|
||||
|
@ -139,20 +134,19 @@ promise_test(function(t)
|
|||
|
||||
// If we schedule another microtask then it should run immediately after
|
||||
// the ready promise resolution microtask.
|
||||
return Promise.resolve().then(function() {
|
||||
return Promise.resolve().then(() => {
|
||||
assert_true(readyPromiseCallbackCalled,
|
||||
'Ready promise callback called after setting startTime');
|
||||
});
|
||||
}, 'Setting the start time resolves a pending ready promise');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
var readyPromiseCallbackCalled = false;
|
||||
animation.ready.then(function() { readyPromiseCallbackCalled = true; } );
|
||||
animation.ready.then(() => { readyPromiseCallbackCalled = true; } );
|
||||
|
||||
// Put the animation in the pause-pending state
|
||||
animation.startTime = document.timeline.currentTime;
|
||||
|
@ -168,14 +162,13 @@ promise_test(function(t)
|
|||
assert_false(readyPromiseCallbackCalled,
|
||||
'Ready promise callback is not called synchronously');
|
||||
|
||||
return Promise.resolve().then(function() {
|
||||
return Promise.resolve().then(() => {
|
||||
assert_true(readyPromiseCallbackCalled,
|
||||
'Ready promise callback called after setting startTime');
|
||||
});
|
||||
}, 'Setting the start time resolves a pending pause task');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -196,7 +189,7 @@ promise_test(function(t)
|
|||
// Furthermore, that time should persist if we have correctly updated
|
||||
// the hold time
|
||||
var finishedCurrentTime = animation.currentTime;
|
||||
return waitForAnimationFrames(1).then(function() {
|
||||
return waitForAnimationFrames(1).then(() => {
|
||||
assert_equals(animation.currentTime, finishedCurrentTime,
|
||||
'Current time does not change after seeking past the effect'
|
||||
+ ' end time by setting the current time');
|
||||
|
|
|
@ -10,14 +10,14 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate({ marginLeft: [ '0px', '100px' ] },
|
||||
100 * MS_PER_SEC);
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
||||
var retPromise = anim.ready.then(function() {
|
||||
var retPromise = anim.ready.then(() => {
|
||||
assert_unreached('ready promise is fulfilled');
|
||||
}).catch(function(err) {
|
||||
}).catch(err => {
|
||||
assert_equals(err.name, 'AbortError',
|
||||
'ready promise is rejected with AbortError');
|
||||
});
|
||||
|
@ -29,7 +29,7 @@ promise_test(function(t) {
|
|||
}, 'If new effect is null and old effect is not null, we reset the pending ' +
|
||||
'tasks and ready promise is rejected');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = new Animation();
|
||||
anim.pause();
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
@ -39,13 +39,13 @@ promise_test(function(t) {
|
|||
100 * MS_PER_SEC);
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
assert_equals(anim.playState, 'paused');
|
||||
});
|
||||
}, 'If animation has a pending pause task, reschedule that task to run ' +
|
||||
'as soon as animation is ready.');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = new Animation();
|
||||
anim.play();
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
@ -55,18 +55,18 @@ promise_test(function(t) {
|
|||
100 * MS_PER_SEC);
|
||||
assert_equals(anim.playState, 'pending');
|
||||
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
assert_equals(anim.playState, 'running');
|
||||
});
|
||||
}, 'If animation has a pending play task, reschedule that task to run ' +
|
||||
'as soon as animation is ready to play new effect.');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animA = createDiv(t).animate({ marginLeft: [ '0px', '100px' ] },
|
||||
100 * MS_PER_SEC);
|
||||
var animB = new Animation();
|
||||
|
||||
return animA.ready.then(function() {
|
||||
return animA.ready.then(() => {
|
||||
animB.effect = animA.effect;
|
||||
assert_equals(animA.effect, null);
|
||||
assert_equals(animA.playState, 'finished');
|
||||
|
@ -74,7 +74,7 @@ promise_test(function(t) {
|
|||
}, 'When setting the effect of an animation to the effect of an existing ' +
|
||||
'animation, the existing animation\'s target effect should be set to null.');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animA = createDiv(t).animate({ marginLeft: [ '0px', '100px' ] },
|
||||
100 * MS_PER_SEC);
|
||||
var animB = new Animation();
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
//
|
||||
// ---------------------------------------------------------------------
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -29,7 +29,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.currentTime, 50 * MS_PER_SEC);
|
||||
}, 'After setting timeline on paused animation it is still paused');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -43,7 +43,7 @@ test(function(t) {
|
|||
}, 'After setting timeline on animation paused outside active interval'
|
||||
+ ' it is still paused');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -55,7 +55,7 @@ test(function(t) {
|
|||
}, 'After setting timeline on an idle animation without a start time'
|
||||
+ ' it is still idle');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -68,7 +68,7 @@ test(function(t) {
|
|||
}, 'After setting timeline on an idle animation with a start time'
|
||||
+ ' it is running');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -81,7 +81,7 @@ test(function(t) {
|
|||
}, 'After setting timeline on an idle animation with a sufficiently ancient'
|
||||
+ ' start time it is finished');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -93,7 +93,7 @@ test(function(t) {
|
|||
assert_equals(animation.playState, 'pending');
|
||||
}, 'After setting timeline on a play-pending animation it is still pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -102,13 +102,13 @@ promise_test(function(t) {
|
|||
|
||||
animation.timeline = document.timeline;
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'running');
|
||||
});
|
||||
}, 'After setting timeline on a play-pending animation it begins playing'
|
||||
+ ' after pending');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -122,7 +122,7 @@ test(function(t) {
|
|||
assert_equals(animation.playState, 'pending');
|
||||
}, 'After setting timeline on a pause-pending animation it is still pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
null);
|
||||
|
@ -133,7 +133,7 @@ promise_test(function(t) {
|
|||
|
||||
animation.timeline = document.timeline;
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'paused');
|
||||
});
|
||||
}, 'After setting timeline on a pause-pending animation it becomes paused'
|
||||
|
@ -145,7 +145,7 @@ promise_test(function(t) {
|
|||
//
|
||||
// ---------------------------------------------------------------------
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -158,7 +158,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.currentTime, 50 * MS_PER_SEC);
|
||||
}, 'After clearing timeline on paused animation it is still paused');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -172,7 +172,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.startTime, initialStartTime);
|
||||
}, 'After clearing timeline on finished animation it is idle');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -186,7 +186,7 @@ test(function(t) {
|
|||
assert_times_equal(animation.startTime, initialStartTime);
|
||||
}, 'After clearing timeline on running animation it is idle');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -198,7 +198,7 @@ test(function(t) {
|
|||
assert_equals(animation.startTime, null);
|
||||
}, 'After clearing timeline on idle animation it is still idle');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
assert_equals(animation.playState, 'pending');
|
||||
|
||||
|
@ -207,7 +207,7 @@ test(function(t) {
|
|||
assert_equals(animation.playState, 'pending');
|
||||
}, 'After clearing timeline on play-pending animation it is still pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
assert_equals(animation.playState, 'pending');
|
||||
|
||||
|
@ -215,13 +215,13 @@ promise_test(function(t) {
|
|||
animation.timeline = document.timeline;
|
||||
|
||||
assert_equals(animation.playState, 'pending');
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'running');
|
||||
});
|
||||
}, 'After clearing and re-setting timeline on play-pending animation it'
|
||||
+ ' begins to play');
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -234,7 +234,7 @@ test(function(t) {
|
|||
assert_equals(animation.playState, 'pending');
|
||||
}, 'After clearing timeline on a pause-pending animation it is still pending');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -246,13 +246,13 @@ promise_test(function(t) {
|
|||
animation.timeline = document.timeline;
|
||||
|
||||
assert_equals(animation.playState, 'pending');
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'paused');
|
||||
});
|
||||
}, 'After clearing and re-setting timeline on a pause-pending animation it'
|
||||
+ ' becomes paused');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
@ -265,7 +265,7 @@ promise_test(function(t) {
|
|||
animation.timeline = document.timeline;
|
||||
assert_equals(animation.playState, 'pending');
|
||||
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
assert_equals(animation.playState, 'running');
|
||||
assert_times_equal(animation.startTime, initialStartTime);
|
||||
});
|
||||
|
|
|
@ -20,29 +20,29 @@
|
|||
// (Also the start time is resolved and there is pending task)
|
||||
|
||||
// Did seek = false
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
// Here and in the following tests we wait until ready resolves as
|
||||
// otherwise we don't have a resolved start time. We test the case
|
||||
// where the start time is unresolved in a subsequent test.
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
// Seek to 1ms before the target end and then wait 1ms
|
||||
anim.currentTime = 100 * MS_PER_SEC - 1;
|
||||
return waitForAnimationFramesWithDelay(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 100 * MS_PER_SEC,
|
||||
'Hold time is set to target end clamping current time');
|
||||
});
|
||||
}, 'Updating the finished state when playing past end');
|
||||
|
||||
// Did seek = true
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 200 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 200 * MS_PER_SEC,
|
||||
'Hold time is set so current time should NOT change');
|
||||
});
|
||||
|
@ -59,12 +59,12 @@ promise_test(function(t) {
|
|||
// (on the subsequent tick the hold time will be set to the same value anyway).
|
||||
|
||||
// Did seek = true
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 100 * MS_PER_SEC,
|
||||
'Hold time is set so current time should NOT change');
|
||||
});
|
||||
|
@ -75,29 +75,29 @@ promise_test(function(t) {
|
|||
// (Also the start time is resolved and there is pending task)
|
||||
|
||||
// Did seek = false
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = -1;
|
||||
anim.play(); // Make sure animation is not initially finished
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
// Seek to 1ms before 0 and then wait 1ms
|
||||
anim.currentTime = 1;
|
||||
return waitForAnimationFramesWithDelay(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 0 * MS_PER_SEC,
|
||||
'Hold time is set to zero clamping current time');
|
||||
});
|
||||
}, 'Updating the finished state when playing in reverse past zero');
|
||||
|
||||
// Did seek = true
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = -1;
|
||||
anim.play();
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = -100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, -100 * MS_PER_SEC,
|
||||
'Hold time is set so current time should NOT change');
|
||||
});
|
||||
|
@ -107,14 +107,14 @@ promise_test(function(t) {
|
|||
// it doesn't really matter.
|
||||
|
||||
// Did seek = true
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = -1;
|
||||
anim.play();
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 0;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 0 * MS_PER_SEC,
|
||||
'Hold time is set so current time should NOT change');
|
||||
});
|
||||
|
@ -126,30 +126,30 @@ promise_test(function(t) {
|
|||
// (Also the start time is resolved and there is pending task)
|
||||
|
||||
// Did seek = false; playback rate > 0
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
|
||||
// We want to test that the hold time is cleared so first we need to
|
||||
// put the animation in a state where the hold time is set.
|
||||
anim.finish();
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
assert_equals(anim.currentTime, 100 * MS_PER_SEC,
|
||||
'Hold time is initially set');
|
||||
// Then extend the duration so that the hold time is cleared and on
|
||||
// the next tick the current time will increase.
|
||||
anim.effect.timing.duration *= 2;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_greater_than(anim.currentTime, 100 * MS_PER_SEC,
|
||||
'Hold time is not set so current time should increase');
|
||||
});
|
||||
}, 'Updating the finished state when playing before end');
|
||||
|
||||
// Did seek = true; playback rate > 0
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.finish();
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 50 * MS_PER_SEC;
|
||||
// When did seek = true, updating the finished state: (i) updates
|
||||
// the animation's start time and (ii) clears the hold time.
|
||||
|
@ -157,7 +157,7 @@ promise_test(function(t) {
|
|||
// updated and then increases.
|
||||
assert_equals(anim.currentTime, 50 * MS_PER_SEC, 'Start time is updated');
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_greater_than(anim.currentTime, 50 * MS_PER_SEC,
|
||||
'Hold time is not set so current time should increase');
|
||||
});
|
||||
|
@ -177,14 +177,14 @@ promise_test(function(t) {
|
|||
// will set did seek = true).
|
||||
|
||||
// Did seek = true; playback rate < 0
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = -1;
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 50 * MS_PER_SEC;
|
||||
assert_equals(anim.currentTime, 50 * MS_PER_SEC, 'Start time is updated');
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_less_than(anim.currentTime, 50 * MS_PER_SEC,
|
||||
'Hold time is not set so current time should decrease');
|
||||
});
|
||||
|
@ -193,13 +193,13 @@ promise_test(function(t) {
|
|||
// CASE 4: playback rate == 0
|
||||
|
||||
// current time < 0
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = 0;
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = -100 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, -100 * MS_PER_SEC,
|
||||
'Hold time should not be cleared so current time should'
|
||||
+ ' NOT change');
|
||||
|
@ -208,13 +208,13 @@ promise_test(function(t) {
|
|||
+ ' current time is less than zero');
|
||||
|
||||
// current time < target end
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = 0;
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 50 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 50 * MS_PER_SEC,
|
||||
'Hold time should not be cleared so current time should'
|
||||
+ ' NOT change');
|
||||
|
@ -223,13 +223,13 @@ promise_test(function(t) {
|
|||
+ ' current time is less than end');
|
||||
|
||||
// current time > target end
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.playbackRate = 0;
|
||||
return anim.ready.then(function() {
|
||||
return anim.ready.then(() => {
|
||||
anim.currentTime = 200 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1);
|
||||
}).then(function() {
|
||||
}).then(() => {
|
||||
assert_equals(anim.currentTime, 200 * MS_PER_SEC,
|
||||
'Hold time should not be cleared so current time should'
|
||||
+ ' NOT change');
|
||||
|
@ -239,7 +239,7 @@ promise_test(function(t) {
|
|||
|
||||
// CASE 5: current time unresolved
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.cancel();
|
||||
// Trigger a change that will cause the "update the finished state"
|
||||
|
@ -251,7 +251,7 @@ promise_test(function(t) {
|
|||
// change to timing, but just in case an implementation defers that, let's
|
||||
// wait a frame and check that the hold time / start time has still not been
|
||||
// updated.
|
||||
return waitForAnimationFrames(1).then(function() {
|
||||
return waitForAnimationFrames(1).then(() => {
|
||||
assert_equals(anim.currentTime, null,
|
||||
'The animation hold time / start time should not be updated');
|
||||
});
|
||||
|
@ -259,7 +259,7 @@ promise_test(function(t) {
|
|||
|
||||
// CASE 6: has a pending task
|
||||
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.cancel();
|
||||
anim.currentTime = 75 * MS_PER_SEC;
|
||||
|
@ -278,7 +278,7 @@ test(function(t) {
|
|||
// CASE 7: start time unresolved
|
||||
|
||||
// Did seek = false
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.cancel();
|
||||
// Make it so that only the start time is unresolved (to avoid overlapping
|
||||
|
@ -287,7 +287,7 @@ promise_test(function(t) {
|
|||
// Trigger a change that will cause the "update the finished state"
|
||||
// procedure to run (did seek = false).
|
||||
anim.effect.timing.duration = 200 * MS_PER_SEC;
|
||||
return waitForAnimationFrames(1).then(function() {
|
||||
return waitForAnimationFrames(1).then(() => {
|
||||
assert_equals(anim.currentTime, 150 * MS_PER_SEC,
|
||||
'The animation hold time should not be updated');
|
||||
assert_equals(anim.startTime, null,
|
||||
|
@ -297,7 +297,7 @@ promise_test(function(t) {
|
|||
+ ' did seek = false');
|
||||
|
||||
// Did seek = true
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
var anim = createDiv(t).animate(null, 100 * MS_PER_SEC);
|
||||
anim.cancel();
|
||||
anim.currentTime = 150 * MS_PER_SEC;
|
||||
|
@ -318,13 +318,13 @@ test(function(t) {
|
|||
// --------------------------------------------------------------------
|
||||
|
||||
function waitForFinishEventAndPromise(animation) {
|
||||
var eventPromise = new Promise(function(resolve) {
|
||||
animation.onfinish = function() { resolve(); }
|
||||
var eventPromise = new Promise(resolve => {
|
||||
animation.onfinish = resolve;
|
||||
});
|
||||
return Promise.all([eventPromise, animation.finished]);
|
||||
}
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
animation.onfinish =
|
||||
t.unreached_func('Seeking to finish should not fire finish event');
|
||||
|
@ -337,24 +337,24 @@ promise_test(function(t) {
|
|||
}, 'Finish notification steps don\'t run when the animation seeks to finish'
|
||||
+ ' and then seeks back again');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
return waitForFinishEventAndPromise(animation);
|
||||
});
|
||||
}, 'Finish notification steps run when the animation completes normally');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
animation.currentTime = 10;
|
||||
return waitForFinishEventAndPromise(animation);
|
||||
});
|
||||
}, 'Finish notification steps run when the animation seeks past finish');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
return animation.ready.then(function() {
|
||||
return animation.ready.then(() => {
|
||||
// Register for notifications now since once we seek away from being
|
||||
// finished the 'finished' promise will be replaced.
|
||||
var finishNotificationSteps = waitForFinishEventAndPromise(animation);
|
||||
|
@ -366,41 +366,41 @@ promise_test(function(t) {
|
|||
}, 'Finish notification steps run when the animation completes with .finish(),'
|
||||
+ ' even if we then seek away');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
var initialFinishedPromise = animation.finished;
|
||||
|
||||
return animation.finished.then(function(target) {
|
||||
return animation.finished.then(target => {
|
||||
animation.currentTime = 0;
|
||||
assert_not_equals(initialFinishedPromise, animation.finished);
|
||||
});
|
||||
}, 'Animation finished promise is replaced after seeking back to start');
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
var initialFinishedPromise = animation.finished;
|
||||
|
||||
return animation.finished.then(function(target) {
|
||||
return animation.finished.then(target => {
|
||||
animation.play();
|
||||
assert_not_equals(initialFinishedPromise, animation.finished);
|
||||
});
|
||||
}, 'Animation finished promise is replaced after replaying from start');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
animation.currentTime = 0;
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
t.done();
|
||||
};
|
||||
};
|
||||
}, 'Animation finish event is fired again after seeking back to start');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
var animation = createDiv(t).animate(null, 1);
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
animation.play();
|
||||
animation.onfinish = function(event) {
|
||||
animation.onfinish = event => {
|
||||
t.done();
|
||||
};
|
||||
};
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
'use strict';
|
||||
|
||||
gEasingTests.forEach(params => {
|
||||
test(function(t) {
|
||||
test(t => {
|
||||
const target = createDiv(t);
|
||||
const anim = target.animate(null, { duration: 1000,
|
||||
fill: 'forwards',
|
||||
|
@ -291,11 +291,11 @@ var gStepAndFramesTimingFunctionTests = [
|
|||
}
|
||||
];
|
||||
|
||||
gStepAndFramesTimingFunctionTests.forEach(function(options) {
|
||||
test(function(t) {
|
||||
gStepAndFramesTimingFunctionTests.forEach(options => {
|
||||
test(t => {
|
||||
var target = createDiv(t);
|
||||
var animation = target.animate(null, options.effect);
|
||||
options.conditions.forEach(function(condition) {
|
||||
options.conditions.forEach(condition => {
|
||||
animation.currentTime = condition.currentTime;
|
||||
assert_equals(animation.effect.getComputedTiming().progress,
|
||||
condition.progress,
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
assert_true(document.timeline.currentTime > 0,
|
||||
'The current time is initially is positive');
|
||||
// document.timeline.currentTime should be set even before document
|
||||
|
@ -25,8 +25,8 @@ async_test(function(t) {
|
|||
// We can't just compare document.timeline.currentTime to
|
||||
// window.performance.now() because currentTime is only updated on a sample
|
||||
// so we use requestAnimationFrame instead.
|
||||
window.requestAnimationFrame(function(rafTime) {
|
||||
t.step(function() {
|
||||
window.requestAnimationFrame(rafTime => {
|
||||
t.step(() => {
|
||||
assert_equals(document.timeline.currentTime, rafTime,
|
||||
'The current time matches requestAnimationFrame time');
|
||||
});
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(function(t) {
|
||||
promise_test(t => {
|
||||
const valueAtStart = document.timeline.currentTime;
|
||||
const timeAtStart = window.performance.now();
|
||||
while (window.performance.now() - timeAtStart < 50) {
|
||||
|
@ -17,13 +17,13 @@ promise_test(function(t) {
|
|||
}
|
||||
assert_equals(document.timeline.currentTime, valueAtStart,
|
||||
'Timeline time does not change within an animation frame');
|
||||
return waitForAnimationFrames(1).then(function() {
|
||||
return waitForAnimationFrames(1).then(() => {
|
||||
assert_greater_than(document.timeline.currentTime, valueAtStart,
|
||||
'Timeline time increases between animation frames');
|
||||
});
|
||||
}, 'Timeline time increases once per animation frame');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
const iframe = document.createElement('iframe');
|
||||
iframe.width = 10;
|
||||
iframe.height = 10;
|
||||
|
@ -49,20 +49,20 @@ async_test(function(t) {
|
|||
document.body.appendChild(iframe);
|
||||
}, 'Timeline time increases once per animation frame in an iframe');
|
||||
|
||||
async_test(function(t) {
|
||||
async_test(t => {
|
||||
const startTime = document.timeline.currentTime;
|
||||
let firstRafTime;
|
||||
|
||||
requestAnimationFrame(function() {
|
||||
t.step(function() {
|
||||
requestAnimationFrame(() => {
|
||||
t.step(() => {
|
||||
assert_greater_than_equal(document.timeline.currentTime, startTime,
|
||||
'Timeline time should have progressed');
|
||||
firstRafTime = document.timeline.currentTime;
|
||||
});
|
||||
});
|
||||
|
||||
requestAnimationFrame(function() {
|
||||
t.step(function() {
|
||||
requestAnimationFrame(() => {
|
||||
t.step(() => {
|
||||
assert_equals(document.timeline.currentTime, firstRafTime,
|
||||
'Timeline time should be the same');
|
||||
});
|
||||
|
|
Загрузка…
Ссылка в новой задаче