--- a/dom/animation/test/chrome/test_animation_property_state.html
+++ b/dom/animation/test/chrome/test_animation_property_state.html
@@ -1,13 +1,13 @@
<!doctype html>
<head>
<meta charset=utf-8>
-<title>Bug 1196114 - Animation property which indicates
- running on the compositor or not</title>
+<title>Bug 1196114 - Test metadata related to which animation properties
+ are running on the compositor</title>
<script type="application/javascript" src="../testharness.js"></script>
<script type="application/javascript" src="../testharnessreport.js"></script>
<script type="application/javascript" src="../testcommon.js"></script>
<style>
.compositable {
/* Element needs geometry to be eligible for layerization */
width: 100px;
height: 100px;
@@ -210,17 +210,17 @@ var gAnimationsTests = [
];
gAnimationsTests.forEach(function(subtest) {
promise_test(function(t) {
var div = addDiv(t, { class: 'compositable' });
var animation = div.animate(subtest.frames, 100000);
return animation.ready.then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
subtest.expected);
}));
}, subtest.desc);
});
var gPerformanceWarningTests = [
{
desc: 'preserve-3d transform',
@@ -496,46 +496,46 @@ function start() {
.createBundle("chrome://global/locale/layout_errors.properties");
gAnimationsTests.forEach(function(subtest) {
promise_test(function(t) {
var div = addDiv(t, { class: 'compositable' });
var animation = div.animate(subtest.frames, 100000);
return animation.ready.then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
subtest.expected);
}));
}, subtest.desc);
});
gPerformanceWarningTests.forEach(function(subtest) {
// FIXME: Bug 1255710: 'preserve-3d' frame breaks other tests,
// we should skip all 'preserve-3d' tests here.
if (subtest.desc.includes('preserve-3d')) {
return;
}
promise_test(function(t) {
var div = addDiv(t, { class: 'compositable' });
var animation = div.animate(subtest.frames, 100000);
return animation.ready.then(t.step_func(function() {
assert_property_state_on_compositor(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
subtest.expected);
div.style = subtest.style;
return waitForFrame();
})).then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
subtest.expected);
div.style = '';
return waitForFrame();
})).then(t.step_func(function() {
assert_property_state_on_compositor(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
subtest.expected);
}));
}, subtest.desc);
});
gMultipleAsyncAnimationsTests.forEach(function(subtest) {
// FIXME: Bug 1255710: 'preserve-3d' frame breaks other tests,
// we should skip all 'preserve-3d' tests here.
@@ -549,33 +549,33 @@ function start() {
// Bind expected values to animation object.
animation.expected = anim.expected;
return animation;
});
return waitForAllAnimations(animations).then(t.step_func(function() {
animations.forEach(t.step_func(function(anim) {
assert_property_state_on_compositor(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
div.style = subtest.style;
return waitForFrame();
})).then(t.step_func(function() {
animations.forEach(t.step_func(function(anim) {
assert_animation_property_state_equals(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
div.style = '';
return waitForFrame();
})).then(t.step_func(function() {
animations.forEach(t.step_func(function(anim) {
assert_property_state_on_compositor(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
}));
}, 'Multiple animations: ' + subtest.desc);
});
gMultipleAsyncAnimationsWithGeometricKeyframeTests.forEach(function(subtest) {
promise_test(function(t) {
@@ -585,17 +585,17 @@ function start() {
// Bind expected values to animation object.
animation.expected = anim.expected;
return animation;
});
return waitForAllAnimations(animations).then(t.step_func(function() {
animations.forEach(t.step_func(function(anim) {
assert_animation_property_state_equals(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
}));
}, 'Multiple animations with geometric property: ' + subtest.desc);
});
gMultipleAsyncAnimationsWithGeometricAnimationTests.forEach(function(subtest) {
promise_test(function(t) {
@@ -608,74 +608,74 @@ function start() {
return animation;
});
var widthAnimation;
return waitForAllAnimations(animations).then(t.step_func(function() {
animations.forEach(t.step_func(function(anim) {
assert_property_state_on_compositor(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
})).then(t.step_func(function() {
// Append 'width' animation on the same element.
widthAnimation = div.animate({ width: ['100px', '200px'] }, 100000);
return waitForFrame();
})).then(t.step_func(function() {
// Now transform animations are not running on compositor because of
// the 'width' animation.
animations.forEach(t.step_func(function(anim) {
assert_animation_property_state_equals(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
// Remove the 'width' animation.
widthAnimation.cancel();
return waitForFrame();
})).then(t.step_func(function() {
// Now all animations are running on compositor.
animations.forEach(t.step_func(function(anim) {
assert_property_state_on_compositor(
- anim.effect.getPropertyState(),
+ anim.effect.getProperties(),
anim.expected);
}));
}));
}, 'Multiple async animations and geometric animation: ' + subtest.desc);
});
promise_test(function(t) {
var div = addDiv(t, { class: 'compositable' });
var animation = div.animate(
{ transform: ['translate(0px)', 'translate(100px)'] }, 100000);
return animation.ready.then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ { property: 'transform', runningOnCompositor: true } ]);
div.style = 'width: 10000px; height: 10000px';
return waitForFrame();
})).then(t.step_func(function() {
// viewport depends on test environment.
var expectedWarning = new RegExp(
"Async animation disabled because frame size \\(10000, 10000\\) is " +
"bigger than the viewport \\(\\d+, \\d+\\) or the visual rectangle " +
"\\(10000, 10000\\) is larger than the max allowed value \\(\\d+\\)");
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ {
property: 'transform',
runningOnCompositor: false,
warning: expectedWarning
} ]);
div.style = 'width: 100px; height: 100px';
return waitForFrame();
})).then(t.step_func(function() {
// FIXME: Bug 1253164: the animation should get back on compositor.
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ { property: 'transform', runningOnCompositor: false } ]);
}));
}, 'transform on too big element');
promise_test(function(t) {
var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttribute('width', '100');
svg.setAttribute('height', '100');
@@ -688,33 +688,33 @@ function start() {
t.add_cleanup(function() {
svg.remove();
});
var animation = svg.animate(
{ transform: ['translate(0px)', 'translate(100px)'] }, 100000);
return animation.ready.then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ { property: 'transform', runningOnCompositor: true } ]);
svg.setAttribute('transform', 'translate(10, 20)');
return waitForFrame();
})).then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ {
property: 'transform',
runningOnCompositor: false,
warning: 'AnimationWarningTransformSVG'
} ]);
svg.removeAttribute('transform');
return waitForFrame();
})).then(t.step_func(function() {
assert_animation_property_state_equals(
- animation.effect.getPropertyState(),
+ animation.effect.getProperties(),
[ { property: 'transform', runningOnCompositor: true } ]);
}));
}, 'transform of nsIFrame with SVG transform');
}
</script>
</body>