1216842-2.html (953B)
1 <!doctype html> 2 <html class="reftest-wait"> 3 <head> 4 <title>Bug 1216842: effect-level easing function produces values greater than 1 (compositor thread)</title> 5 <style> 6 #target { 7 width: 100px; height: 100px; 8 background: blue; 9 } 10 </style> 11 </head> 12 <body> 13 <div id="target"></div> 14 </body> 15 <script> 16 var target = document.getElementById("target"); 17 var effect = 18 new KeyframeEffect( 19 target, 20 { opacity: [0, 1] }, 21 { 22 fill: "forwards", 23 /* The function produces values greater than 1 in (0.23368794, 1) */ 24 easing: "cubic-bezier(0,1.5,1,1.5)", 25 duration: 100, 26 iterations: 0.25 /* To finish in the extraporation range */ 27 } 28 ); 29 var animation = new Animation(effect, document.timeline); 30 animation.play(); 31 animation.finished.then(function() { 32 document.documentElement.className = ""; 33 }); 34 </script> 35 </html>