content-visibility-090.html (1263B)
1 <!doctype HTML> 2 <html> 3 <meta charset="utf8"> 4 <meta name="viewport" content="width=device-width,initial-scale=1"> 5 <title>Content Visibility: scrollLeft/scrollTop/scrollWidth/scrollHeight measure correctly</title> 6 <link rel="author" title="Rob Buis" href="mailto:rbuis@igalia.com"> 7 <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> 8 <meta name="assert" content="scrollLeft/scrollTop/scrollWidth/scrollHeight measure correctly in content-visibility hidden subtree"> 9 10 <script src="/resources/testharness.js"></script> 11 <script src="/resources/testharnessreport.js"></script> 12 13 <style> 14 body { 15 margin: 0; 16 padding: 0; 17 } 18 #outer { 19 width: 100px; 20 height: 100px; 21 background: lightblue; 22 overflow: scroll; 23 24 content-visibility: hidden; 25 } 26 #inner { 27 margin: 25px; 28 width: 250px; 29 height: 250px; 30 background: lightgreen; 31 } 32 </style> 33 34 <body> 35 <div id="outer"><div id="inner"></div></div> 36 </body> 37 38 <script> 39 test(() => { 40 const outer = document.getElementById("outer"); 41 42 outer.scrollLeft = 25; 43 assert_equals(outer.scrollLeft, 25, "left"); 44 assert_equals(outer.scrollWidth, 275, "width"); 45 46 outer.scrollTop = 25; 47 assert_equals(outer.scrollTop, 25, "top"); 48 assert_equals(outer.scrollHeight, 300, "height"); 49 }); 50 51 </script> 52 </html>