| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <style> | 4 <style> |
| 5 #transformedChild { | 5 #transformedChild { |
| 6 -webkit-transform: rotate3d(0.2, 1, 0, 35grad); | 6 -webkit-transform: rotate3d(0.2, 1, 0, 35grad); |
| 7 } | 7 } |
| 8 #absoluteChild { | 8 #absoluteChild { |
| 9 position: absolute; | 9 position: absolute; |
| 10 top: 300px; | 10 top: 300px; |
| (...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 47 <div id="overhangingFloatingChild">Overhanging float overhanging
float overhanging float overhanging float</div> | 47 <div id="overhangingFloatingChild">Overhanging float overhanging
float overhanging float overhanging float</div> |
| 48 </div> | 48 </div> |
| 49 <div id="transformedChildContainer"> | 49 <div id="transformedChildContainer"> |
| 50 <div id="transformedChild">Transformed</div> | 50 <div id="transformedChild">Transformed</div> |
| 51 </div> | 51 </div> |
| 52 <div> | 52 <div> |
| 53 <b id="continuation">This b tag | 53 <b id="continuation">This b tag |
| 54 <div>causes a</div> | 54 <div>causes a</div> |
| 55 continuation</b> | 55 continuation</b> |
| 56 </div> | 56 </div> |
| 57 <div> |
| 58 <span id="inlineAbsoluteChildContainer"> |
| 59 Inline with absolute child. |
| 60 <span id="absoluteChild">Absolute child in inline.</span
> |
| 61 </span> |
| 62 </div> |
| 57 </div> | 63 </div> |
| 58 <script> | 64 <script> |
| 59 if (!window.testRunner) | |
| 60 return; | |
| 61 | 65 |
| 62 window.testRunner.dumpAsText(); | |
| 63 | 66 |
| 64 function listener() { } | 67 function listener() { } |
| 65 | 68 |
| 66 function log(msg) { | |
| 67 var span = document.createElement("span"); | |
| 68 document.getElementById("console").appendChild(span); | |
| 69 span.innerHTML = msg + '<br />'; | |
| 70 } | |
| 71 | |
| 72 function sortRects(a, b) { | |
| 73 return a.top - b.top; | |
| 74 } | |
| 75 | |
| 76 function logRects(id) { | |
| 77 element = document.getElementById(id); | |
| 78 element.addEventListener('touchstart', listener, false); | |
| 79 rects = window.internals.touchEventTargetClientRects(document); | |
| 80 var sortedRects = new Array(); | |
| 81 for (var i = 0; i < rects.length; ++i) | |
| 82 sortedRects[i] = rects[i]; | |
| 83 sortedRects.sort(sortRects); | |
| 84 for (var i = 0; i < rects.length; ++i) | |
| 85 log(id + "[" + i + "]: (" + sortedRects[i].left + ", " + sortedR
ects[i].top + ", " + sortedRects[i].width + ", " + sortedRects[i].height + ")"); | |
| 86 element.removeEventListener('touchstart', listener, false); | |
| 87 } | |
| 88 | |
| 89 logRects("normalFlow"); | |
| 90 logRects("absoluteChildContainer"); | |
| 91 logRects("relativeChildContainer"); | |
| 92 logRects("overhangingContainer"); | |
| 93 logRects("transformedChildContainer"); | |
| 94 logRects("continuation"); | |
| 95 | |
| 96 var testContainer = document.getElementById("tests"); | |
| 97 testContainer.parentNode.removeChild(testContainer); | |
| 98 | |
| 99 </script> | |
| 100 </body> | |
| 101 <!DOCTYPE html> | |
| 102 <html> | |
| 103 <head> | |
| 104 <style> | |
| 105 #transformedChild { | |
| 106 -webkit-transform: rotate3d(0.2, 1, 0, 35grad); | |
| 107 } | |
| 108 #absoluteChild { | |
| 109 position: absolute; | |
| 110 top: 300px; | |
| 111 } | |
| 112 #relativeChild { | |
| 113 position: relative; | |
| 114 top: 200px; | |
| 115 } | |
| 116 #overhangingContainer { | |
| 117 height: 10px; | |
| 118 } | |
| 119 #overhangingFloatingChild { | |
| 120 width: 100px; | |
| 121 float: left; | |
| 122 } | |
| 123 #tests { | |
| 124 font: 10px Ahem; | |
| 125 } | |
| 126 </style> | |
| 127 </head> | |
| 128 <body> | |
| 129 <p id="description">This tests verifies the hit test regions given to the compos
itor. It can only be run in DumpRenderTree. | |
| 130 The outputted rects should cover the hit test regions of all the listed elements
.</p> | |
| 131 <div id="console"></div> | |
| 132 | |
| 133 <div id="tests"> | |
| 134 <div id="normalFlow"> | |
| 135 Lorem ipsum | |
| 136 <span>sum</span>. | |
| 137 </div> | |
| 138 <div id="absoluteChildContainer"> | |
| 139 Lorem ipsum | |
| 140 <span id="absoluteChild">Absolute child</span> | |
| 141 </div> | |
| 142 <div id="relativeChildContainer"> | |
| 143 Lorem ipsum | |
| 144 <span id="relativeChild">Relative child</span> | |
| 145 </div> | |
| 146 <div id="overhangingContainer"> | |
| 147 <div id="overhangingFloatingChild">Overhanging float overhanging
float overhanging float overhanging float</div> | |
| 148 </div> | |
| 149 <div id="transformedChildContainer"> | |
| 150 <div id="transformedChild">Transformed</div> | |
| 151 </div> | |
| 152 <div> | |
| 153 <b id="continuation">This b tag | |
| 154 <div>causes a</div> | |
| 155 continuation</b> | |
| 156 </div> | |
| 157 </div> | |
| 158 <script> | |
| 159 if (!window.testRunner) | |
| 160 return; | |
| 161 | |
| 162 window.testRunner.dumpAsText(); | |
| 163 | |
| 164 function listener() { } | |
| 165 | |
| 166 function log(msg) { | 69 function log(msg) { |
| 167 var span = document.createElement("span"); | 70 var span = document.createElement("span"); |
| 168 document.getElementById("console").appendChild(span); | 71 document.getElementById("console").appendChild(span); |
| 169 span.innerHTML = msg + '<br />'; | 72 span.innerHTML = msg + '<br />'; |
| 170 } | 73 } |
| 171 | 74 |
| 172 function sortRects(a, b) { | 75 function sortRects(a, b) { |
| 173 return a.top - b.top; | 76 return a.top - b.top; |
| 174 } | 77 } |
| 175 | 78 |
| 176 function logRects(id) { | 79 function logRects(id) { |
| 177 element = document.getElementById(id); | 80 element = document.getElementById(id); |
| 178 element.addEventListener('touchstart', listener, false); | 81 element.addEventListener('touchstart', listener, false); |
| 179 rects = window.internals.touchEventTargetClientRects(document); | 82 rects = window.internals.touchEventTargetClientRects(document); |
| 180 var sortedRects = new Array(); | 83 var sortedRects = new Array(); |
| 181 for (var i = 0; i < rects.length; ++i) | 84 for (var i = 0; i < rects.length; ++i) |
| 182 sortedRects[i] = rects[i]; | 85 sortedRects[i] = rects[i]; |
| 183 sortedRects.sort(sortRects); | 86 sortedRects.sort(sortRects); |
| 184 for (var i = 0; i < rects.length; ++i) | 87 for (var i = 0; i < rects.length; ++i) |
| 185 log(id + "[" + i + "]: (" + sortedRects[i].left + ", " + sortedR
ects[i].top + ", " + sortedRects[i].width + ", " + sortedRects[i].height + ")"); | 88 log(id + "[" + i + "]: (" + sortedRects[i].left + ", " + sortedR
ects[i].top + ", " + sortedRects[i].width + ", " + sortedRects[i].height + ")"); |
| 186 element.removeEventListener('touchstart', listener, false); | 89 element.removeEventListener('touchstart', listener, false); |
| 187 } | 90 } |
| 188 | 91 |
| 189 logRects("normalFlow"); | 92 function runTest() { |
| 190 logRects("absoluteChildContainer"); | 93 » if (!window.testRunner) |
| 191 logRects("relativeChildContainer"); | 94 » » return; |
| 192 logRects("overhangingContainer"); | |
| 193 logRects("transformedChildContainer"); | |
| 194 logRects("continuation"); | |
| 195 | 95 |
| 196 var testContainer = document.getElementById("tests"); | 96 » window.testRunner.dumpAsText(); |
| 197 testContainer.parentNode.removeChild(testContainer); | 97 » logRects("normalFlow"); |
| 98 » logRects("absoluteChildContainer"); |
| 99 » logRects("relativeChildContainer"); |
| 100 » logRects("overhangingContainer"); |
| 101 » logRects("transformedChildContainer"); |
| 102 » logRects("continuation"); |
| 103 » logRects("inlineAbsoluteChildContainer"); |
| 198 | 104 |
| 105 var testContainer = document.getElementById("tests"); |
| 106 testContainer.parentNode.removeChild(testContainer); |
| 107 } |
| 108 |
| 109 runTest(); |
| 199 </script> | 110 </script> |
| 200 </body> | 111 </body> |
| OLD | NEW |