paintedlayer-recycling-2.html (1282B)
1 <!DOCTYPE html> 2 <html lang="en" class="reftest-wait"> 3 <meta charset="utf-8"> 4 <title>Starting to scroll the nested scrollbox shouldn't invalidate the fixed layer</title> 5 6 <style> 7 8 .content { 9 box-sizing: border-box; 10 width: 200px; 11 height: 200px; 12 border: 1px solid black; 13 } 14 15 .fixed { 16 position: fixed; 17 top: 20px; 18 left: 240px; 19 } 20 21 .reftest-no-paint { 22 border-color: lime; 23 } 24 25 .scrollable { 26 overflow: auto; 27 padding: 10px; 28 } 29 30 .scrolled { 31 border: 1px solid gray; 32 height: 400px; 33 } 34 35 body { 36 margin: 0; 37 padding: 20px; 38 height: 3000px; 39 } 40 41 </style> 42 43 <div class="scrollable content" id="aboutToScroll"> 44 <!-- 45 This scrollbox starts out without active scrolling and is going to become 46 actively scrolled. 47 --> 48 <div class="scrolled"></div> 49 </div> 50 51 <div class="fixed reftest-no-paint content"> 52 <!-- 53 This fixed layer gets its own PaintedLayer above the rest. 54 When the contents of .scrollable require their own PaintedLayer, that 55 should not cause .fixed to change layers. 56 --> 57 </div> 58 59 <script> 60 61 function doTest() { 62 document.querySelector("#aboutToScroll").scrollTop = 50 - document.querySelector("#aboutToScroll").scrollTop; 63 document.documentElement.removeAttribute("class"); 64 } 65 document.addEventListener("MozReftestInvalidate", doTest); 66 67 </script>