--- a/testing/web-platform/tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument.html
+++ b/testing/web-platform/tests/web-animations/interfaces/KeyframeEffect/processing-a-keyframes-argument.html
@@ -14,17 +14,17 @@
// This file only tests the KeyframeEffect constructor since it is
// assumed that the implementation of the KeyframeEffectReadOnly constructor,
// Animatable.animate() method, and KeyframeEffect.setKeyframes() method will
// all share common machinery and it is not necessary to test each method.
// Test that only animatable properties are accessed
-var gNonAnimatableProps = [
+const gNonAnimatableProps = [
'animation', // Shorthands where all the longhand sub-properties are not
// animatable, are also not animatable.
'animationDelay',
'animationDirection',
'animationDuration',
'animationFillMode',
'animationIterationCount',
'animationName',
@@ -36,17 +36,17 @@ var gNonAnimatableProps = [
'transitionProperty',
'transitionTimingFunction',
'display',
'unsupportedProperty',
'font-size', // Supported property that uses dashes
];
function TestKeyframe(testProp) {
- var _propAccessCount = 0;
+ let _propAccessCount = 0;
Object.defineProperty(this, testProp, {
get: function() { _propAccessCount++; },
enumerable: true
});
Object.defineProperty(this, 'propAccessCount', {
get: function() { return _propAccessCount; }
@@ -54,45 +54,47 @@ function TestKeyframe(testProp) {
}
function GetTestKeyframeSequence(testProp) {
return [ new TestKeyframe(testProp) ]
}
gNonAnimatableProps.forEach(function(prop) {
test(function(t) {
- var testKeyframe = new TestKeyframe(prop);
+ const testKeyframe = new TestKeyframe(prop);
new KeyframeEffect(null, testKeyframe);
assert_equals(testKeyframe.propAccessCount, 0, 'Accessor not called');
}, 'non-animatable property \'' + prop + '\' is not accessed when using'
+ ' a property-indexed keyframe object');
});
gNonAnimatableProps.forEach(function(prop) {
test(function(t) {
- var testKeyframes = GetTestKeyframeSequence(prop);
+ const testKeyframes = GetTestKeyframeSequence(prop);
new KeyframeEffect(null, testKeyframes);
assert_equals(testKeyframes[0].propAccessCount, 0, 'Accessor not called');
}, 'non-animatable property \'' + prop + '\' is not accessed when using'
+ ' a keyframe sequence');
});
// Test equivalent forms of property indexed and sequenced keyframe syntax
function assertEquivalentKeyframeSyntax(keyframesA, keyframesB) {
- var processedKeyframesA = new KeyframeEffect(null, keyframesA).getKeyframes();
- var processedKeyframesB = new KeyframeEffect(null, keyframesB).getKeyframes();
+ const processedKeyframesA =
+ new KeyframeEffect(null, keyframesA).getKeyframes();
+ const processedKeyframesB =
+ new KeyframeEffect(null, keyframesB).getKeyframes();
assert_frame_lists_equal(processedKeyframesA, processedKeyframesB);
}
-var gEquivalentSyntaxTests = [
+const gEquivalentSyntaxTests = [
{
description: 'two properties with one value',
indexedKeyframes: {
left: '100px',
opacity: ['1'],
},
sequencedKeyframes: [
{left: '100px', opacity: '1'},
@@ -165,73 +167,73 @@ gEquivalentSyntaxTests.forEach(function(
}, 'Equivalent property indexed and sequenced keyframes: ' + description);
});
// Test handling of custom iterable objects.
function createIterable(iterations) {
return {
[Symbol.iterator]() {
- var i = 0;
+ let i = 0;
return {
next() {
return iterations[i++];
},
};
},
};
}
test(() => {
- var effect = new KeyframeEffect(null, createIterable([
+ const effect = new KeyframeEffect(null, createIterable([
{done: false, value: {left: '100px'}},
{done: false, value: {left: '300px'}},
{done: false, value: {left: '200px'}},
{done: true},
]));
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', left: '100px'},
{offset: null, computedOffset: 0.5, easing: 'linear', left: '300px'},
{offset: null, computedOffset: 1, easing: 'linear', left: '200px'},
]);
}, 'Custom iterator with basic keyframes.');
test(() => {
- var keyframes = createIterable([
+ const keyframes = createIterable([
{done: false, value: {left: '100px'}},
{done: false, value: {left: '300px'}},
{done: false, value: {left: '200px'}},
{done: true},
]);
keyframes.easing = 'ease-in-out';
keyframes.offset = '0.1';
- var effect = new KeyframeEffect(null, keyframes);
+ const effect = new KeyframeEffect(null, keyframes);
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', left: '100px'},
{offset: null, computedOffset: 0.5, easing: 'linear', left: '300px'},
{offset: null, computedOffset: 1, easing: 'linear', left: '200px'},
]);
}, 'easing and offset are ignored on iterable objects.');
test(() => {
- var effect = new KeyframeEffect(null, createIterable([
+ const effect = new KeyframeEffect(null, createIterable([
{done: false, value: {left: '100px', top: '200px'}},
{done: false, value: {left: '300px'}},
{done: false, value: {left: '200px', top: '100px'}},
{done: true},
]));
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', left: '100px', top: '200px'},
{offset: null, computedOffset: 0.5, easing: 'linear', left: '300px'},
{offset: null, computedOffset: 1, easing: 'linear', left: '200px', top: '100px'},
]);
}, 'Custom iterator with multiple properties specified.');
test(() => {
- var effect = new KeyframeEffect(null, createIterable([
+ const effect = new KeyframeEffect(null, createIterable([
{done: false, value: {left: '100px'}},
{done: false, value: {left: '250px', offset: 0.75}},
{done: false, value: {left: '200px'}},
{done: true},
]));
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', left: '100px'},
{offset: 0.75, computedOffset: 0.75, easing: 'linear', left: '250px'},
@@ -246,85 +248,85 @@ test(() => {
{done: false, value: 1234},
{done: false, value: {left: '200px'}},
{done: true},
]));
});
}, 'Custom iterator with non object keyframe should throw.');
test(() => {
- var effect = new KeyframeEffect(null, createIterable([
+ const effect = new KeyframeEffect(null, createIterable([
{done: false, value: {left: ['100px', '200px']}},
{done: true},
]));
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 1, easing: 'linear'}
]);
}, 'Custom iterator with value list in keyframe should not contain invalid ' +
'property value pair of list.');
test(function(t) {
- var keyframe = {};
+ const keyframe = {};
Object.defineProperty(keyframe, 'width', {value: '200px'});
Object.defineProperty(keyframe, 'height', {
value: '100px',
enumerable: true});
assert_equals(keyframe.width, '200px', 'width of keyframe is readable');
assert_equals(keyframe.height, '100px', 'height of keyframe is readable');
const effect = new KeyframeEffect(null, [keyframe, {height: '200px'}]);
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', height: '100px'},
{offset: null, computedOffset: 1, easing: 'linear', height: '200px'},
]);
}, 'Only enumerable properties on keyframes are considered');
test(function(t) {
- var KeyframeParent = function() { this.width = '100px'; };
+ const KeyframeParent = function() { this.width = '100px'; };
KeyframeParent.prototype = { height: '100px' };
- var Keyframe = function() { this.top = '100px'; };
+ const Keyframe = function() { this.top = '100px'; };
Keyframe.prototype = Object.create(KeyframeParent.prototype);
Object.defineProperty(Keyframe.prototype, 'left', {
value: '100px',
enumerable: 'true'});
- var keyframe = new Keyframe();
+ const keyframe = new Keyframe();
const effect = new KeyframeEffect(null, [keyframe, {top: '200px'}]);
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', top: '100px'},
{offset: null, computedOffset: 1, easing: 'linear', top: '200px'},
]);
}, 'Only properties defined directly on keyframes are considered');
test(function(t) {
- var keyframes = {};
+ const keyframes = {};
Object.defineProperty(keyframes, 'width', ['100px', '200px']);
Object.defineProperty(keyframes, 'height', {
value: ['100px', '200px'],
enumerable: true});
const effect = new KeyframeEffect(null, keyframes);
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', height: '100px'},
{offset: null, computedOffset: 1, easing: 'linear', height: '200px'},
]);
}, 'Only enumerable properties on property indexed keyframes are considered');
test(function(t) {
- var KeyframesParent = function() { this.width = '100px'; };
+ const KeyframesParent = function() { this.width = '100px'; };
KeyframesParent.prototype = { height: '100px' };
- var Keyframes = function() { this.top = ['100px', '200px']; };
+ const Keyframes = function() { this.top = ['100px', '200px']; };
Keyframes.prototype = Object.create(KeyframesParent.prototype);
Object.defineProperty(Keyframes.prototype, 'left', {
value: ['100px', '200px'],
enumerable: 'true'});
- var keyframes = new Keyframes();
+ const keyframes = new Keyframes();
const effect = new KeyframeEffect(null, keyframes);
assert_frame_lists_equal(effect.getKeyframes(), [
{offset: null, computedOffset: 0, easing: 'linear', top: '100px'},
{offset: null, computedOffset: 1, easing: 'linear', top: '200px'},
]);
}, 'Only properties defined directly on property indexed keyframes are considered');