| <!-- Based on fast/repaint/table-section-repaint.html --> |
| <html> |
| <head> |
| <title>Test for http://bugs.webkit.org/show_bug.cgi?id=12079</title> |
| <style type="text/css"> |
| div.playground { position: relative; width: 90px; height: 90px; } |
| .red { background-color: yellow; } |
| .blue { background-color: blue; } |
| .green { background-color: green; } |
| .zero { height: 0; width: 60px; } |
| .half { height: 30px; width: 60px; } |
| .full { height: 60px; width: 60px; } |
| </style> |
| <script src="resources/paint-invalidation-test.js" type="text/javascript"></script> |
| <script type="text/javascript"> |
| window.expectedPaintInvalidationObjects = [ |
| "LayoutBlockFlow CAPTION id='caption1' class='blue half'", |
| "LayoutTableSection TBODY", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='red half'", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='green half'", |
| "LayoutTableCell TD", |
| "LayoutBlockFlow DIV id='top' class='blue half'", |
| "LayoutTableSection TBODY", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='red half'", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='green half'", |
| "LayoutBlockFlow CAPTION id='caption2' class='zero'", |
| "LayoutTableSection TBODY", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='green half'", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='red half'", |
| "LayoutTable TABLE", |
| "LayoutBlockFlow DIV id='innerDiv'", |
| "LayoutTableSection TBODY", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='half'", |
| "LayoutTableRow TR", |
| "LayoutTableCell TD class='half'", |
| ]; |
| function paintInvalidationTest() |
| { |
| var caption1 = document.getElementById("caption1"); |
| caption1.style.height = "0"; |
| |
| var caption2 = document.getElementById("caption2"); |
| caption2.style.height = "30px"; |
| |
| var top = document.getElementById("top"); |
| top.style.height = "0"; |
| |
| var top = document.getElementById("innerDiv"); |
| innerDiv.style.height = "15px"; |
| } |
| </script> |
| </head> |
| <body onload="runPaintInvalidationTest()"> |
| <div class="playground"> |
| <table cellpadding="0" cellspacing="0"> |
| <caption id="caption1" class="blue half"></caption> |
| <tbody> |
| <tr> |
| <td class="red half"></td> |
| </tr> |
| <tr> |
| <td class="green half"></td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| |
| <div class="playground"> |
| <table cellpadding="0" cellspacing="0"> |
| <tbody> |
| <tr> |
| <td><div id="top" class="blue half"></div></td> |
| </tr> |
| </tbody> |
| <tbody> |
| <tr> |
| <td class="red half"></td> |
| </tr> |
| <tr> |
| <td class="green half"></td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| |
| <div class="playground"> |
| <table cellpadding="0" cellspacing="0"> |
| <caption id="caption2" class="zero"></caption> |
| <tbody> |
| <tr> |
| <td class="green half"></td> |
| </tr> |
| <tr> |
| <td class="red half"></td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| |
| <div class="playground" style="margin-top: 30px;"> |
| <table cellpaddin="0" cellspacing="0" style="width: 60px; border-collapse: collapse; border: 8px solid green;"> |
| <caption style="width: 10px; margin: auto;"> |
| <div id="innerDiv"></div> |
| </caption> |
| <tbody> |
| <tr><td class="half"></td></tr> |
| <tr><td class="half" style="border-top: solid yellow 8px;"></td></tr> |
| </tbody> |
| </table> |
| </div> |
| </body> |
| </html> |
