Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Table without table headers #562

Open
giacomo-petri opened this issue Sep 4, 2024 · 10 comments
Open

Table without table headers #562

giacomo-petri opened this issue Sep 4, 2024 · 10 comments
Assignees

Comments

@giacomo-petri
Copy link

The implicit role of <table> elements is always role="table".

However, when a table lacks headers, browsers handle it inconsistently:

  • Chrome treats it as a layout table (Chromium computer role: Null, Chrome exposed role: LayoutTable).
  • Safari treats it as a generic element (Role: No matching ARIA role).
  • Firefox still recognizes it as a table (Role: Table).

This inconsistency can create challenges for implementors implementing rules like ARIA in HTML, as it affects how table rules and related rules for descendant elements are applied.

It may be beneficial to clearly specify in the standards how user agents should handle tables without headers to ensure consistency.

@spectranaut
Copy link
Contributor

Discussed for a bit in triage at today's meeting: https://www.w3.org/2024/09/05-aria-minutes#t01

@aleventhal
Copy link
Collaborator

TBH anyone can do the work to compile the list of rules in each system for comparison since the code is heavily commented.

@fstrr
Copy link

fstrr commented Sep 5, 2024

I mentioned this What Even Is A Table presentation, from State Of The Browser 5 conference back in 2015, in this week's call. All the conference videos aren't online anymore, but I luckily took notes before the videos were removed. This was the list of findings, which may not be accurate anymore for the browsers that still exist, but do paint a picture of the complexity of browsers trying to decide whether a table is for layout or data:

  • A table with no headers and one row isn’t classed as a table by IE, Chrome, or Safari
  • A table with no headers, one row, and a summary is classed as a table by Chrome and Safari but not IE
  • A table with no headers and two rows is classed as a table in IE
  • A table with no headers but with a border:bottom on the table cells is classed as a table in all browsers
  • A table with no headers but with a background-color on the table cells is classed as a table in all browsers
  • A table with no headers, with a background-color on the table cells and border-collapse:collapse on the table isn’t classed as a table in Chrome or Safari
  • A table with no headers and 20 rows is classed as a table in IE, Chrome, and Safari
  • A table with headers and one row is classed as a table by all browsers
  • A table with headers but set to display:block isn’t classed as a table in Chrome or Safari

@fstrr
Copy link

fstrr commented Sep 5, 2024

Mmm. Looks like @aleventhal's links are probably more useful, although we're both missing Firefox. I've had a look in the Gecko-Dev repo, but nothing obvious jumped out at me.

@aleventhal
Copy link
Collaborator

@fstrr
Copy link

fstrr commented Sep 5, 2024

@jnurthen yup! Nice :)

@scottaohara
Copy link
Member

related - #293

@kerlysboordank

This comment was marked as spam.

@spectranaut spectranaut removed the Agenda label Oct 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

9 participants