LayoutTests/accessibility/mac/table-headers-attribute.html

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../resources/accessibility-helper.js"></script>
<script src="../../resources/js-test.js"></script>
</head>
<body>

<table border="1" cellpadding="5" cellspacing="2" id="table">
  <tbody>
    <tr>
      <th id="header1" scope="col" abbr="Name">Course Name</th>
      <th id="header2" scope="col" abbr="Tutor">Course Tutor</th>
      <th id="header3" scope="col">Summary</th>
      <th id="header4" scope="col">Code</th>
      <th id="header5" scope="col" colspan="2">Fee</th>
    </tr>
    <tr>
      <td id="cell1" headers="header1 header3 header5">After the Civil War</td>
      <td id="cell2" headers="header4 header3 header6">Dr. John Wroughton</td>
      <td>October</td>
      <td>H27</td>
      <td>£32</td>
      <td>£32</td>
    </tr>
  </tbody>
</table>

<script>
    var testOutput = "This tests that the headers attribute returns the correct headers for a table cell.\n\n";

    if (window.accessibilityController) {
        window.jsTestIsAsync = true;

        var table, cell1, colHeaders, cell2;
        setTimeout(async function() {
            table = accessibilityController.accessibleElementById("table");

            // The first cell references header1 header3 header5.
            cell1 = table.cellForColumnAndRow(0, 1);
            colHeaders = cell1.columnHeaders();
            testOutput += expect("colHeaders.length", "3");
            testOutput += expect("colHeaders[0].isEqual(table.cellForColumnAndRow(0, 0))", "true");
            testOutput += expect("colHeaders[1].isEqual(table.cellForColumnAndRow(2, 0))", "true");
            testOutput += expect("colHeaders[2].isEqual(table.cellForColumnAndRow(4, 0))", "true");

            // The second cell references header4 header3 and a non-existent header6.
            cell2 = table.cellForColumnAndRow(1, 1);
            colHeaders = cell2.columnHeaders();
            testOutput += expect("colHeaders.length", "2");
            testOutput += expect("colHeaders[0].isEqual(table.cellForColumnAndRow(3, 0))", "true");
            testOutput += expect("colHeaders[1].isEqual(table.cellForColumnAndRow(2, 0))", "true");

            testOutput += "\nChanging `headers` attribute of #cell2 to be 'header1'.\n";
            document.getElementById("cell2").setAttribute("headers", "header1");
            testOutput += await expectAsync("cell2.columnHeaders()[0].isEqual(table.cellForColumnAndRow(0, 0))", "true");

            debug(testOutput);
            finishJSTest();
        }, 0);
    }
</script>
</body>
</html>