| <!DOCTYPE html> |
| <html class="reftest-wait"> |
| <title>View transitions: display old paint during update callback</title> |
| <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/"> |
| <link rel="match" href="paint-holding-in-iframe-ref.html"> |
| <link rel="author" href="mailto:khushalsagar@chromium.org"> |
| <script src="/common/reftest-wait.js"></script> |
| <script src="/common/rendering-utils.js"></script> |
| <style> |
| .old { |
| border: 5px solid black; |
| } |
| .new { |
| border: 5px solid orange; |
| } |
| </style> |
| |
| <iframe id="inner" class="old" srcdoc=" |
| <body> |
| This is old content |
| </body> |
| "></iframe> |
| <script> |
| async function runTest() { |
| await waitForAtLeastOneFrame(); |
| |
| let contentDocument = inner.contentDocument; |
| contentDocument.body.style.background = "blue"; |
| |
| contentDocument.startViewTransition(async () => { |
| contentDocument.body.style.background = "green"; |
| contentDocument.body.innerText = "This is new content"; |
| |
| inner.classList.toggle('old'); |
| inner.classList.toggle('new'); |
| |
| takeScreenshot(); |
| return new Promise((resolve) => {}); |
| }); |
| } |
| onload = runTest; |
| </script> |
| </html> |
