Description
I know we've already talked about tables and browser heuristics (e.g., w3c/html-aam#562), but I have a few interesting examples where tables behave differently across browsers. It might be worth starting a WPT test; while it can certainly be improved to clarify a broader range of scenarios, it would at least serve as a solid starting point for some simple cases.
Example 1
Layout table with invalid role
<table role="invalid_role">
<tbody>
<tr>
<td>15%</td>
</tr>
</tbody>
</table>
- Chrome exposes this example as a table (role table)
- Firefox exposes this example as a table (role table)
- Safari ignores the role (I believe Safari has the expected behaviour)
Example 2
Layout table with role that requires acc name, but without acc name
<table role="region">
<tbody>
<tr>
<td>15%</td>
</tr>
</tbody>
</table>
- Chrome exposes this example as a table (role table)
- Firefox exposes this example as a table (role table), but its children are generic!?
- Safari ignores the role (role region requires an acc name, otherwise it's treated as generic; I believe Safari is correct)
Example 3
Layout table with role that requires acc name and with acc name
<table role="region" aria-label="region">
<tbody>
<tr>
<td>15%</td>
</tr>
</tbody>
</table>
All browsers expose the table element as a region, thanks to its explicit role and its acc name.
Example 4
Layout table? with role that requires acc name, but without acc name (same as Example 2) but with a descendant td with attr headers
<table role="region">
<td id="self" headers="self">World</td>
</table>
All browsers expose the table element as a table, but Firefox treats its children as generic.
I'll create a WPT test for these examples.
Note:
There is no official documentation on how these cases should be handled, but I believe there is some rationale behind their expected behavior.
@cookiecrook, do you think they should be treated as tentative by using a role value that no tool would recognize, or is it better to assign a role that aligns with expected behavior?