Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(3)

Side by Side Diff: third_party/WebKit/LayoutTests/compositing/squashing/squash-above-fixed-1-expected.txt

Issue 2406723002: Auto-rebaseline for r424089 (Closed)
Patch Set: Created 4 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 The gray div is a composited fixed-position element, and the cyan/lime elements should be squashed together on top. When scrolling, paragraphs may pop in-and-ou t of the squashing layer when they change overlapping status with respect to the composited layer underneath. 1 The gray div is a composited fixed-position element, and the cyan/lime elements should be squashed together on top. When scrolling, paragraphs may pop in-and-ou t of the squashing layer when they change overlapping status with respect to the composited layer underneath.
2 2
3 This scenario tests (1) that content repaints correctly as layers pop in and out of squashing, and (2) that the positioning of the squashing layer remains corre ct (i.e. scrolls properly) when the squashing layer is on top of a fixed-positio n composited layer. 3 This scenario tests (1) that content repaints correctly as layers pop in and out of squashing, and (2) that the positioning of the squashing layer remains corre ct (i.e. scrolls properly) when the squashing layer is on top of a fixed-positio n composited layer.
4 4
5 CASE 1, original layer tree: 5 CASE 1, original layer tree:
6 { 6 {
7 "name": "Content Root Layer", 7 "layers": [
8 "bounds": [785, 1400],
9 "children": [
10 { 8 {
11 "name": "LayoutView #document", 9 "name": "LayoutView #document",
12 "bounds": [785, 1400], 10 "bounds": [785, 1400],
13 "contentsOpaque": true, 11 "contentsOpaque": true,
12 "drawsContent": true
13 },
14 {
15 "name": "LayoutBlockFlow (positioned) DIV class='composited background'",
16 "position": [100, 150],
17 "bounds": [300, 300],
18 "contentsOpaque": true,
14 "drawsContent": true, 19 "drawsContent": true,
15 "children": [ 20 "backgroundColor": "#D3D3D3"
16 { 21 },
17 "name": "LayoutBlockFlow (positioned) DIV class='composited background '", 22 {
18 "position": [100, 150], 23 "name": "Squashing Containment Layer",
19 "bounds": [300, 300], 24 "shouldFlattenTransform": false
20 "contentsOpaque": true, 25 },
21 "drawsContent": true, 26 {
22 "backgroundColor": "#D3D3D3" 27 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-b' class= 'overlapping lime'",
23 }, 28 "position": [0, 100],
24 { 29 "bounds": [200, 100],
25 "name": "Squashing Containment Layer", 30 "contentsOpaque": true,
26 "shouldFlattenTransform": false, 31 "drawsContent": true,
27 "children": [ 32 "backgroundColor": "#00FF00"
28 { 33 },
29 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-b ' class='overlapping lime'", 34 {
30 "position": [0, 100], 35 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class='overlapping cyan')",
31 "bounds": [200, 100], 36 "position": [0, 200],
32 "contentsOpaque": true, 37 "bounds": [200, 300],
33 "drawsContent": true, 38 "drawsContent": true
34 "backgroundColor": "#00FF00"
35 },
36 {
37 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (r elative positioned) DIV id='paragraph-c' class='overlapping cyan')",
38 "position": [0, 200],
39 "bounds": [200, 300],
40 "drawsContent": true
41 }
42 ]
43 }
44 ]
45 } 39 }
46 ] 40 ]
47 } 41 }
48 CASE 2, scrolling y to 80, new layers will be squashed, so things repaint: 42 CASE 2, scrolling y to 80, new layers will be squashed, so things repaint:
49 { 43 {
50 "name": "Content Root Layer", 44 "layers": [
51 "bounds": [785, 1400],
52 "children": [
53 { 45 {
54 "name": "LayoutView #document", 46 "name": "LayoutView #document",
55 "bounds": [785, 1400], 47 "bounds": [785, 1400],
56 "contentsOpaque": true, 48 "contentsOpaque": true,
57 "drawsContent": true, 49 "drawsContent": true,
58 "paintInvalidations": [ 50 "paintInvalidations": [
59 { 51 {
60 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' class='overlapping lime'", 52 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' class='overlapping lime'",
61 "rect": [0, 500, 200, 100], 53 "rect": [0, 500, 200, 100],
62 "reason": "subtree" 54 "reason": "subtree"
(...skipping 11 matching lines...) Expand all
74 { 66 {
75 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'", 67 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'",
76 "rect": [0, 100, 200, 100], 68 "rect": [0, 100, 200, 100],
77 "reason": "subtree" 69 "reason": "subtree"
78 }, 70 },
79 { 71 {
80 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class='overlapping cyan'", 72 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class='overlapping cyan'",
81 "rect": [0, 0, 200, 100], 73 "rect": [0, 0, 200, 100],
82 "reason": "subtree" 74 "reason": "subtree"
83 } 75 }
84 ], 76 ]
85 "children": [ 77 },
78 {
79 "name": "LayoutBlockFlow (positioned) DIV class='composited background'",
80 "position": [100, 230],
81 "bounds": [300, 300],
82 "contentsOpaque": true,
83 "drawsContent": true,
84 "backgroundColor": "#D3D3D3"
85 },
86 {
87 "name": "Squashing Containment Layer",
88 "shouldFlattenTransform": false
89 },
90 {
91 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class= 'overlapping cyan'",
92 "position": [0, 200],
93 "bounds": [200, 100],
94 "contentsOpaque": true,
95 "drawsContent": true,
96 "backgroundColor": "#00FFFF",
97 "paintInvalidations": [
86 { 98 {
87 "name": "LayoutBlockFlow (positioned) DIV class='composited background '", 99 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class='overlapping cyan'",
88 "position": [100, 230], 100 "rect": [0, 0, 200, 100],
89 "bounds": [300, 300], 101 "reason": "compositing update"
90 "contentsOpaque": true, 102 }
91 "drawsContent": true, 103 ]
92 "backgroundColor": "#D3D3D3" 104 },
105 {
106 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime')",
107 "position": [0, 300],
108 "bounds": [200, 300],
109 "drawsContent": true,
110 "paintInvalidations": [
111 {
112 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' class='overlapping lime'",
113 "rect": [0, 200, 200, 100],
114 "reason": "compositing update"
93 }, 115 },
94 { 116 {
95 "name": "Squashing Containment Layer", 117 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-e' class='overlapping cyan'",
96 "shouldFlattenTransform": false, 118 "rect": [0, 100, 200, 100],
97 "children": [ 119 "reason": "compositing update"
98 { 120 },
99 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c ' class='overlapping cyan'", 121 {
100 "position": [0, 200], 122 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'",
101 "bounds": [200, 100], 123 "rect": [0, 0, 200, 100],
102 "contentsOpaque": true, 124 "reason": "compositing update"
103 "drawsContent": true,
104 "backgroundColor": "#00FFFF",
105 "paintInvalidations": [
106 {
107 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-c' class='overlapping cyan'",
108 "rect": [0, 0, 200, 100],
109 "reason": "compositing update"
110 }
111 ]
112 },
113 {
114 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (r elative positioned) DIV id='paragraph-d' class='overlapping lime')",
115 "position": [0, 300],
116 "bounds": [200, 300],
117 "drawsContent": true,
118 "paintInvalidations": [
119 {
120 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-f' class='overlapping lime'",
121 "rect": [0, 200, 200, 100],
122 "reason": "compositing update"
123 },
124 {
125 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-e' class='overlapping cyan'",
126 "rect": [0, 100, 200, 100],
127 "reason": "compositing update"
128 },
129 {
130 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-d' class='overlapping lime'",
131 "rect": [0, 0, 200, 100],
132 "reason": "compositing update"
133 }
134 ]
135 }
136 ]
137 } 125 }
138 ] 126 ]
139 } 127 }
140 ], 128 ],
141 "objectPaintInvalidations": [ 129 "objectPaintInvalidations": [
142 { 130 {
143 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' clas s='overlapping cyan'", 131 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' clas s='overlapping cyan'",
144 "reason": "subtree" 132 "reason": "subtree"
145 }, 133 },
146 { 134 {
(...skipping 25 matching lines...) Expand all
172 "reason": "compositing update" 160 "reason": "compositing update"
173 }, 161 },
174 { 162 {
175 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' clas s='overlapping lime'", 163 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' clas s='overlapping lime'",
176 "reason": "compositing update" 164 "reason": "compositing update"
177 } 165 }
178 ] 166 ]
179 } 167 }
180 CASE 3, scrolling y to 120, no repaints expected: 168 CASE 3, scrolling y to 120, no repaints expected:
181 { 169 {
182 "name": "Content Root Layer", 170 "layers": [
183 "bounds": [785, 1400],
184 "children": [
185 { 171 {
186 "name": "LayoutView #document", 172 "name": "LayoutView #document",
187 "bounds": [785, 1400], 173 "bounds": [785, 1400],
188 "contentsOpaque": true, 174 "contentsOpaque": true,
175 "drawsContent": true
176 },
177 {
178 "name": "LayoutBlockFlow (positioned) DIV class='composited background'",
179 "position": [100, 270],
180 "bounds": [300, 300],
181 "contentsOpaque": true,
189 "drawsContent": true, 182 "drawsContent": true,
190 "children": [ 183 "backgroundColor": "#D3D3D3"
191 { 184 },
192 "name": "LayoutBlockFlow (positioned) DIV class='composited background '", 185 {
193 "position": [100, 270], 186 "name": "Squashing Containment Layer",
194 "bounds": [300, 300], 187 "shouldFlattenTransform": false
195 "contentsOpaque": true, 188 },
196 "drawsContent": true, 189 {
197 "backgroundColor": "#D3D3D3" 190 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c' class= 'overlapping cyan'",
198 }, 191 "position": [0, 200],
199 { 192 "bounds": [200, 100],
200 "name": "Squashing Containment Layer", 193 "contentsOpaque": true,
201 "shouldFlattenTransform": false, 194 "drawsContent": true,
202 "children": [ 195 "backgroundColor": "#00FFFF"
203 { 196 },
204 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-c ' class='overlapping cyan'", 197 {
205 "position": [0, 200], 198 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime')",
206 "bounds": [200, 100], 199 "position": [0, 300],
207 "contentsOpaque": true, 200 "bounds": [200, 300],
208 "drawsContent": true, 201 "drawsContent": true
209 "backgroundColor": "#00FFFF"
210 },
211 {
212 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (r elative positioned) DIV id='paragraph-d' class='overlapping lime')",
213 "position": [0, 300],
214 "bounds": [200, 300],
215 "drawsContent": true
216 }
217 ]
218 }
219 ]
220 } 202 }
221 ] 203 ]
222 } 204 }
223 CASE 4, scrolling y to 170 new layers will be squashed, so things repaint: 205 CASE 4, scrolling y to 170 new layers will be squashed, so things repaint:
224 { 206 {
225 "name": "Content Root Layer", 207 "layers": [
226 "bounds": [785, 1400],
227 "children": [
228 { 208 {
229 "name": "LayoutView #document", 209 "name": "LayoutView #document",
230 "bounds": [785, 1400], 210 "bounds": [785, 1400],
231 "contentsOpaque": true, 211 "contentsOpaque": true,
232 "drawsContent": true, 212 "drawsContent": true,
233 "paintInvalidations": [ 213 "paintInvalidations": [
234 { 214 {
235 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-g' class='overlapping cyan'", 215 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-g' class='overlapping cyan'",
236 "rect": [0, 600, 200, 100], 216 "rect": [0, 600, 200, 100],
237 "reason": "subtree" 217 "reason": "subtree"
(...skipping 11 matching lines...) Expand all
249 { 229 {
250 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-e' class='overlapping cyan'", 230 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-e' class='overlapping cyan'",
251 "rect": [0, 100, 200, 100], 231 "rect": [0, 100, 200, 100],
252 "reason": "subtree" 232 "reason": "subtree"
253 }, 233 },
254 { 234 {
255 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'", 235 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'",
256 "rect": [0, 0, 200, 100], 236 "rect": [0, 0, 200, 100],
257 "reason": "subtree" 237 "reason": "subtree"
258 } 238 }
259 ], 239 ]
260 "children": [ 240 },
241 {
242 "name": "LayoutBlockFlow (positioned) DIV class='composited background'",
243 "position": [100, 320],
244 "bounds": [300, 300],
245 "contentsOpaque": true,
246 "drawsContent": true,
247 "backgroundColor": "#D3D3D3"
248 },
249 {
250 "name": "Squashing Containment Layer",
251 "shouldFlattenTransform": false
252 },
253 {
254 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class= 'overlapping lime'",
255 "position": [0, 300],
256 "bounds": [200, 100],
257 "contentsOpaque": true,
258 "drawsContent": true,
259 "backgroundColor": "#00FF00",
260 "paintInvalidations": [
261 { 261 {
262 "name": "LayoutBlockFlow (positioned) DIV class='composited background '", 262 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' class='overlapping lime'",
263 "position": [100, 320], 263 "rect": [0, 0, 200, 100],
264 "bounds": [300, 300], 264 "reason": "compositing update"
265 "contentsOpaque": true, 265 }
266 "drawsContent": true, 266 ]
267 "backgroundColor": "#D3D3D3" 267 },
268 {
269 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (relative positioned) DIV id='paragraph-e' class='overlapping cyan')",
270 "position": [0, 400],
271 "bounds": [200, 300],
272 "drawsContent": true,
273 "paintInvalidations": [
274 {
275 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-g' class='overlapping cyan'",
276 "rect": [0, 200, 200, 100],
277 "reason": "compositing update"
268 }, 278 },
269 { 279 {
270 "name": "Squashing Containment Layer", 280 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' class='overlapping lime'",
271 "shouldFlattenTransform": false, 281 "rect": [0, 100, 200, 100],
272 "children": [ 282 "reason": "compositing update"
273 { 283 },
274 "name": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d ' class='overlapping lime'", 284 {
275 "position": [0, 300], 285 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-e' class='overlapping cyan'",
276 "bounds": [200, 100], 286 "rect": [0, 0, 200, 100],
277 "contentsOpaque": true, 287 "reason": "compositing update"
278 "drawsContent": true,
279 "backgroundColor": "#00FF00",
280 "paintInvalidations": [
281 {
282 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-d' class='overlapping lime'",
283 "rect": [0, 0, 200, 100],
284 "reason": "compositing update"
285 }
286 ]
287 },
288 {
289 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (r elative positioned) DIV id='paragraph-e' class='overlapping cyan')",
290 "position": [0, 400],
291 "bounds": [200, 300],
292 "drawsContent": true,
293 "paintInvalidations": [
294 {
295 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-g' class='overlapping cyan'",
296 "rect": [0, 200, 200, 100],
297 "reason": "compositing update"
298 },
299 {
300 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-f' class='overlapping lime'",
301 "rect": [0, 100, 200, 100],
302 "reason": "compositing update"
303 },
304 {
305 "object": "LayoutBlockFlow (relative positioned) DIV id='parag raph-e' class='overlapping cyan'",
306 "rect": [0, 0, 200, 100],
307 "reason": "compositing update"
308 }
309 ]
310 }
311 ]
312 } 288 }
313 ] 289 ]
314 } 290 }
315 ], 291 ],
316 "objectPaintInvalidations": [ 292 "objectPaintInvalidations": [
317 { 293 {
318 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' clas s='overlapping lime'", 294 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-d' clas s='overlapping lime'",
319 "reason": "subtree" 295 "reason": "subtree"
320 }, 296 },
321 { 297 {
(...skipping 24 matching lines...) Expand all
346 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' clas s='overlapping lime'", 322 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-f' clas s='overlapping lime'",
347 "reason": "compositing update" 323 "reason": "compositing update"
348 }, 324 },
349 { 325 {
350 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-g' clas s='overlapping cyan'", 326 "object": "LayoutBlockFlow (relative positioned) DIV id='paragraph-g' clas s='overlapping cyan'",
351 "reason": "compositing update" 327 "reason": "compositing update"
352 } 328 }
353 ] 329 ]
354 } 330 }
355 331
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698