diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-tables/table-model-fixup.html')
| -rw-r--r-- | testing/web-platform/tests/css/css-tables/table-model-fixup.html | 125 |
1 files changed, 125 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-tables/table-model-fixup.html b/testing/web-platform/tests/css/css-tables/table-model-fixup.html new file mode 100644 index 0000000000..13af8b9db4 --- /dev/null +++ b/testing/web-platform/tests/css/css-tables/table-model-fixup.html @@ -0,0 +1,125 @@ +<!doctype html> +<script src='/resources/testharness.js'></script> +<script src='/resources/testharnessreport.js'></script> +<link rel='stylesheet' href='./support/base.css' /> +<link rel="help" href="https://drafts.csswg.org/css-tables-3/#fixup"> +<main> + + <h1>Table fixup</h1> + <p>Check that missing elements are being created properly</p> + + <hr/> + <p>This should be a 100px by 100px blue square:</p> + <p>1.1. Children of a table-column are treated as if they had display: none.</p> + <div style="width: 100px; height: 100px; background: blue;"><x-col><div id="target1" style="display: block!important; visibility: visible!important; width: 100px; height: 100px; background: red;"></div></x-col></div> + + <hr/> + <p>This should be a 100px by 100px blue square:</p> + <p>1.2. Children of a table-column-group which are not a table-column are treated as if they had display: none.</p> + <div style="width: 100px; height: 100px; background: blue;"><x-colgroup><div id="target2" style="display: block!important; visibility: visible!important; width: 100px; height: 100px; background: red;"></div></x-colgroup></div> + + <hr/> + <p>This should be a 100px by 100px blue square:</p> + <p>2.1. An anonymous table-row box must be generated around each sequence of consecutive children of a table-root box which are not proper table child boxes. </p> + <x-table><x-td id="target3" style="width: 50%; height: 0px; background: blue;"></x-td> <x-td style="width: 50px; height: 100px; background: blue;"></x-td></x-table> + + <hr/> + <p>This should read as "1\t2\t3\n x":</p> + <p>2.2. An anonymous table-row box must be generated around each sequence of consecutive children of a table-row-grouping box which are not table-row boxes.</p> + <x-table><x-tbody> + <span id="target4a">1</span> + <x-col style="width: 100px"></x-col> + <x-td id="target4b">2</x-td> + <span id="target4c">3</span> + <x-caption id="target4d">x</x-caption> + </x-tbody><x-col style="width: 50px"></x-col><x-col style="width: 50px"></x-col><x-col style="width: 50px"></x-col></x-table> + + <hr/> + <p>This should read as "1\n1\t2":</p> + <p>2.1. and 2.2. happens before 2.3.</p> + <x-table> + <span id="target5a">1</span> + <x-col style="width: 50px"></x-col> + <x-td id="target5b">1</x-td> + <span id="target5c">2</span> + </x-table> + + <hr/> + <p>This should read as "1\t2":</p> + <p>3.2. An anonymous table or inline-table box must be generated around each sequence of consecutive proper table child box which are misparented</p> + <table><tr><td id="target6a">1</td><td style="display: table-caption" id="target6b">2</td></tr><col style="width: 50px"></x-col></table> + + <hr/> + <p>This should read as "A B":</p> + <p>1.4. Anonymous inline boxes which contains only white space and are between two immediate siblings *each* of which is a table-non-root element, are treated as if they had display: none.</p> + <x-table><x-tr> <span id="target7a">A</span> <span id="target7b">B</span> </x-tr></x-table> + +</main> + +<script> + while(true) { + var xtd = document.querySelector('x-td[rowspan], x-td[colspan]'); if(!xtd) break; + var td = document.createElement('td'); for(var i = xtd.attributes.length; i--;) { td.setAttribute(xtd.attributes[i].name,xtd.attributes[i].value) } + xtd.parentNode.replaceChild(td,xtd); + } + + var i = 1; + generate_tests(assert_equals, [ + [ + "1.1. Children of a table-column are treated as if they had display: none.", + document.querySelector("div[style*='red']#target"+(i++)+"").offsetWidth, + 0 + ], + [ + "1.2. Children of a table-column-group which are not a table-column are treated as if they had display: none.", + document.querySelector("div[style*='red']#target"+(i++)+"").offsetWidth, + 0 + ], + [ + "2.1. An anonymous table-row box must be generated around each sequence of consecutive children of a table-root box which are not proper table child boxes. (1/2)", + document.querySelector("#target"+(i++)+"").offsetWidth, + 50 + ], + [ + "2.1. An anonymous table-row box must be generated around each sequence of consecutive children of a table-root box which are not proper table child boxes. (2/2)", + document.querySelector("#target"+(i-1)+"").offsetHeight, + 100 + ], + [ + "2.2. An anonymous table-row box must be generated around each sequence of consecutive children of a table-row-grouping box which are not table-row boxes. (1/3)", + document.querySelector("#target"+(i++)+"b").offsetLeft - document.querySelector("#target"+(i-1)+"a").offsetLeft, + 50 + ], + [ + "2.2. An anonymous table-row box must be generated around each sequence of consecutive children of a table-row-grouping box which are not table-row boxes. (2/3)", + document.querySelector("#target"+(i-1)+"c").offsetLeft - document.querySelector("#target"+(i-1)+"a").offsetLeft, + 100 + ], + [ + "2.2. An anonymous table-row box must be generated around each sequence of consecutive children of a table-row-grouping box which are not table-row boxes. (3/3)", + document.querySelector("#target"+(i-1)+"d").offsetLeft, + document.querySelector("#target"+(i-1)+"c").offsetLeft + ], + [ + "2.3 happens after 2.1. and 2.2. (1/2)", + document.querySelector("#target"+(i++)+"b").offsetLeft < 25, + true + ], + [ + "2.3 happens after 2.1. and 2.2. (2/2)", + document.querySelector("#target"+(i-1)+"c").offsetLeft > 50, + true + ], + [ + "3.2. An anonymous table or inline-table box must be generated around each sequence of consecutive proper table child box which are misparented", + document.querySelector("#target"+(i++)+"b").offsetLeft > document.querySelector("#target"+(i-1)+"a").offsetLeft, + true + ], + [ + "1.4. Anonymous inline boxes which contains only white space and are between two immediate siblings *each* of which is a table-non-root element, are treated as if they had display: none.", + document.querySelector("#target"+(i++)+"b").offsetLeft > 1 + document.querySelector("#target"+(i-1)+"a").offsetLeft + document.querySelector("#target"+(i-1)+"a").offsetWidth, + true + ], + ]) + +</script> |