| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <script src="resources/text-based-repaint.js" type="text/javascript"></script> | 2 <script src="resources/text-based-repaint.js" type="text/javascript"></script> |
| 3 <style> | 3 <style> |
| 4 #outer { | 4 #outer { |
| 5 overflow: scroll; | 5 overflow: scroll; |
| 6 width: 300px; | 6 width: 300px; |
| 7 height: 300px; | 7 height: 300px; |
| 8 background-color: blue; | 8 background-color: blue; |
| 9 position: absolute; | 9 position: absolute; |
| 10 } | 10 } |
| 11 #container { | 11 #container { |
| 12 position: absolute; | 12 position: absolute; |
| 13 top: 0px; | 13 top: 0px; |
| 14 left: 50px; | 14 left: 50px; |
| 15 width: 600px; | 15 width: 600px; |
| 16 height: 600px; | 16 height: 600px; |
| 17 background-color: red; | 17 background-color: red; |
| 18 transform: translateZ(0); | 18 transform: translateZ(0); |
| 19 } | 19 } |
| 20 </style> | 20 </style> |
| 21 <body onload="runRepaintTest()"> | 21 <body onload="runRepaintAndPixelTest()"> |
| 22 <div id="outer"> | 22 <div id="outer"> |
| 23 <div id="container"><div id="inner"></div></div> | 23 <div id="container"><div id="inner"></div></div> |
| 24 </div> | 24 </div> |
| 25 | 25 |
| 26 <script> | 26 <script> |
| 27 function repaintTest() { | 27 function repaintTest() { |
| 28 // This test ensures we properly paint composited descendants of clipped | 28 // This test ensures we properly paint composited descendants of clipped |
| 29 // ancestors in the invalidateTree step. Composited children can be moved | 29 // ancestors in the invalidateTree step. Composited children can be moved |
| 30 // around in respect to their clipping ancestors without needing to be | 30 // around in respect to their clipping ancestors without needing to be |
| 31 // repainted (and will have their clip applied directly by the CC), so | 31 // repainted (and will have their clip applied directly by the CC), so |
| 32 // Blink needs to ignore their ancestor's clip rects to properly paint. | 32 // Blink needs to ignore their ancestor's clip rects to properly paint. |
| 33 // We can't just change the background color, because that gets repainted | 33 // We can't just change the background color, because that gets repainted |
| 34 // in style recalc and doesn't tickle the bug. | 34 // in style recalc and doesn't tickle the bug. |
| 35 document.querySelector('#inner').style.border = '300px solid green'; | 35 document.querySelector('#inner').style.border = '300px solid green'; |
| 36 document.querySelector('#outer').scrollLeft = 500; | 36 document.querySelector('#outer').scrollLeft = 500; |
| 37 } | 37 } |
| 38 </script> | 38 </script> |
| OLD | NEW |