OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="../../fast/repaint/resources/text-based-repaint.js"></script> | |
3 <script> | |
4 function repaintTest() { | |
5 document.getElementById('overflow1').style.overflow = "visible"; | |
6 document.getElementById('overflow2').style.overflow = "hidden"; | |
7 } | |
8 onload = runRepaintAndPixelTest; | |
9 </script> | |
10 <style> | 2 <style> |
11 body { | 3 body { |
12 margin: 0; | 4 margin: 0; |
13 } | 5 } |
14 #overflow1 { | 6 #overflow1 { |
| 7 overflow: visible; |
| 8 width: 200px; |
| 9 height: 200px; |
| 10 } |
| 11 #overflow2 { |
15 overflow: hidden; | 12 overflow: hidden; |
16 width: 200px; | 13 width: 200px; |
17 height: 200px; | 14 height: 200px; |
18 } | 15 } |
19 #overflow2 { | |
20 overflow: visible; | |
21 width: 200px; | |
22 height: 200px; | |
23 } | |
24 .composited-child { | 16 .composited-child { |
25 width: 100px; | 17 width: 100px; |
26 height: 100px; | 18 height: 100px; |
27 background-color: green; | 19 background-color: green; |
28 backface-visibility: hidden; | 20 backface-visibility: hidden; |
29 } | 21 } |
30 .overflow-child { | 22 .overflow-child { |
31 position: relative; | 23 position: relative; |
32 top: 50px; | 24 top: 50px; |
33 left: 150px; | 25 left: 150px; |
34 } | 26 } |
35 </style> | 27 </style> |
36 <!-- We should not repaint composited descendants on overflow style changes (ver
ified with the text expectation). | 28 <!-- We should not repaint composited descendants on overflow style changes (ver
ified with the text expectation). |
37 The compositor should handle any visual change caused by the change of overflow
clipping (verified with the pixel expectation). --> | 29 The compositor should handle any visual change caused by the change of overflow
clipping (verified with the pixel expectation). --> |
38 <div id="overflow1"> | 30 <div id="overflow1"> |
39 <div class="composited-child"></div> | 31 <div class="composited-child"></div> |
40 <div class="composited-child overflow-child"></div> | 32 <div class="composited-child overflow-child"></div> |
41 </div> | 33 </div> |
42 <div id="overflow2"> | 34 <div id="overflow2"> |
43 <div class="composited-child"></div> | 35 <div class="composited-child"></div> |
44 <div class="composited-child overflow-child"></div> | 36 <div class="composited-child overflow-child"></div> |
45 </div> | 37 </div> |
OLD | NEW |