| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <style> | |
| 5 #transformedChild { | |
| 6 -webkit-transform: rotate3d(0.2, 1, 0, 35grad); | |
| 7 } | |
| 8 #absoluteChild { | |
| 9 position: absolute; | |
| 10 top: 300px; | |
| 11 } | |
| 12 #relativeChild { | |
| 13 position: relative; | |
| 14 top: 200px; | |
| 15 } | |
| 16 #overhangingContainer { | |
| 17 height: 10px; | |
| 18 } | |
| 19 #overhangingFloatingChild { | |
| 20 width: 100px; | |
| 21 float: left; | |
| 22 } | |
| 23 #tests { | |
| 24 font: 10px Ahem; | |
| 25 } | |
| 26 body { | |
| 27 height: 1000px; | |
| 28 } | |
| 29 </style> | |
| 30 </head> | |
| 31 <body> | |
| 32 <p id="description">This tests verifies the hit test regions given to the compos
itor. It can only be run in DumpRenderTree. | |
| 33 The outputted rects should cover the hit test regions of all the listed elements
.</p> | |
| 34 <div id="console"></div> | |
| 35 | |
| 36 <div id="tests"> | |
| 37 <div id="normalFlow"> | |
| 38 Lorem ipsum | |
| 39 <span>sum</span>. | |
| 40 </div> | |
| 41 <div id="absoluteChildContainer"> | |
| 42 Lorem ipsum | |
| 43 <span id="absoluteChild">Absolute child</span> | |
| 44 </div> | |
| 45 <div id="relativeChildContainer"> | |
| 46 Lorem ipsum | |
| 47 <span id="relativeChild">Relative child</span> | |
| 48 </div> | |
| 49 <div id="overhangingContainer"> | |
| 50 <div id="overhangingFloatingChild">Overhanging float overhanging
float overhanging float overhanging float</div> | |
| 51 </div> | |
| 52 <div id="transformedChildContainer"> | |
| 53 <div id="transformedChild">Transformed</div> | |
| 54 </div> | |
| 55 <div> | |
| 56 <b id="continuation">This b tag | |
| 57 <div>causes a</div> | |
| 58 continuation</b> | |
| 59 </div> | |
| 60 <div> | |
| 61 <span id="inlineAbsoluteChildContainer"> | |
| 62 Inline with absolute child. | |
| 63 <span id="absoluteChild">Absolute child in inline.</span
> | |
| 64 </span> | |
| 65 </div> | |
| 66 </div> | |
| 67 <script> | |
| 68 | |
| 69 | |
| 70 function listener() { } | |
| 71 | |
| 72 function log(msg) { | |
| 73 var span = document.createElement("span"); | |
| 74 document.getElementById("console").appendChild(span); | |
| 75 span.innerHTML = msg + '<br />'; | |
| 76 } | |
| 77 | |
| 78 function sortRects(a, b) { | |
| 79 return a.top - b.top; | |
| 80 } | |
| 81 | |
| 82 function testElementWithId(id) | |
| 83 { | |
| 84 element = document.getElementById(id); | |
| 85 element.addEventListener('touchstart', listener, false); | |
| 86 logRects(id); | |
| 87 element.removeEventListener('touchstart', listener, false); | |
| 88 } | |
| 89 | |
| 90 function logRects(testName) { | |
| 91 | |
| 92 rects = window.internals.touchEventTargetClientRects(document); | |
| 93 var sortedRects = new Array(); | |
| 94 for (var i = 0; i < rects.length; ++i) | |
| 95 sortedRects[i] = rects[i]; | |
| 96 sortedRects.sort(sortRects); | |
| 97 for (var i = 0; i < rects.length; ++i) | |
| 98 log(testName + "[" + i + "]: (" + sortedRects[i].left + ", " + s
ortedRects[i].top + ", " + sortedRects[i].width + ", " + sortedRects[i].height +
")"); | |
| 99 } | |
| 100 | |
| 101 function runTest() { | |
| 102 if (!window.testRunner) | |
| 103 return; | |
| 104 | |
| 105 window.testRunner.dumpAsText(); | |
| 106 testElementWithId("normalFlow"); | |
| 107 testElementWithId("absoluteChildContainer"); | |
| 108 testElementWithId("relativeChildContainer"); | |
| 109 testElementWithId("overhangingContainer"); | |
| 110 testElementWithId("transformedChildContainer"); | |
| 111 testElementWithId("continuation"); | |
| 112 testElementWithId("inlineAbsoluteChildContainer"); | |
| 113 | |
| 114 document.addEventListener('touchstart', listener, false); | |
| 115 logRects("document"); | |
| 116 | |
| 117 var testContainer = document.getElementById("tests"); | |
| 118 testContainer.parentNode.removeChild(testContainer); | |
| 119 } | |
| 120 | |
| 121 runTest(); | |
| 122 </script> | |
| 123 </body> | |
| OLD | NEW |