Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

A11Y and HTML validation tools

See original GitHub issue


We need tools to:

  • check that the HTML we produce is robust (tags are closed, attributes are closed and not duplicated, etc.),
  • check things related to a11y that can be checked automatically (alt attributes, aria usage, etc.).


After asking on the Lit slack, we think we could rely on 3 layers:

  • linting and checking in the editor (easy since it relies on the a11y lit eslint plugin),
  • automated and exhaustive testing, to be used before committing for instance ? (would rely on Open WC Chai Axe, as explained earlier),
  • specific and more thorough testing for complex components, to be used before committing just to make sure nothing ever breaks in there without us noticing it ? (would rely on Modern Web Test Runner - a11y snapshot command). This last one looks quite specific and heavy because it generates an accessible tree so that you can check it. That’s why we would only use it for a few components.

What’s missing / Up for debate

From what I’ve tested, all these tools mainly focus on a11y and some basic HTML checks (tags must be closed, etc.). We’re still missing some pieces for HTML checking:

  • Content models: for instance, buttons are phrasing contents. They only accept phrasing content as descendants. Using a <div> inside it should raise an error but it does not in these tools. They only check stuff directly related to a11y. We used to consider this an accessibility issue but this is debatable (they are considering removing html validation checking from WCAG + I fail to see the issues it could actually cause).
  • [Need more testing, I’ll edit later… 😅 ]

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:7 (7 by maintainers)

github_iconTop GitHub Comments

hsablonnierecommented, Jun 6, 2022

I think someone in the Lit & Friends Slack mentioned something once.

hsablonnierecommented, Jul 13, 2022

I think I would like to have something automated for all components/stories. Having e2e tests for some components is a different topic.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Web Accessibility Evaluation Tools List - W3C
a11yTools is a collection of HTML Web Accessibility Testing Tools in one location on your iPhone and iPad for quick and easy Accessibility...
Read more >
WAVE Web Accessibility Evaluation Tools
WAVE ® is a suite of evaluation tools that helps authors make their web content more accessible to individuals with disabilities. WAVE can...
Read more >
8 Free Web-Based Website Accessibility Evaluation Tools
8 Free Web-Based Website Accessibility Evaluation Tools · 1. Intent Based – Accessibility Checker · 2. AChecker – Accessibility Checker · 3. Cynthia...
Read more >
Top 20 Accessibility Testing Tools for Web Applications
Top 20 Accessibility Testing Tools for Web Applications · #1) QualityLogic · #2) WAVE · #3) JAWS · #4) Dynomapper · #5) SortSite...
Read more >
Accessibility Testing with CSS HTML Validator Software
CSS HTML Validator Home, Pro or Enterprise Software for Windows (formerly CSE HTML Validator) is a powerful tool that can be used to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found