| <!DOCTYPE html> |
| <title>A content change inside a composited box that an earlier sibling pushed down must repaint in the right place. https://bugs.webkit.org/show_bug.cgi?id=23308</title> |
| <script src="../../resources/ui-helper.js"></script> |
| <style> |
| body { |
| margin: 0; |
| font: 20px/1 Ahem; |
| } |
| .repaint-container { |
| transform: translateZ(0); |
| } |
| .flex { |
| display: flex; |
| } |
| #upper { |
| background: yellow; |
| } |
| #lower { |
| background: green; |
| } |
| </style> |
| <div id=upper></div> |
| <div class="repaint-container flex"> |
| <div id=lower>TEST</div> |
| </div> |
| <script> |
| window.testRunner?.waitUntilDone(); |
| window.testRunner?.dontForceRepaint(); |
| |
| async function runTest() { |
| await UIHelper.renderingUpdate(); |
| upper.style.height = "1em"; // pushes the composited box down |
| lower.innerHTML = "TEST CASE"; |
| await UIHelper.renderingUpdate(); |
| await UIHelper.renderingUpdate(); |
| window.testRunner?.notifyDone(); |
| } |
| window.addEventListener('load', runTest); |
| </script> |
