| <!DOCTYPE html> <!-- webkit-test-runner [ OverlayRegionsEnabled=true AsyncOverflowScrollingEnabled=true AsyncFrameScrollingEnabled=true ContentInsetBackgroundFillEnabled=false ] --> |
| <html> |
| <head> |
| <meta charset="utf-8" /> |
| <style> |
| body { margin: 0; padding: 0; font-family: -apple-system; } |
| h1, h2 { margin: 0; padding: 0; line-height: 50px; } |
| h2 { font-size: 1.1em; } |
| |
| #test { |
| position: absolute; |
| top: 10%; |
| left: 10%; |
| right: 10%; |
| bottom: 10%; |
| overflow: scroll; |
| |
| --dimension: 24px; |
| } |
| |
| .big { |
| position: relative; |
| width: 4000px; |
| height: 4000px; |
| background: #355C7D; |
| } |
| .big::before { |
| content: "↘"; |
| color: white; |
| font-size: 8em; |
| text-align: center; |
| position: absolute; |
| top: 0; |
| left: 0; |
| } |
| |
| .fixed { |
| position: fixed; |
| background: rgba(100, 200, 200, 0.5); |
| } |
| </style> |
| <script src="../resources/ui-helper.js"></script> |
| <script src="./overlay-region-helper.js"></script> |
| </head> |
| <body> |
| <section id="test"> |
| <div class="big"></div> |
| <div class="fixed" style="top: 10%; left: 10%; right: 50%; height: var(--dimension);"></div> |
| <div class="fixed" style="top: calc(10% + var(--dimension)); left: 10%; right: 10%; height: var(--dimension)"></div> |
| |
| <div class="fixed" style="top: 10%; left: 10%; bottom: 10%; width: var(--dimension)"></div> |
| <div class="fixed" style="top: 10%; left: calc(10% + var(--dimension) + 20px); bottom: 10%; width: var(--dimension)"></div> |
| |
| <div class="fixed" style="top: 10%; right: 10%; bottom: 10%; width: var(--dimension)"></div> |
| <div class="fixed" style="top: 10%; right: calc(10% + var(--dimension)); bottom: 50%; width: var(--dimension)"></div> |
| |
| <div class="fixed" style="bottom: 10%; left: 10%; right: 10%; height: var(--dimension);"></div> |
| <div class="fixed" style="bottom: calc(10% + var(--dimension)); left: 30%; right: 30%; height: var(--dimension)"></div> |
| <div class="fixed" style="bottom: calc(10% + var(--dimension) * 2); left: 10%; right: 10%; height: var(--dimension)"></div> |
| </section> |
| |
| <pre id="results"></pre> |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| testRunner.dumpAsText(); |
| } |
| |
| window.onload = async function () { |
| if (!window.internals) |
| return; |
| |
| await UIHelper.ensureStablePresentationUpdate(); |
| results.textContent = filterUIViewTree(await UIHelper.getUIViewTree()); |
| document.getElementById('test').remove(); |
| |
| testRunner.notifyDone(); |
| }; |
| </script> |
| </body> |
| </html> |
| |
