style: Add a new Timer structure to the shared style context, and basic infrastructure for controlling animations.

This commit is contained in:
Emilio Cobos Álvarez 2016-07-09 22:43:52 -07:00
parent 2e68821014
commit 0b67b218d0
No known key found for this signature in database
GPG key ID: 056B727BB9C1027C
20 changed files with 178 additions and 26 deletions

View file

@ -6120,6 +6120,12 @@
]
},
"testharness": {
"css/animations/basic-linear-width.html": [
{
"path": "css/animations/basic-linear-width.html",
"url": "/_mozilla/css/animations/basic-linear-width.html"
}
],
"css/empty-keyframes.html": [
{
"path": "css/empty-keyframes.html",

View file

@ -0,0 +1,2 @@
prefs: ["layout.animations.test.enabled:true",
"dom.testbinding.enabled:true"]

View file

@ -0,0 +1,33 @@
<!doctype html>
<meta charset="utf-8">
<title>Animation test: Linear animation repeated infinitely.</title>
<style>
.animatable {
width: 50px;
height: 50px;
background: red;
animation: foo 1s infinite linear;
}
@keyframes foo {
from { width: 0; }
to { width: 500px; }
}
</style>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div class="animatable"></div>
<script>
var div = document.querySelector('.animatable');
async_test(function(t) {
window.addEventListener('load', function() {
var test = new window.TestBinding();
test.advanceClock(500);
assert_equals(getComputedStyle(div).getPropertyValue('width'), '250px');
test.advanceClock(500);
assert_equals(getComputedStyle(div).getPropertyValue('width'), '500px');
test.advanceClock(500);
assert_equals(getComputedStyle(div).getPropertyValue('width'), '250px');
t.done();
})
})
</script>