first-contentful-canvas.html (1485B)
1 <!DOCTYPE html> 2 <head> 3 <title>Performance Paint Timing Test: FCP due to canvas</title> 4 </head> 5 <body> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <canvas id="canvas" width="200" height="200" ></canvas> 9 10 <script> 11 setup({"hide_test_state": true}); 12 async_test(function (t) { 13 assert_implements(window.PerformancePaintTiming, "Paint Timing isn't supported."); 14 const canvas = document.getElementById("canvas"); 15 const context = canvas.getContext("2d"); 16 context.beginPath(); 17 context.moveTo(0,0); 18 context.lineTo(300,150); 19 context.stroke(); 20 function testPaintEntries() { 21 const bufferedEntries = performance.getEntriesByType('paint'); 22 if (bufferedEntries.length < 2) { 23 t.step_timeout(function() { 24 testPaintEntries(); 25 }, 20); 26 return; 27 } 28 t.step(function() { 29 assert_equals(bufferedEntries.length, 2, "There should be two paint timing instances."); 30 assert_equals(bufferedEntries[0].entryType, "paint"); 31 assert_equals(bufferedEntries[0].name, "first-paint"); 32 assert_equals(bufferedEntries[1].entryType, "paint"); 33 assert_equals(bufferedEntries[1].name, "first-contentful-paint"); 34 t.done(); 35 }); 36 }; 37 t.step(function() { 38 testPaintEntries(); 39 }); 40 }, "First contentful paint fires due to canvas render."); 41 </script> 42 </body> 43 </html>