Skip to main content
WCAGrules
Quick navigation

Services · By framework

A Web Components Audit, Because Shadow DOM Has Real Consequences

For the design-system or product team shipping custom elements, who wants to know how they behave once they are composed into real pages rather than sitting on a demo.

What We Keep Finding

A custom element with no deliberate semantics is not a badly labeled control. It is not a control at all. It has no role in the accessibility tree, which means the automated rules that check names and roles never apply to it, because every one of them starts by asking what role the element has. So a broken custom element does not fail a scan. It vanishes from it. That is a mystery box to a screen reader and a blank space to a tool, which is a worse combination than an ordinary bug.

The reference problem is the one everybody has heard of, and the half nobody has heard of is the useful half. An aria-labelledby attribute pointing across a shadow boundary points at nothing, because those references are matched by id and ids do not cross shadow roots. There is now a JavaScript route that does cross, available in current browsers since April 2025, and it works in exactly one direction. An element inside a shadow root can reference something in the document that contains it. The document cannot reference anything inside a component. So your labelling API has to be built inside out, and any page trying to point at a control inside your custom element is pointing at nothing whichever mechanism it reaches for.

Then there is what your components do to each other once composed. Slotted content is written in one order and rendered in another. So the reading order a user hears is not the order in the markup, and that is a real failure with a real rule behind it. One thing that is not a failure, and this comes up in every design system review. A component rendering a heading at one level and landing inside a section at another is untidy. The standard sets no rule about heading nesting, and none about how many top-level headings a page may have. We will flag it as a defect in your system. We will not file it as a conformance failure, because it is not one.

Design systems raise the stakes on all of it. One broken component, everywhere it is used, in every product that adopted the system. That is the argument for auditing the components rather than the pages, and it is also why we test them composed together and not one at a time on a demo page.

What We Check

  • Test each custom element for name, role, state, and keyboard support
  • Check every cross-boundary reference, and which direction it needs to run in
  • Verify focus enters, moves within, and leaves each component predictably
  • Audit slotted content for the order it actually reads out in
  • Test the components composed together in real pages, not in isolation
  • Separate the conformance failures from the system defects, and say which each finding is

What You Get

Every service on this site runs the same three-pass engine: an automated scan, an expert review of all 55 WCAG 2.2 A and AA rules, and a hands-on session with a professional blind screen-reader user. You get one report with every finding screenshotted, ranked by user impact, and linked to its fix. Your team fixes, we verify: the re-audit is half price within 3 months.

The format is not a mystery either. Read the sample report before you spend anything.

The Honest Limit

One honest limit, and a scoping note worth reading before you order. We audit the components as shipped and as used in your pages, and the fixing happens in your system's repo, so the report gives per-component findings your maintainers can turn straight into tickets. The scoping note is that our audits are priced by page rather than by component, at 10 pages or 25, so pick the pages that between them exercise the most of your library. If your system is large enough that the right unit is genuinely the component, email us and we will quote it that way instead.

What It Costs

Rapid Audit: $499, up to 10 pages you pick, report in 5 business days. Standard Audit: $1,499, up to 25 pages in 10 business days. Flat rates, no discovery calls, and a real blind screen-reader user on every engagement. Pick your pages. We bring the humans.

Worth Reading Next

Related on this site

Guides, checklists, tools, and terms that go with this service.

More in By framework

Go somewhere useful

Find tools, resources and your workspace.

29 destinations