A simple tool that can be used to identify improper headings in your React project. It recursively scans and returns any violations where the order is skipped, whether this be with normal HTML heading tags (for example, h1/H1) or something like the MUI Typography component.
Use npx headings-checker to run. It can be used as part of your CI/CD workflow via GitHub Actions to flag any issues as part of your development.
More information about the importance of maintaining proper heading order can be read on the W3C website.
Inspired by the react-accessible-headings package developed by Springload.