third_party/WebKit/LayoutTests/animations/keyframes-duplicate-offsets.html

   1 <!DOCTYPE html>
   2 <script src="../resources/testharness.js"></script>
   3 <script src="../resources/testharnessreport.js"></script>
   4 <style>
   5   @keyframes anim {
   6     from { background-color: red; }
   7     50% { left: 50px; background-color: green; }
   8     50% { left: 0px; }
   9     to { background-color: red; }
  10   }
  11
  12   #target {
  13     animation: anim 2s -1s paused;
  14     width: 100px;
  15     height: 100px;
  16     position: relative;
  17   }
  18 </style>
  19 <div id="target"></div>
  20 <script>
  21   test(function() {
  22     assert_equals(getComputedStyle(target).backgroundColor, 'rgb(0, 128, 0)', 'background color');
  23     assert_equals(getComputedStyle(target).left, '0px', 'left offset');
  24   }, "Check that duplicate keyframe offsets are correctly merged");
  25 </script>