no-painting-while-render-blocked.html (948B)
1 <!DOCTYPE html> 2 <html class=reftest-wait> 3 <title>View transitions: Rendering suppression prevents painting</title> 4 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/#document-rendering-suppression-for-view-transitions"> 5 <link rel="author" href="mailto:mattwoodrow@apple.com"> 6 <link rel="match" href="no-painting-while-render-blocked-ref.html"> 7 <script src="/common/reftest-wait.js"></script> 8 <style> 9 #target { 10 width: 200px; 11 height: 200px; 12 background: green; 13 } 14 </style> 15 16 <div id=target></div> 17 18 <script> 19 failIfNot(document.startViewTransition, "Missing document.startViewTransition"); 20 21 async function runTest() { 22 let transition = document.startViewTransition(async () => { 23 document.getElementById('target').style.backgroundColor = "red"; 24 takeScreenshot(); 25 await new Promise(resolve => setTimeout(resolve, 5000)); 26 }); 27 } 28 onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest)); 29 </script>