third_party/WebKit/LayoutTests/animations/animation-border-overflow.html

   1 <html>
   2 <head>
   3 <title>Unfilled Animation Test</title>
   4 <style type="text/css" media="screen">
   5 #box {
   6     height: 100px;
   7     width: 100px;
   8     border-top-width: 300px;
   9     border-style: solid;
  10     -webkit-animation-duration: 1s;
  11     -webkit-animation-timing-function: ease-in-out;
  12     -webkit-animation-name: anim;
  13 }
  14 @-webkit-keyframes anim {
  15     from { border-top-width: 200px; }
  16     to   { border-top-width: 0px; }
  17 }
  18
  19 </style>
  20     <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
  21     <script type="text/javascript" charset="utf-8">
  22     if (window.testRunner)
  23         testRunner.dumpAsText();
  24
  25     const expectedValues = [
  26       // [time, element-id, property, expected-value, tolerance]
  27       [0.1, "box", "border-top-width", 200, 20],
  28     ];
  29
  30     runAnimationTest(expectedValues);
  31     </script>
  32 </head>
  33 <body>
  34 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.
  35 <div id="box">
  36 </div>
  37 <div id="result">
  38 </div>
  39 </body>
  40 </html>