jsx-eslint / eslint-plugin-jsx-a11y

Static AST checker for a11y rules on JSX elements.
MIT License
3.38k stars 637 forks source link

jsx-a11y/control-has-associated-label: dangerouslySetInnerHTML should pass? #954

Open thomasmattheussen opened 12 months ago

thomasmattheussen commented 12 months ago
<td
  dangerouslySetInnerHTML={parseMarkdownLinks(
    prop.description,
  )}
></td>

throws a jsx-a11y/control-has-associated-label error.

I believe this should pass in the same way as https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/64 ?

Also, the documentation says "Enforce that a control (an interactive element) has a text label." I was a bit confused because a <td> is not an interactive element I think?

ljharb commented 12 months ago

We can't parse HTMl in dangerouslySetInnerHTML, and in this case it's not even a static value, so there'd be nothing we can do (there's a reason it's "dangerous" and shouldn't be used).

I'm not sure why it's warning on a td. The example in #64 is because anything there ensures that the header has content; in this case, we'd need to know what the content is.

thomasmattheussen commented 11 months ago

I get the dynamic value issue, so feel free to close. (The HTML in this case is not dangerous at all btw, no worries of XSS).

I don't understand why a <td> can't be empty though?

ljharb commented 11 months ago

It definitely seems like a bug, to be clear - td isn't a control or a label, so it should just be ignoring it.