OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 | |
3 <html><head> | |
4 <style> | |
5 .filler { | |
6 background-color: #CC9900; | |
7 border-style: solid; | |
8 border-width: 1px; | |
9 width: 400px; | |
10 height: 100px; | |
11 } | |
12 | |
13 .negativechild { | |
14 z-index: -1; | |
15 position: relative; | |
16 } | |
17 | |
18 #parentscrollinglayer { | |
19 background-color: #CC9999; | |
20 height: 200px; | |
21 width: 500px; | |
22 overflow-y: scroll; | |
23 } | |
24 | |
25 #childscrollinglayer { | |
26 position: relative; | |
27 background-color: #990066; | |
28 height: 200px; | |
29 width: 300px; | |
30 overflow-x: scroll; | |
31 } | |
32 </style> | |
33 | |
34 <script src="resources/build-paint-order-lists.js"></script> | |
35 <script> | |
36 var debugMode = false; | |
37 | |
38 if (window.internals) | |
39 window.internals.settings.setAcceleratedCompositingForOverflowScrollEnable
d(true); | |
40 | |
41 if (window.testRunner) | |
42 testRunner.dumpAsText(); | |
43 | |
44 function write(str) | |
45 { | |
46 var pre = document.getElementById('console'); | |
47 var text = document.createTextNode(str + '\n'); | |
48 pre.appendChild(text); | |
49 } | |
50 | |
51 function getStackingOrder() | |
52 { | |
53 var divElements = []; | |
54 // Force a style recalc. | |
55 document.body.offsetTop; | |
56 | |
57 var stackingOrder = window.internals.nodesFromRect(document, 100, 75, 200,
200, 200, 200, false, false, false); | |
58 | |
59 for (var i = 0; i < stackingOrder.length; ++i) | |
60 if (stackingOrder[i].nodeName === "DIV") | |
61 divElements.push(stackingOrder[i]); | |
62 | |
63 return divElements; | |
64 } | |
65 | |
66 function compareStackingOrderWithPaintOrder(stackingOrder, paintOrder) | |
67 { | |
68 if (debugMode) { | |
69 write("paint:") | |
70 for (var i = 0; i < paintOrder.length; i++) | |
71 write(paintOrder[i].id + " " + paintOrder[i].className + " " + paintOr
der[i].tagName); | |
72 | |
73 write("stacking:") | |
74 for (var i = 0; i < stackingOrder.length; i++) | |
75 write(stackingOrder[i].id + " " + stackingOrder[i].className + " " + s
tackingOrder[i].tagName); | |
76 } | |
77 | |
78 for (var i = 0, j = 0; i < stackingOrder.length && j < paintOrder.length;
i++) { | |
79 // Ignore elements with class "filler negativechild". These elements are | |
80 // irrelevant to stacking order, since they do not overlap with the | |
81 // elements we care about. They exist in the paint order lists because | |
82 // they are still descendants of the same stacking context, but they | |
83 // will not affect visual layout. | |
84 while (j < paintOrder.length && paintOrder[paintOrder.length - j - 1].cl
assName === "filler negativechild") | |
85 j++; | |
86 | |
87 if (j >= paintOrder.length) | |
88 break; | |
89 | |
90 if (stackingOrder[i] === paintOrder[paintOrder.length - j - 1]) | |
91 j++; | |
92 } | |
93 | |
94 if (debugMode) | |
95 write(stackingOrder.length + " " + i + " " + paintOrder.length + " " + j
); | |
96 | |
97 return j === paintOrder.length; | |
98 } | |
99 | |
100 function doTest() | |
101 { | |
102 var parentscrollinglayer = document.getElementById('parentscrollinglayer')
; | |
103 var childscrollinglayer = document.getElementById('childscrollinglayer'); | |
104 | |
105 if (window.internals) { | |
106 var failure = false; | |
107 | |
108 // Here we want to compare paint order lists before and after promotion | |
109 // to the actual stacking order as determined by hit-testing. So we | |
110 // first force the element not to promote, then compute its paint and | |
111 // stacking order lists. We then force the element to opt in, and | |
112 // generate the paint and stacking order lists after opt-in. | |
113 // | |
114 // The paint order lists should exactly match the stacking order lists | |
115 // (modulo children that fall outside of the hit-testing area | |
116 // on-screen), both before and after promotion. | |
117 parentscrollinglayer.style.webkitTransform = 'translateZ(0px)'; | |
118 document.body.offsetTop; | |
119 | |
120 window.internals.setNeedsCompositedScrolling(parentscrollinglayer, | |
121 window.internals.COMPOSITED_SCROLLING_ALWAYS_OFF); | |
122 parentscrollinglayer.style.webkitTransform = ''; | |
123 | |
124 var oldStackingOrder = getStackingOrder(); | |
125 var oldPaintOrder = getPaintOrder(childscrollinglayer); | |
126 | |
127 window.internals.setNeedsCompositedScrolling(parentscrollinglayer, | |
128 window.internals.COMPOSITED_SCROLLING_ALWAYS_ON); | |
129 parentscrollinglayer.style.webkitTransform = 'translateZ(0px)'; | |
130 | |
131 var newStackingOrder = getStackingOrder(); | |
132 var newPaintOrder = getPaintOrder(childscrollinglayer); | |
133 | |
134 window.internals.setNeedsCompositedScrolling(parentscrollinglayer, | |
135 window.internals.DO_NOT_FORCE_COMPOSITED_SCROLLING); | |
136 | |
137 // The getPaintOrder() function should return a pair of paint orders. | |
138 // One before promotion and one after. This pair of lists should remain | |
139 // identical whether the element is actually currently promoted or not, | |
140 // its purpose is to generate hypothetical pre- and post-lists to | |
141 // determine if the element is promotable. | |
142 if (!comparePaintOrderLists(oldPaintOrder, newPaintOrder)) { | |
143 failure = true; | |
144 write("FAIL - paint order lists not identical before/after promotion")
; | |
145 } | |
146 | |
147 if (!compareStackingOrderWithPaintOrder(oldStackingOrder, oldPaintOrder.
beforePromote)) { | |
148 failure = true; | |
149 write("FAIL - paint order list before promote doesn't match stacking o
rder"); | |
150 } | |
151 | |
152 if (!compareStackingOrderWithPaintOrder(newStackingOrder, oldPaintOrder.
afterPromote)) { | |
153 failure = true; | |
154 write("FAIL - paint order list after promote doesn't match stacking or
der"); | |
155 } | |
156 | |
157 var childScrollingLayerOccurrences = countOccurrencesOfElementInPaintOrd
erList(oldPaintOrder.beforePromote, childscrollinglayer); | |
158 if (childScrollingLayerOccurrences !== 1) { | |
159 failure = true; | |
160 write("FAIL - paint order list before promote contains " + childScroll
ingLayerOccurrences + " occurrences of child scrolling layer. Should be exactly
1."); | |
161 } | |
162 | |
163 childScrollingLayerOccurrences = countOccurrencesOfElementInPaintOrderLi
st(oldPaintOrder.afterPromote, childscrollinglayer); | |
164 if (childScrollingLayerOccurrences !== 1) { | |
165 failure = true; | |
166 write("FAIL - paint order list after promote contains " + childScrolli
ngLayerOccurrences + " occurrences of child scrolling layer. Should be exactly 1
."); | |
167 } | |
168 | |
169 if(!failure) | |
170 write("PASS - did not crash."); | |
171 } | |
172 } | |
173 | |
174 window.addEventListener('load', doTest, false); | |
175 </script> | |
176 </head> | |
177 <body> | |
178 <div class="filler"></div> | |
179 <div id="parentscrollinglayer"> | |
180 <div id="childscrollinglayer"> | |
181 <div class="filler"></div> | |
182 </div> | |
183 <div class="filler"></div> | |
184 <div class="filler"></div> | |
185 </div> | |
186 <div id="fillerchild1" class="filler negativechild"></div> | |
187 <div id="fillerchild2" class="filler negativechild"></div> | |
188 <div id="fillerchild3" class="filler negativechild"></div> | |
189 <div id="fillerchild4" class="filler negativechild"></div> | |
190 <pre id="console"></pre> | |
191 </body> | |
192 </html> | |
OLD | NEW |