worklet-animation-duration.https.html (1335B)
1 <html> 2 <title>WorkletAnimation should continue to be in effect forever, even if its duration is passed</title> 3 <link rel="help" href="https://drafts.css-houdini.org/css-animationworklet/"> 4 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/web-animations/testcommon.js"></script> 8 <script src="common.js"></script> 9 10 <div id="box"></div> 11 12 <script> 13 promise_test(async t => { 14 await registerConstantLocalTimeAnimator(0.5); 15 16 const box = document.getElementById('box'); 17 const effect = new KeyframeEffect(box, 18 [ 19 {transform: 'translateY(0px)' }, 20 {transform: 'translateY(200px)' } 21 ], { 22 duration: 1, 23 } 24 ); 25 26 const animation = new WorkletAnimation('constant_time', effect); 27 animation.play(); 28 29 let expected_transform = "matrix(1, 0, 0, 1, 0, 100)"; 30 await waitForAnimationFrameWithCondition(_ => { 31 return getComputedStyle(box).transform == expected_transform; 32 }); 33 34 // The animation is specified to last for 1 millisecond 35 await new Promise(resolve => step_timeout(resolve, 500)); 36 37 assert_equals(getComputedStyle(document.getElementById("box")).transform, expected_transform); 38 }, "WorkletAnimation should continue to be in effect forever, even if its duration is passed"); 39 </script>