<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
  @keyframes anim {
    from { background-color: red; }
    50% { left: 50px; background-color: green; }
    50% { left: 0px; }
    to { background-color: red; }
  }

  #target {
    animation: anim 2s -1s paused;
    width: 100px;
    height: 100px;
    position: relative;
  }
</style>
<div id="target"></div>
<script>
  test(function() {
    assert_equals(getComputedStyle(target).backgroundColor, 'rgb(0, 128, 0)', 'background color');
    assert_equals(getComputedStyle(target).left, '0px', 'left offset');
  }, "Check that duplicate keyframe offsets are correctly merged");
</script>