OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <html> | |
3 | |
4 <head> | |
5 <script src="../../fast/repaint/resources/text-based-repaint.js"></script> | |
6 <style> | |
7 | |
8 .fixedContainer { | |
9 position: fixed; | |
10 overflow:hidden; | |
11 background-color: #a0a0a0; | |
12 bottom: 0px; | |
13 left: 0px; | |
14 width:400px; | |
15 height: 100px; | |
16 } | |
17 | |
18 #foo { | |
19 width:200px; | |
20 height: 100px; | |
21 background-color: #00a0a0; | |
22 transform:translateZ(0); | |
23 } | |
24 </style> | |
25 | |
26 <script> | |
27 if (window.internals) { | |
28 /* Note carefully, compositing for fixed position is _disabled_ here */ | |
29 internals.settings.setPreferCompositingToLCDTextEnabled(false); | |
30 } | |
31 | |
32 function repaintTest() | |
33 { | |
34 window.scrollTo(0, 100); | |
35 } | |
36 </script> | |
37 </head> | |
38 | |
39 <body style="height:4000px;" onload="runRepaintTest()"> | |
40 <!-- | |
41 Among other duplicate bugs: https://code.google.com/p/chromium/issues/det
ail?id=151734 | |
42 | |
43 In the current code, a layer may actually be composited, but not have its
own backing store. | |
44 In these cases, the layer paints into its composited ancestor with a back
ing store. | |
45 For fixed-position elements, however, this goes wrong because no other co
de | |
46 realizes that there is a software-painted fixed-position element. As a r
esult, | |
47 the composited parent does not receive repaint invalidations, and the fix
ed-position | |
48 element incorrectly appears to be fixed to the composited element rather
than the viewport. | |
49 | |
50 The scenario that reproduces this: A fixed position element that has an
overflow-clip with | |
51 a composited child. In this case, the fixed-position element needs to be
composited. | |
52 However, this is one of the few reasons that does not require that the co
mposited layer needs | |
53 its own backing store. | |
54 --> | |
55 | |
56 <!-- Scrolling should not cause either div to move around on the viewport. --> | |
57 <div class="fixedContainer"> | |
58 <div id="foo"></div> | |
59 </div> | |
60 </body> | |
61 | |
62 </html> | |
OLD | NEW |