squizlabs / HTML_CodeSniffer

HTML_CodeSniffer is a client-side JavaScript application that checks a HTML document or source code, and detects violations of a defined coding standard. Comes with standards that cover the three conformance levels of the W3C's Web Content Accessibility Guidelines (WCAG) 2.0 and the U.S. Section 508 legislation.
https://squizlabs.github.io/HTML_CodeSniffer/
BSD 3-Clause "New" or "Revised" License
1.12k stars 246 forks source link

false positive for 'wider' nested th on table #285

Closed gypsydave5 closed 4 years ago

gypsydave5 commented 4 years ago

I think the following is a false positive. Given the following table:

onetwo
a
a one a two
b
b one b two
<table>
<thead>
  <tr><th id="one">one</th><th id="two">two</th></tr>
</thead>
<tbody>
  <tr><th colspan="2" id="a">a</th></tr>
  <tr>
    <td headers="a one">a one</td>
    <td headers="a two">a two</td>
  </tr>
</tbody>

<tbody>
  <tr><th colspan="2" id="b">b</th></tr>
  <tr>
    <td headers="b one">b one</td>
    <td headers="b two">b two</td>
  </tr>
</tbody>
</table>

returns the following errors:

Error: Incorrect headers attribute on this td element. Expected "a b one" but found "a one"
Error: Incorrect headers attribute on this td element. Expected "a b two" but found "a two"
Error: Incorrect headers attribute on this td element. Expected "a b one" but found "b one"
Error: Incorrect headers attribute on this td element. Expected "a b two" but found "b two"

These errors appear both on the HTML CodeSniffer website and when using pa11y, which has a dependency on the HTML CodeSniffer.

This example tutorial from WAI on W3 also fails.

Expectation

I'd expect there to be no error at all here; the tds are clearly related to only one of the headers above them, this is explicit both visually and in the markup.

ironikart commented 4 years ago

This is addressed with #290 and errors will no longer be shown for these types of tables.