paint2d-roundRect.https.html (889B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <link rel="help" href="https://drafts.css-houdini.org/css-paint-api/"> 4 <link rel="match" href="paint2d-roundRect-ref.html"> 5 <meta name="fuzzy" content="maxDifference=0-128;totalPixels=0-200"> 6 <style> 7 #output { 8 width: 100px; 9 height: 100px; 10 background-image: paint(rects); 11 background-color: blue; 12 } 13 </style> 14 <script src="/common/reftest-wait.js"></script> 15 <script src="/common/worklet-reftest.js"></script> 16 <body> 17 <div id="output"></div> 18 19 <script id="code" type="text/worklet"> 20 registerPaint('rects', class { 21 paint(ctx, geom) { 22 ctx.fillStyle = 'green'; 23 ctx.roundRect(10, 10, 80, 80, [20, 40, 10]); 24 ctx.fill(); 25 } 26 }); 27 </script> 28 29 <script> 30 importWorkletAndTerminateTestAfterAsyncPaint(CSS.paintWorklet, document.getElementById('code').textContent); 31 </script> 32 </body> 33 </html>