The rules linters check for accessible markup were updated

The Sydney skyline across the harbour from the Botanic Garden seawall under a gray sky

The World Wide Web Consortium (W3C) republished Accessible Rich Internet Applications (ARIA) in HTML as a Recommendation on August 11. If you have never read it, it is the document that says which accessibility roles and attributes are allowed on which HTML elements: that a button may not be given the role of a heading, that a body element may not be hidden from assistive technology. Its stated purpose is to define requirements for conformance checking tools, which is what your linter checks against.

The changes since the 2021 Recommendation are the kind that only matter if you build components: the search and selectedcontent elements get their allowed roles, image is now the preferred synonym for the img role, img may carry the math role, the separator role is allowed on buttons, and aria-hidden on the body is explicitly disallowed.

Here is why I think it belongs ahead of the guidelines in a component library's review checklist. Most accessibility defects in component code are not missing attributes. They are attributes that are present and wrong: a role on an element that cannot take it, a property that contradicts the element's native semantics, a hidden wrapper around something focusable. Those are authoring rule violations, and this is the document that defines the rules. A linter configured against it catches them in the editor, before any audit.

Is your component library linted against the authoring rules, or only tested against the guidelines?

Photo source: https://photos.robertstowe.com/new-south-wales