canvas-webgl-translate-in-animation-ref.html (819B)
1 <!DOCTYPE html> 2 <html class=reftest-wait> 3 <title>CSS Test: translate webgl canvas in an animation via set current time (ref).</title> 4 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"/> 5 <link rel="help" href="https://www.w3.org/TR/css-transforms-1/#funcdef-transform-translate"/> 6 <script src="/common/reftest-wait.js"></script> 7 8 <style> 9 canvas { 10 will-change: transform; 11 transform: translate(150px); 12 } 13 </style> 14 15 <canvas id="canvas" width="150" height="150"></canvas> 16 17 <script> 18 async function runReference() { 19 const gl = canvas.getContext("webgl"); 20 if(gl != null) { 21 gl.clearColor(0.0, 1.0, 0.0, 1.0); 22 gl.clear(gl.COLOR_BUFFER_BIT); 23 } 24 25 requestAnimationFrame(takeScreenshot); 26 } 27 onload = () => requestAnimationFrame(() => requestAnimationFrame(runReference)); 28 </script> 29 </html>