scrollbars-chrome-bug-001.html (946B)
1 <!DOCTYPE html> 2 <title>CSS Overflow: css-overflow-3</title> 3 <link rel="author" href="mailto:atotic@google.com"> 4 <link rel="help" href="https://crbug.com/926167"> 5 <link rel="match" href="scrollbars-chrome-bug-001-ref.html"> 6 <meta name="assert" content="scrollbars keep up to date with a changing transform"> 7 <style> 8 9 #container { 10 width: 200px; 11 height: 150px; 12 border: 1px solid black; 13 overflow: scroll; 14 } 15 #target { 16 width: 100px; 17 height: 50px; 18 background: green; 19 transform: scale(1); 20 } 21 </style> 22 <!-- --> 23 <div id="container"> 24 <div id="target"></div> 25 </div> 26 <script> 27 // 1st transform triggers layer creation, and full layout. 28 // 2nd transform just updates overflow, which does not update scrollbars. 29 // This triggers the bug. 30 document.body.offsetTop; 31 document.querySelector("#target").style.transform = "scale(1.5)"; 32 document.body.offsetTop; 33 document.querySelector("#target").style.transform = "scale(4.0)"; 34 </script>