third_party/WebKit/LayoutTests/fast/dom/elementsFromPoint/elementsFromPoint-table.html

   1 <!DOCTYPE HTML>
   2 <script src="../../../resources/js-test.js"></script>
   3 <script src="resources/elementsFromPoint.js"></script>
   4 <style>
   5 html, body {
   6     margin: 0;
   7     padding: 0;
   8 }
   9 #testtable {
  10     margin: 100px;
  11     width: 200px;
  12     height: 200px;
  13     background-color: rgba(0,180,0,0.2);
  14 }
  15 #testtable tr {
  16     background-color: rgba(180,0,0,0.2);
  17 }
  18 #testtable td {
  19     background-color: rgba(0,0,180,0.2);
  20 }
  21 .rtl {
  22     direction: rtl;
  23 }
  24 .tblr {
  25     -webkit-writing-mode: vertical-lr;
  26 }
  27 </style>
  28 <div id='sandbox'>
  29     <table id='testtable'>
  30         <tr id='tr1'>
  31             <td id='td11'></td>
  32             <td id='td12'></td>
  33             <td id='td13'></td>
  34             <td id='td14'></td>
  35         </tr>
  36         <tr id='tr2'>
  37             <td id='td21'></td>
  38             <td id='td22'></td>
  39             <td id='td23'></td>
  40             <td id='td24'></td>
  41         </tr>
  42         <tr id='tr3'>
  43             <td id='td31'></td>
  44             <td id='td32'></td>
  45             <td id='td33'></td>
  46             <td id='td34'></td>
  47         </tr>
  48         <tr id='tr4'>
  49             <td id='td41'></td>
  50             <td id='td42'></td>
  51             <td id='td43'></td>
  52             <td id='td44'></td>
  53         </tr>
  54     </table>
  55 </div>
  56 <div id="console"></div>
  57 <script>
  58 window.jsTestIsAsync = true;
  59
  60 if (window.testRunner)
  61     testRunner.dumpAsText();
  62
  63 if (window.internals)
  64     internals.settings.setMockScrollbarsEnabled(true);
  65
  66 onload = function() {
  67     // Check area hits fully inside table cells.
  68     assertElementsFromPoint('document.elementsFromPoint(125, 125)', [td11, testtable, sandbox, document.body, document.documentElement]);
  69     assertElementsFromPoint('document.elementsFromPoint(275, 125)', [td14, testtable, sandbox, document.body, document.documentElement]);
  70     assertElementsFromPoint('document.elementsFromPoint(175, 175)', [td22, testtable, sandbox, document.body, document.documentElement]);
  71     assertElementsFromPoint('document.elementsFromPoint(125, 275)', [td41, testtable, sandbox, document.body, document.documentElement]);
  72
  73     // Check area hits between cells.
  74     assertElementsFromPoint('document.elementsFromPoint(100, 100)', [testtable, sandbox, document.body, document.documentElement]);
  75     assertElementsFromPoint('document.elementsFromPoint(199, 199)', [testtable, sandbox, document.body, document.documentElement]);
  76
  77     // Check hit tests on right-to-left table.
  78     testtable.setAttribute('class', 'rtl');
  79     assertElementsFromPoint('document.elementsFromPoint(125, 125)', [td14, testtable, sandbox, document.body, document.documentElement]);
  80     assertElementsFromPoint('document.elementsFromPoint(275, 125)', [td11, testtable, sandbox, document.body, document.documentElement]);
  81     assertElementsFromPoint('document.elementsFromPoint(100, 100)', [testtable, sandbox, document.body, document.documentElement]);
  82     assertElementsFromPoint('document.elementsFromPoint(199, 199)', [testtable, sandbox, document.body, document.documentElement]);
  83
  84     // Check hit tests on a flipped (tb-lr) table.
  85     testtable.setAttribute('class', 'tblr');
  86     assertElementsFromPoint('document.elementsFromPoint(125, 275)', [td14, testtable, sandbox, document.body, document.documentElement]);
  87     assertElementsFromPoint('document.elementsFromPoint(275, 125)', [td41, testtable, sandbox, document.body, document.documentElement]);
  88     assertElementsFromPoint('document.elementsFromPoint(100, 100)', [testtable, sandbox, document.body, document.documentElement]);
  89     assertElementsFromPoint('document.elementsFromPoint(199, 199)', [testtable, sandbox, document.body, document.documentElement]);
  90
  91     finishJSTest();
  92 }
  93 </script>