Codebase Browser
chromium
Go to App

chromium/third_party/blink/web_tests/tables/mozilla_expected_failures/core/captions2.html 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<head>

<Script>
function doIt() {
  var caption = document.getElementsByTagName("CAPTION")[1];
  var text = document.createTextNode("foo foo");
  caption.appendChild(text);

  var caption = document.getElementsByTagName("CAPTION")[2];
  var text = document.createTextNode("very_large_very_large");
  caption.appendChild(text);

  var caption = document.getElementsByTagName("CAPTION")[3];
  var input = document.getElementsByTagName("INPUT")[3];
  caption.removeChild(input);

  var cell = document.getElementsByTagName("TD")[17];
  var text = document.createTextNode("foo foo");
  cell.appendChild(text);

  var rg = document.getElementsByTagName("TBODY")[5];
  var row = document.createElement("tr", null);
  var cell = document.createElement("td", null);
  var text = document.createTextNode("foo foo");
  cell.appendChild(text);
  row.appendChild(cell);
  rg.appendChild(row);

  var table = document.getElementsByTagName("TABLE")[6];
  var cap = document.createElement("CAPTION", null);
  var text = document.createTextNode("new cap");
  cap.appendChild(text);
  table.appendChild(cap);

  var table = document.getElementsByTagName("TABLE")[7];
  var cap = document.getElementsByTagName("CAPTION")[7];
  table.removeChild(cap);


}
</SCRIPT>  
<style type="text/css">
table { border: 10px solid green; }
caption {
        border: medium solid purple;
        caption-side: top;
        }

table.one { margin-left:5px; margin-top:10px; margin-bottom:5px}
table.one caption { margin-left:10px; margin-top: 2px; }
</style>
</head>
<body onload="doIt()">
<center>bottom caption tests</center>
table 1 - original
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 2 - caption gains content
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 3 - caption gains content extending its max element size
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 4 - caption loses content
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 5 - table gets wider
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 6 - table gets taller
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 7 - insert caption
<table class="one">
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
table 8 - remove caption
<table class="one">
        <caption>caption<input type=radio></caption>
        <tr><td>Data</td><td>Data</td></tr>
        <tr><td>Data</td><td>Data</td></tr>
</table>
</body></html>