content-visibility-075.html (1391B)
1 <!doctype HTML> 2 <html class="reftest-wait"> 3 <meta charset="utf8"> 4 <title>CSS Content Visibility: auto + scrollIntoView when size estimate is off</title> 5 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> 7 <link rel="match" href="content-visibility-075-ref.html"> 8 <meta name="assert" content="With content-visibility: auto, scrollIntoView targets the right element"> 9 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 10 <script src="/common/reftest-wait.js"></script> 11 12 <style> 13 .auto { 14 content-visibility: auto; 15 contain-intrinsic-size: 1px 10000px; 16 } 17 .child { 18 height: 40000px; 19 position: relative; 20 } 21 #target { 22 position: absolute; 23 bottom: 0; 24 font: 25px/1 Ahem; 25 } 26 .before_target { 27 height: 40000px; 28 } 29 </style> 30 31 <div id=e1 class="auto before_target"></div> 32 <div id=e2 class="auto before_target"></div> 33 <div id=e3 class=auto><div class=child><div id=target>PASS</div></div></div> 34 <div id=e4 class=auto><div class=child></div></div> 35 <div id=e5 class=auto><div class=child></div></div> 36 37 <script> 38 function runTest() { 39 target.scrollIntoView(); 40 // Double rAF to ensure that rendering has "settled". 41 requestAnimationFrame(() => requestAnimationFrame(takeScreenshot)); 42 } 43 44 window.onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest)); 45 </script>