1<!DOCTYPE html>
2<script src="testharness/testharness.js"></script>
3<script src="testharness/testharnessreport.js"></script>
4<script src="resources/keyframes-test.js"></script>
5<script>
6test(function() {
7  assertAnimationStyles([
8    {opacity: '0.25', left: '25px'},
9    {opacity: '0.75', left: '75px'},
10  ], {
11    0.5: {opacity: '0.5', left: '50px'},
12  });
13},
14'element.animate() with 2 keyframes',
15{
16  help: 'http://dev.w3.org/fxtf/web-animations/#keyframe-animation-effects',
17  assert: [
18    'element.animate() should start an animation when two keyframes',
19    'are provided with matching properties and no offsets specified.',
20  ],
21  author: 'Alan Cutter',
22});
23
24test(function() {
25  assertAnimationStyles([
26    {opacity: '0', left: '0px'},
27    {opacity: '0.25', left: '25px'},
28    {opacity: '0.75', left: '75px'},
29  ], {
30    0.25: {opacity: '0.125', left: '12.5px'},
31    0.75: {opacity: '0.5', left: '50px'},
32  });
33},
34'element.animate() with 3 keyframes',
35{
36  help: 'http://dev.w3.org/fxtf/web-animations/#keyframe-animation-effects',
37  assert: [
38    'element.animate() should start an animation when three keyframes',
39    'are provided with matching properties and no offsets specified.',
40    'The keyframes must maintain their ordering and get distributed',
41    'correctly.',
42  ],
43  author: 'Alan Cutter',
44});
45</script>
46