| OLD | NEW | 
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> | 
| 2 | 2 | 
| 3 <html> | 3 <html> | 
| 4 <head> | 4 <head> | 
| 5   <style> | 5   <style> | 
| 6     #box { | 6     #box { | 
| 7       position: absolute; | 7       position: absolute; | 
| 8       height: 100px; | 8       height: 100px; | 
| 9       width: 100px; | 9       width: 100px; | 
| 10       background-color: blue; | 10       background-color: blue; | 
| 11       clip: rect(10px, 90px, 90px, 10px); | 11       clip: rect(10px, 90px, 90px, 10px); | 
| 12       -webkit-transition: clip 1s linear; | 12       -webkit-transition: clip 1s linear; | 
| 13     } | 13     } | 
| 14 | 14 | 
| 15     #box.changed { | 15     #box.changed { | 
| 16       clip: rect(30px, 70px, 70px, 30px); | 16       clip: rect(30px, 70px, 70px, 30px); | 
| 17     } | 17     } | 
| 18   </style> | 18   </style> | 
| 19   <script src="resources/transition-test-helpers.js"></script> | 19   <script src="../animations/resources/animation-test-helpers.js"></script> | 
| 20   <script type="text/javascript"> | 20   <script type="text/javascript"> | 
| 21 | 21 | 
| 22     const expectedValues = [ | 22     const expectedValues = [ | 
| 23       // [time, element-id, property, expected-value, tolerance] | 23       // [time, element-id, property, expected-value, tolerance] | 
| 24       [0.5, 'box', 'clip', [20, 80, 80, 20], 2], | 24       [0.5, 'box', 'clip', [20, 80, 80, 20], 2], | 
| 25     ]; | 25     ]; | 
| 26 | 26 | 
| 27     function setupTest() | 27     function setupTest() | 
| 28     { | 28     { | 
| 29       document.getElementById('box').className = 'changed'; | 29       document.getElementById('box').className = 'changed'; | 
| 30     } | 30     } | 
| 31 | 31 | 
| 32     runTransitionTest(expectedValues, setupTest, usePauseAPI); | 32     runTransitionTest(expectedValues, setupTest, usePauseAPI); | 
| 33   </script> | 33   </script> | 
| 34 </head> | 34 </head> | 
| 35 <body> | 35 <body> | 
| 36   <div id="box"></div> | 36   <div id="box"></div> | 
| 37   <div id="result"></div> | 37   <div id="result"></div> | 
| 38 </body> | 38 </body> | 
| 39 </html> | 39 </html> | 
| OLD | NEW | 
|---|