mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-27 10:07:15 +02:00
e49fe384d1
This change aligns the default roles for “th” and “td” elements with the requirements in the HTML-AAM spec, and with the corresponding WPT tests at https://wpt.fyi/results/html-aam/table-roles.html, and with the behavior in other engines. Otherwise, without this change, the default role values for “th” and “td” elements in some cases don’t match the behavior in other engines, and don’t match the expected results for the corresponding WPT tests.
148 lines
4.9 KiB
HTML
148 lines
4.9 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Table Role Verification Tests</title>
|
|
<script src="../../resources/testharness.js"></script>
|
|
<script src="../../resources/testharnessreport.js"></script>
|
|
<script src="../../resources/testdriver.js"></script>
|
|
<script src="../../resources/testdriver-vendor.js"></script>
|
|
<script src="../../resources/testdriver-actions.js"></script>
|
|
<script src="../../wai-aria/scripts/aria-utils.js"></script>
|
|
</head>
|
|
<body>
|
|
<p>Tests <a href="https://w3c.github.io/aria/#table">table</a> and related roles.</p>
|
|
|
|
<!-- HTML <table> Elements Testing -->
|
|
|
|
<!-- <caption> -> wpt/html-aam/table-roles.html -->
|
|
|
|
<!-- <table> -> wpt/html-aam/table-roles.html -->
|
|
<!-- <tbody> -> wpt/html-aam/table-roles.html -->
|
|
|
|
<!-- <td> -> wpt/html-aam/table-roles.html -->
|
|
|
|
<!-- <tfoot> -> wpt/html-aam/table-roles.html -->
|
|
|
|
<!-- <th> -> wpt/html-aam/table-roles.html -->
|
|
<!-- <thead> -> wpt/html-aam/table-roles.html -->
|
|
|
|
<!-- <tr> -> wpt/html-aam/table-roles.html -->
|
|
|
|
|
|
<!-- ARIA Grid Elements Testing -->
|
|
|
|
<!-- Grid roles tested in ./grid-roles.html -->
|
|
|
|
|
|
<!-- ARIA Table Roles Testing -->
|
|
|
|
<!-- caption -->
|
|
<div role="table">
|
|
<div role="caption" data-testname="div role is caption (in div with table role)" data-expectedrole="caption" class="ex">x</div>
|
|
</div>
|
|
|
|
<p role="caption" data-testname="orphan p role is caption" data-expectedrole="caption" class="ex">x</p>
|
|
|
|
<!-- cell -->
|
|
<div role="table">
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
</div>
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="cell" data-testname="span role is cell (in div with row role, in div with rowgroup role, in div with table role)" data-expectedrole="cell" class="ex">x</span>
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<span role="cell" data-testname="orphan span role is cell" data-expectedrole="cell" class="ex">x</span>
|
|
|
|
<!-- columnheader -->
|
|
<div role="table">
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="columnheader" data-testname="span role is columnheader (in div with row role, in div with rowgroup role, in div with table role)" data-expectedrole="columnheader" class="ex">x</span>
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
</div>
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="rowheader">x</span>
|
|
<span role="cell">x</span>
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- row -->
|
|
<div role="table">
|
|
<div role="rowgroup">
|
|
<div role="row" data-testname="div role is row (in div with rowgroup role, in div with table role)" data-expectedrole="row" class="ex">
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
</div>
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- rowgroup -->
|
|
<div role="table">
|
|
<div role="rowgroup" data-testname="div role is rowgroup (in div with table role)" data-expectedrole="rowgroup" class="ex">
|
|
<div role="row">
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
</div>
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="cell">x</span>
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- rowheader -->
|
|
<div role="table">
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
</div>
|
|
<div role="rowgroup">
|
|
<div role="row">
|
|
<span role="rowheader" data-testname="role is rowheader (in div with row role, in div with rowgroup role, in div with table role)" data-expectedrole="rowheader" class="ex">x</span>
|
|
<span role="cell">x</span>
|
|
<span role="cell">x</span>
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- table -->
|
|
<div role="table" data-testname="div role is table" data-expectedrole="table" class="ex">
|
|
<div role="row">
|
|
<span role="columnheader">x</span>
|
|
<span role="columnheader">x</span>
|
|
</div>
|
|
<div role="row">
|
|
<span role="cell">x</span>
|
|
<span role="cell">x</span>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
AriaUtils.verifyRolesBySelector(".ex");
|
|
</script>
|
|
|
|
</body>
|
|
</html> |