span-limits.html - mozsearch

Enable keyboard shortcuts

This test has a WPT meta file that expects 2 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /html/semantics/tabular-data/processing-model-1/span-limits.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<title>Limits on colSpan/rowSpan</title>

<meta name="timeout" content="long">

<script src=/resources/testharness.js></script>

<script src=/resources/testharnessreport.js></script>

<div id=log></div>

<table border=1>

  <tr><td colspan=500>a<td colspan=500 id=a1>a

  <!-- This cell must span the previous two -->

  <tr><td colspan=1000 id=a2>a

</table>

<table border=1>

  <tr><td colspan=1000 id=b1>a<td>a

  <!-- This cell must span only the first cell in the previous row -->

  <tr><td colspan=1001 id=b2>a

</table>

<table border=1 style="float:left">

  <!-- The first column must go all the way down to the bottom -->

  <tr><td rowspan=65534 id=c1>a<td>

  <!-- We'll add another 65533 rows later -->

</table>

<table border=1>

  <!-- The first column must go one cell below the bottom -->

  <tr><td rowspan=65535 id=d1>a<td>

  <!-- We'll add another 65534 rows later -->

</table>

<table>

    <tr>

        <td id="rowspan-limit-test1" rowspan=5></td>

        <td id="rowspan-limit-test2" rowspan=0></td>

        <td id="rowspan-limit-test3" rowspan=1000></td>

        <td id="rowspan-limit-test4" rowspan=65534></td>

        <td id="rowspan-limit-test5" rowspan=65535></td>

        <td id="rowspan-limit-test6" rowspan=5555555></td>

    </tr>

</table>

<script>

var $ = document.querySelector.bind(document);

test(() => {

    assert_equals($("#a2").getBoundingClientRect().right,

                  $("#a1").getBoundingClientRect().right);

}, "colspan of 1000 must work");

test(() => {

    assert_equals($("#b2").getBoundingClientRect().right,

                  $("#b1").getBoundingClientRect().right);

}, "colspan of 1001 must be treated as 1000");

test(() => {

    var s = "";

    for (var i = 0; i < 65532; i++) {

      s += "<tr><td>";

    s += "<tr><td id=c2>";

    document.querySelectorAll("table")[2].firstElementChild.innerHTML += s;

    assert_equals($("#c1").getBoundingClientRect().bottom,

                  $("#c2").getBoundingClientRect().bottom);

}, "rowspan of 65534 must work");

test(() => {

    var s = "";

    for (var i = 0; i < 65532; i++) {

      s += "<tr><td>";

    s += "<tr><td id=d2><tr><td>a<td>";

    document.querySelectorAll("table")[3].firstElementChild.innerHTML += s;

    assert_equals($("#d1").getBoundingClientRect().bottom,

                  $("#d2").getBoundingClientRect().bottom);

}, "rowspan of 65535 must be treated as 65534");

test(() => {

    let td = document.createElement("td");

    td.rowSpan = 5;

    assert_equals(td.rowSpan, 5);

    td.rowSpan = 0;

    assert_equals(td.rowSpan, 0);

    td.rowSpan = 1000;

    assert_equals(td.rowSpan, 1000);

    td.rowSpan = 65534;

    assert_equals(td.rowSpan, 65534);

    td.rowSpan = 65535;

    assert_equals(td.rowSpan, 65534);

    td.rowSpan = 555555;

    assert_equals(td.rowSpan, 65534);

}, "rowspan must be clamped to [0, 65534] when set via script");

test(() => {

    assert_equals(document.getElementById("rowspan-limit-test1").rowSpan, 5);

    assert_equals(document.getElementById("rowspan-limit-test2").rowSpan, 0);

    assert_equals(document.getElementById("rowspan-limit-test3").rowSpan, 1000);

    assert_equals(document.getElementById("rowspan-limit-test4").rowSpan, 65534);

    assert_equals(document.getElementById("rowspan-limit-test5").rowSpan, 65534);

    assert_equals(document.getElementById("rowspan-limit-test6").rowSpan, 65534);

}, "rowspan must be clamped to [0, 65534] when parsing attributes");

</script>