Check HTML files for certain DOM structures and requirements
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Check HTML files for certain DOM structures and requirements. For example, does your website require every <button> and <a class="button"> to contain an icon element, like <i class="icon ...">? You can use htmlcheck to validate that your HTML files all follow this rule.


npm install htmlcheck


Check that every <button> and <a class="button"> have an icon and an aria-label.

    .test(function(button) {
        const icons = button.querySelectorAll('i.icon, span.icon');
        if (icons.length !== 1) {
            throw `Button with text "${button.textContent.trim()}" has ${icons.length} icons, should have one`;
    .test(function(button) {
        if (!button.hasAttribute('aria-label')) {
            throw `Button with text "${button.textContent.trim()}" does not have aria-label attribute; add this for screen readers`;

Check that every <button> and <a> have one of 'href', 'ng-href', or 'ng-click'.

    .test(function(link) {
        function isAttributeOk(attribute) {
            const value = link.getAttribute(attribute);
            return typeof value === "string" && value.length > 0;

        const isOk = isAttributeOk('href') || isAttributeOk('ng-href') || isAttributeOk('ng-click');

        if (!isOk) {
            throw `Link with text "${link.textContent.trim()}" has no action; add one of "href", "ng-href" or "ng-click"`;

Run the file examples/examples.js to see these in action.


  • .forElements(querySelector) - Adds elements found by the given query selector to the test, for example .forElements('a.button')
  • .inDir(dir) - Adds files found in the given directory to the test, for example .inDir('src/templates')
  • .inFile(path) - Adds the given file to the test, for example .inFile('src/templates/index.html')
  • .inGlob(glob) - Adds files found by the given glob to the test, for example .inGlob('src/**/*.html')
  • .test(testFunction) - Tests the files and query selectors with the given function, which should throw an error if the test fails. The test function is given an element with a DOM-like API, for example you can call .querySelector() or .getAttribute() on the element.


To execute the tests, run npm run test

To execute the examples script, run node examples/examples.js