[Web Animations] Expose Web Animations CSS integration as an experimental feature
[WebKit-https.git] / LayoutTests / animations / animation-border-overflow.html
1 <!DOCTYPE html><!-- webkit-test-runner [ enableWebAnimationsCSSIntegration=true ] -->
2 <html>
3 <head>
4 <title>Unfilled Animation Test</title>
5 <style type="text/css" media="screen">
6 #box {
7     height: 100px;
8     width: 100px;
9     border-top-width: 300px;
10     border-style: solid;
11     -webkit-animation-duration: 1s;
12     -webkit-animation-timing-function: ease-in-out;
13     -webkit-animation-name: "anim";
14 }
15 @-webkit-keyframes "anim" {
16     from { border-top-width: 200px; }
17     to   { border-top-width: 0px; }
18 }
19
20 </style>
21     <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
22     <script type="text/javascript" charset="utf-8">
23     if (window.testRunner)
24         testRunner.dumpAsText();
25
26     const expectedValues = [
27       // [animation-name, time, element-id, property, expected-value, tolerance]
28       ["anim", 0.1, "box", "border-top-width", 200, 20],
29     ];
30
31     runAnimationTest(expectedValues);
32     </script>
33 </head>
34 <body>
35 This test performs an animation of the border-top-width property from a given value to 0. It tests if an intermediate value is correct.
36 <div id="box">
37 </div>
38 <div id="result">
39 </div>
40 </body>
41 </html>