third_party/WebKit/LayoutTests/fast/table/hittest-tablecell-right-edge.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 <script>
   6 function test()
   7 {
   8     description("An event generated on the edge of a table cell is not being consumed by the appropriate underlying element. This test verifies that the hittest result on the right edge of a table cell returns the proper underlying element.");
   9
  10     var ele = {};
  11     ['tr1-td1', 'tr1-td2', 'tr1-td3', 'tr1-td4',
  12      'tr2-td1', 'tr2-td2', 'tr2-td3', 'tr2-td4',
  13      'tr3-td1', 'tr3-td2', 'tr3-td3', 'tr3-td4',
  14      'tr4-td1', 'tr4-td2', 'tr4-td3', 'tr4-td4'].forEach(function(a) {
  15         ele[a] = document.getElementById(a);
  16         hittest(ele[a], a);
  17         ele[a].innerHTML = '';
  18     });
  19
  20     isSuccessfullyParsed();
  21 }
  22 function hittest(ele, orgElement, expected1, expected2)
  23 {
  24     edge = ele.getBoundingClientRect().right;
  25     middleY = ele.getBoundingClientRect().bottom / 2;
  26     debug('Executing for element '+orgElement+' on the right edge of the table cell:');
  27
  28     switch (orgElement) {
  29         case ('tr1-td1'):
  30                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr1-td1'");
  31                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr1-td2'");
  32                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr1-td2'");
  33                 break;
  34         case ('tr1-td2'):
  35                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr1-td2'");
  36                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr1-td4'");
  37                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr1-td4'");
  38                 break;
  39         case ('tr1-td3'):
  40                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr1-td2'");
  41                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr1-td4'");
  42                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr1-td4'");
  43                 break;
  44         case ('tr1-td4'):
  45                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr1-td4'");
  46                 shouldBe("document.elementFromPoint(edge, middleY).id", "''");
  47                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "''");
  48                 break;
  49         case ('tr2-td1'):
  50                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr2-td1'");
  51                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr2-td2'");
  52                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr2-td2'");
  53                 break;
  54         case ('tr2-td2'):
  55         case ('tr2-td3'):
  56                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr2-td2'");
  57                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr2-td4'");
  58                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr2-td4'");
  59                 break;
  60         case ('tr2-td4'):
  61                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr2-td4'");
  62                 shouldBe("document.elementFromPoint(edge, middleY).id", "''");
  63                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "''");
  64                 break;
  65         case ('tr3-td1'):
  66         case ('tr3-td2'):
  67         case ('tr3-td3'):
  68         case ('tr3-td4'):
  69                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "''");
  70                 shouldBe("document.elementFromPoint(edge, middleY).id", "''");
  71                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "''");
  72                 break;
  73         case ('tr4-td1'):
  74                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr4-td1'");
  75                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr4-td2'");
  76                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr4-td2'");
  77                 break;
  78         case ('tr4-td2'):
  79                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr4-td2'");
  80                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr4-td4'");
  81                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr4-td4'");
  82                 break;
  83         case ('tr4-td3'):
  84                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "''");
  85                 shouldBe("document.elementFromPoint(edge, middleY).id", "'tr4-td4'");
  86                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "'tr4-td4'");
  87                 break;
  88         case ('tr4-td4'):
  89                 shouldBe("document.elementFromPoint(edge - 1, middleY).id", "'tr4-td4'");
  90                 shouldBe("document.elementFromPoint(edge, middleY).id", "''");
  91                 shouldBe("document.elementFromPoint(edge + 1, middleY).id", "''");
  92                 break;
  93         default:
  94                 break;
  95     }
  96 }
  97 </script>
  98 <style>
  99     table
 100     {
 101         border-spacing: 0px;
 102         font-size: 1000%;
 103     }
 104     td { padding: 0px; }
 105 </style>
 106 </head>
 107 <body onload="test()">
 108     <p>Test for Bugzilla <a href="https://bugs.webkit.org/show_bug.cgi?id=74864">Bug 74864</a>: There is additional space not belonged to a table between the table cells.</p>
 109     <table cellspacing=0>
 110         <tr id="tr1">
 111             <td id="tr1-td1">1</td>
 112             <td id="tr1-td2">1</td>
 113             <td id="tr1-td3"></td>
 114             <td id="tr1-td4">1</td>
 115         </tr>
 116         <tr id="tr2">
 117             <td id="tr2-td1">1</td>
 118             <td id="tr2-td2">1</td>
 119             <td id="tr2-td3"></td>
 120             <td id="tr2-td4">1</td>
 121         </tr>
 122         <tr id="tr3">
 123             <td id="tr3-td1"></td>
 124             <td id="tr3-td2"></td>
 125             <td id="tr3-td3"></td>
 126             <td id="tr3-td4"></td>
 127         </tr>
 128         <tr id="tr4">
 129             <td id="tr4-td1">1</td>
 130             <td id="tr4-td2">1</td>
 131             <td id="tr4-td3"></td>
 132             <td id="tr4-td4">1</td>
 133         </tr>
 134     </table>
 135     <p id="description"></p>
 136     <div id="console"></div>
 137 </body>
 138 </html>