transition-shorthand-delay.html | Explore in Territory

<!DOCTYPE html>

<html>
<head>
  <style>
    #target {
      position: relative;
      left: 100px;
      height: 50px;
      width: 50px;
      background-color: green;
      -webkit-transition: left 1s linear 250ms;
    }
    
    #target.moved {
      left: 200px;
    }
   </style>
   <script src="../animations/resources/animation-test-helpers.js"></script>
   <script>
     const expectedValues = [
       // [time, element-id, property, expected-value, tolerance]
       [0.5, "target", "left", 125, 4],
     ];

     function setupTest()
     {
       document.getElementById("target").className = "moved";
     }

     runTransitionTest(expectedValues, setupTest);
   </script>
</head>
<body>
  <div id="target"></div>
  <div id="result"></div>

</body>
</html>

chromium/third_party/blink/web_tests/transitions/transition-shorthand-delay.html