third_party/WebKit/LayoutTests/fast/table/cell-change-baseline-then-border.html

   1 <!DOCTYPE html>
   2 <style>
   3 table {
   4   border-collapse: separate;
   5 }
   6 #cell {
   7   width: 200px;
   8   height: 24px;
   9   border: 1px solid red;
  10   vertical-align: baseline;
  11 }
  12 #input {
  13   display: block;
  14   width: 100%;
  15   height: 100%;
  16   border: none;
  17 }
  18 </style>
  19 <script src="../../resources/run-after-layout-and-paint.js"></script>
  20 <script>
  21 if (window.testRunner)
  22   testRunner.waitUntilDone();
  23
  24 runAfterLayoutAndPaint(function() {
  25   var cell = document.getElementById('cell');
  26   var input = document.getElementById('input');
  27   // Baseline of the table cell will change when the input is set a text.
  28   input.value = 'abc';
  29   runAfterLayoutAndPaint(function() {
  30     cell.style.borderColor = 'green';
  31     runAfterLayoutAndPaint(function() {
  32       if (window.testRunner)
  33         testRunner.notifyDone();
  34     });
  35   });
  36 });
  37 </script>
  38 Tests layout and painting of table cell after baseline and border changes.
  39 <table>
  40   <tr>
  41     <td id="cell">
  42       <input id="input">
  43     </td>
  44   </tr>
  45 </table>