| <!DOCTYPE html> |
| <style> |
| table { |
| border-collapse: separate; |
| } |
| #cell { |
| width: 200px; |
| height: 24px; |
| border: 1px solid red; |
| vertical-align: baseline; |
| } |
| #input { |
| display: block; |
| width: 100%; |
| height: 100%; |
| border: none; |
| } |
| </style> |
| <script src="../../resources/run-after-layout-and-paint.js"></script> |
| <script> |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| |
| runAfterLayoutAndPaint(function() { |
| var cell = document.getElementById('cell'); |
| var input = document.getElementById('input'); |
| // Baseline of the table cell will change when the input is set a text. |
| input.value = 'abc'; |
| runAfterLayoutAndPaint(function() { |
| cell.style.borderColor = 'green'; |
| runAfterLayoutAndPaint(function() { |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| }); |
| }); |
| }); |
| </script> |
| Tests layout and painting of table cell after baseline and border changes. |
| <table> |
| <tr> |
| <td id="cell"> |
| <input id="input"> |
| </td> |
| </tr> |
| </table> |
