html-validate 10.4.0 → 10.6.0

package/dist/esm/core.js

@@ -1207,7 +1207,9 @@ class MetaTable {
         );
       }
       for (const [key, value] of Object.entries(obj)) {
-        if (key === "$schema") continue;
+        if (key === "$schema") {
+          continue;
+        }
         this.addEntry(key, migrateElement(value));
       }
     } catch (err) {
@@ -1307,7 +1309,9 @@ class MetaTable {
    * global, e.g. to assign global attributes.
    */
   resolveGlobal() {
-    if (!this.elements["*"]) return;
+    if (!this.elements["*"]) {
+      return;
+    }
     const global = this.elements["*"];
     delete this.elements["*"];
     delete global.tagName;
@@ -1481,7 +1485,9 @@ function sliceSize(size, begin, end) {
   return Math.min(size, end - begin);
 }
 function sliceLocation(location, begin, end, wrap) {
-  if (!location) return null;
+  if (!location) {
+    return null;
+  }
   const size = sliceSize(location.size, begin, end);
   const sliced = {
     filename: location.filename,
@@ -1590,7 +1596,7 @@ var NodeType = /* @__PURE__ */ ((NodeType2) => {
 })(NodeType || {});
 
 const DOCUMENT_NODE_NAME = "#document";
-const TEXT_CONTENT = Symbol("textContent");
+const TEXT_CONTENT = /* @__PURE__ */ Symbol("textContent");
 let counter = 0;
 class DOMNode {
   nodeName;
@@ -2360,7 +2366,7 @@ class Selector {
 
 const TEXT_NODE_NAME = "#text";
 function isTextNode(node) {
-  return Boolean(node && node.nodeType === NodeType.TEXT_NODE);
+  return node?.nodeType === NodeType.TEXT_NODE;
 }
 class TextNode extends DOMNode {
   text;
@@ -2393,8 +2399,8 @@ class TextNode extends DOMNode {
   }
 }
 
-const ROLE = Symbol("role");
-const TABINDEX = Symbol("tabindex");
+const ROLE = /* @__PURE__ */ Symbol("role");
+const TABINDEX = /* @__PURE__ */ Symbol("tabindex");
 var NodeClosed = /* @__PURE__ */ ((NodeClosed2) => {
   NodeClosed2[NodeClosed2["Open"] = 0] = "Open";
   NodeClosed2[NodeClosed2["EndTag"] = 1] = "EndTag";
@@ -2404,7 +2410,7 @@ var NodeClosed = /* @__PURE__ */ ((NodeClosed2) => {
   return NodeClosed2;
 })(NodeClosed || {});
 function isElementNode(node) {
-  return Boolean(node && node.nodeType === NodeType.ELEMENT_NODE);
+  return node?.nodeType === NodeType.ELEMENT_NODE;
 }
 function isInvalidTagName(tagName) {
   return tagName === "" || tagName === "*";
@@ -3350,7 +3356,7 @@ function parseSeverity(value) {
   }
 }
 
-const cacheKey = Symbol("aria-naming");
+const cacheKey = /* @__PURE__ */ Symbol("aria-naming");
 const defaultValue = "allowed";
 const prohibitedRoles = [
   "caption",
@@ -3569,10 +3575,10 @@ function isPresentation(node) {
 }
 
 const cachePrefix = classifyNodeText.name;
-const HTML_CACHE_KEY = Symbol(`${cachePrefix}|html`);
-const A11Y_CACHE_KEY = Symbol(`${cachePrefix}|a11y`);
-const IGNORE_HIDDEN_ROOT_HTML_CACHE_KEY = Symbol(`${cachePrefix}|html|ignore-hidden-root`);
-const IGNORE_HIDDEN_ROOT_A11Y_CACHE_KEY = Symbol(`${cachePrefix}|a11y|ignore-hidden-root`);
+const HTML_CACHE_KEY = /* @__PURE__ */ Symbol(`${cachePrefix}|html`);
+const A11Y_CACHE_KEY = /* @__PURE__ */ Symbol(`${cachePrefix}|a11y`);
+const IGNORE_HIDDEN_ROOT_HTML_CACHE_KEY = /* @__PURE__ */ Symbol(`${cachePrefix}|html|ignore-hidden-root`);
+const IGNORE_HIDDEN_ROOT_A11Y_CACHE_KEY = /* @__PURE__ */ Symbol(`${cachePrefix}|a11y|ignore-hidden-root`);
 var TextClassification = /* @__PURE__ */ ((TextClassification2) => {
   TextClassification2[TextClassification2["EMPTY_TEXT"] = 0] = "EMPTY_TEXT";
   TextClassification2[TextClassification2["DYNAMIC_TEXT"] = 1] = "DYNAMIC_TEXT";
@@ -3700,6 +3706,7 @@ function interpolate(text, data) {
 
 const ajv$1 = new Ajv({ strict: true, strictTuples: true, strictTypes: true });
 ajv$1.addMetaSchema(ajvSchemaDraft);
+ajv$1.addKeyword(ajvRegexpKeyword);
 function getSchemaValidator(ruleId, properties) {
   const $id = `rule/${ruleId}`;
   const cached = ajv$1.getSchema($id);
@@ -3956,6 +3963,7 @@ class Rule {
    *
    * @internal
    */
+  /* eslint-disable-next-line @typescript-eslint/max-params -- technical debt */
   static validateOptions(cls, ruleId, jsonPath, options, filename, config) {
     if (!cls) {
       return;
@@ -5180,7 +5188,9 @@ class AttributeAllowedValues extends Rule {
       const doc = event.document;
       walk.depthFirst(doc, (node) => {
         const meta = node.meta;
-        if (!meta?.attributes) return;
+        if (!meta?.attributes) {
+          return;
+        }
         for (const attr of node.attributes) {
           if (Validator.validateAttribute(attr, meta.attributes)) {
             continue;
@@ -5240,9 +5250,13 @@ class AttributeBooleanStyle extends Rule {
       const doc = event.document;
       walk.depthFirst(doc, (node) => {
         const meta = node.meta;
-        if (!meta?.attributes) return;
+        if (!meta?.attributes) {
+          return;
+        }
         for (const attr of node.attributes) {
-          if (!this.isBoolean(attr, meta.attributes)) continue;
+          if (!this.isBoolean(attr, meta.attributes)) {
+            continue;
+          }
           if (attr.originalAttribute) {
             continue;
           }
@@ -5312,7 +5326,9 @@ class AttributeEmptyStyle extends Rule {
       const doc = event.document;
       walk.depthFirst(doc, (node) => {
         const meta = node.meta;
-        if (!meta?.attributes) return;
+        if (!meta?.attributes) {
+          return;
+        }
         for (const attr of node.attributes) {
           if (!allowsEmpty(attr, meta.attributes)) {
             continue;
@@ -5405,7 +5421,22 @@ class AttributeMisuse extends Rule {
   }
 }
 
+const patternNamesValues = [
+  "kebabcase",
+  "camelcase",
+  "underscore",
+  "snakecase",
+  "bem",
+  "tailwind"
+];
+const patternNames = new Set(patternNamesValues);
+function isNamedPattern(value) {
+  return typeof value === "string" && patternNames.has(value);
+}
 function parsePattern(pattern) {
+  if (pattern instanceof RegExp) {
+    return { regexp: pattern, description: pattern.toString() };
+  }
   switch (pattern) {
     case "kebabcase":
       return { regexp: /^[a-z][a-z0-9]*(?:-[a-z0-9]+)*$/, description: pattern };
@@ -5423,7 +5454,21 @@ function parsePattern(pattern) {
         description: pattern
       };
     }
+    case "tailwind": {
+      return {
+        regexp: /^!?(?:[-a-z[]|\d+xl:)[\w\-:./\\[\]()#'&>,!=%]*$/,
+        description: "tailwind"
+      };
+    }
     default: {
+      if (pattern.startsWith("/") && pattern.endsWith("/")) {
+        const regexpSource = pattern.slice(1, -1);
+        const regexp2 = new RegExp(regexpSource);
+        return { regexp: regexp2, description: regexp2.toString() };
+      }
+      console.warn(
+        `Custom pattern "${pattern}" should be wrapped in forward slashes, e.g., "/${pattern}/". Support for unwrapped patterns is deprecated and will be removed in a future version.`
+      );
       const regexp = new RegExp(pattern);
       return { regexp, description: regexp.toString() };
     }
@@ -5431,27 +5476,49 @@ function parsePattern(pattern) {
 }
 
 function toArray$2(value) {
-  return Array.isArray(value) ? value : [value];
+  if (Array.isArray(value)) {
+    return value;
+  } else {
+    return [value];
+  }
+}
+function validateAllowedPatterns(patterns, allowedPatterns, ruleId) {
+  const extraneous = patterns.filter(isNamedPattern).filter((p) => !allowedPatterns.has(p));
+  if (extraneous.length > 0) {
+    const quote = (it) => `"${it}"`;
+    const disallowed = naturalJoin(extraneous.map(quote), "and");
+    const allowed = naturalJoin(Array.from(allowedPatterns, quote), "and");
+    throw new Error(
+      `Pattern ${disallowed} cannot be used with "${ruleId}". Allowed patterns: ${allowed}`
+    );
+  }
 }
 class BasePatternRule extends Rule {
   /** Attribute being tested */
   attr;
   /** Parsed configured patterns */
   patterns;
-  /**
-   * @param attr - Attribute holding the value.
-   * @param options - Rule options with defaults expanded.
-   */
-  constructor(attr, options) {
+  constructor({
+    ruleId,
+    attr,
+    options,
+    allowedPatterns
+  }) {
     super(options);
     const { pattern } = this.options;
     this.attr = attr;
-    this.patterns = toArray$2(pattern).map((it) => parsePattern(it));
+    const patterns = toArray$2(pattern);
+    validateAllowedPatterns(patterns, allowedPatterns, ruleId);
+    this.patterns = patterns.map((it) => parsePattern(it));
   }
   static schema() {
     return {
       pattern: {
-        oneOf: [{ type: "array", items: { type: "string" }, minItems: 1 }, { type: "string" }]
+        anyOf: [
+          { type: "array", items: { anyOf: [{ type: "string" }, { regexp: true }] }, minItems: 1 },
+          { type: "string" },
+          { regexp: true }
+        ]
       }
     };
   }
@@ -5490,7 +5557,13 @@ const defaults$q = {
 };
 class ClassPattern extends BasePatternRule {
   constructor(options) {
-    super("class", { ...defaults$q, ...options });
+    super({
+      ruleId: "class-pattern",
+      attr: "class",
+      options: { ...defaults$q, ...options },
+      allowedPatterns: patternNames
+      // allow all patterns
+    });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -6440,7 +6513,9 @@ class EmptyTitle extends Rule {
   setup() {
     this.on("tag:end", (event) => {
       const node = event.previous;
-      if (node.tagName !== "title") return;
+      if (node.tagName !== "title") {
+        return;
+      }
       switch (classifyNodeText(node)) {
         case TextClassification.DYNAMIC_TEXT:
         case TextClassification.STATIC_TEXT:
@@ -6461,8 +6536,8 @@ const defaults$l = {
   allowCheckboxDefault: true,
   shared: ["radio", "button", "reset", "submit"]
 };
-const UNIQUE_CACHE_KEY = Symbol("form-elements-unique");
-const SHARED_CACHE_KEY = Symbol("form-elements-shared");
+const UNIQUE_CACHE_KEY = /* @__PURE__ */ Symbol("form-elements-unique");
+const SHARED_CACHE_KEY = /* @__PURE__ */ Symbol("form-elements-shared");
 function isEnabled(element) {
   if (isHTMLHidden(element)) {
     return false;
@@ -6761,7 +6836,9 @@ class HeadingLevel extends Rule {
   }
   onTagStart(event) {
     const level = extractLevel(event.target);
-    if (!level) return;
+    if (!level) {
+      return;
+    }
     const root = this.getCurrentRoot();
     if (!this.options.allowMultipleH1 && level === 1) {
       if (root.h1Count >= 1) {
@@ -6947,9 +7024,22 @@ class HiddenFocusable extends Rule {
 const defaults$j = {
   pattern: "kebabcase"
 };
+function exclude$1(set, ...values) {
+  const result = new Set(set);
+  for (const value of values) {
+    result.delete(value);
+  }
+  return result;
+}
 class IdPattern extends BasePatternRule {
   constructor(options) {
-    super("id", { ...defaults$j, ...options });
+    const allowedPatterns = exclude$1(patternNames, "tailwind");
+    super({
+      ruleId: "id-pattern",
+      attr: "id",
+      options: { ...defaults$j, ...options },
+      allowedPatterns
+    });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -7253,7 +7343,9 @@ class InputMissingLabel extends Rule {
   }
 }
 function findLabelById(root, id) {
-  if (!id) return [];
+  if (!id) {
+    return [];
+  }
   return root.querySelectorAll(`label[for="${id}"]`);
 }
 function findLabelByParent(el) {
@@ -7292,7 +7384,9 @@ class LongTitle extends Rule {
   setup() {
     this.on("tag:end", (event) => {
       const node = event.previous;
-      if (node.tagName !== "title") return;
+      if (node.tagName !== "title") {
+        return;
+      }
       const text = node.textContent;
       if (text.length > this.maxlength) {
         this.report(node, `title text cannot be longer than ${String(this.maxlength)} characters`);
@@ -7494,9 +7588,22 @@ class MultipleLabeledControls extends Rule {
 const defaults$g = {
   pattern: "camelcase"
 };
+function exclude(set, ...values) {
+  const result = new Set(set);
+  for (const value of values) {
+    result.delete(value);
+  }
+  return result;
+}
 class NamePattern extends BasePatternRule {
   constructor(options) {
-    super("name", { ...defaults$g, ...options });
+    const allowedPatterns = exclude(patternNames, "tailwind");
+    super({
+      ruleId: "name-pattern",
+      attr: "name",
+      options: { ...defaults$g, ...options },
+      allowedPatterns
+    });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -7752,7 +7859,7 @@ class NoDupClass extends Rule {
   }
 }
 
-const CACHE_KEY = Symbol("no-dup-id");
+const CACHE_KEY = /* @__PURE__ */ Symbol("no-dup-id");
 class NoDupID extends Rule {
   documentation() {
     return {
@@ -7857,7 +7964,7 @@ Omitted end tags can be ambigious for humans to read and many editors have troub
         return;
       }
       const parent = closed.parent;
-      const closedByParent = parent && parent.tagName === by.tagName;
+      const closedByParent = parent?.tagName === by.tagName;
       const closedByDocument = closedByParent && parent.isRootElement();
       const sameTag = closed.tagName === by.tagName;
       if (closedByDocument) {
@@ -8219,7 +8326,7 @@ class NoRedundantAriaLabel extends Rule {
           continue;
         }
         const label = document.querySelector(`label[for="${id}"]`);
-        if (!ariaLabel || !label || label.textContent.trim() !== ariaLabel.value) {
+        if (!ariaLabel || label?.textContent.trim() !== ariaLabel.value) {
           continue;
         }
         const message = "aria-label is redundant when label containing same text exists";
@@ -10038,6 +10145,46 @@ class ValidAutocomplete extends Rule {
   }
 }
 
+function isLabelable(target) {
+  const { meta } = target;
+  if (!meta) {
+    return true;
+  }
+  return Boolean(meta.labelable);
+}
+class ValidFor extends Rule {
+  documentation() {
+    return {
+      description: `The \`<label>\` \`for\` attribute must reference a labelable form control.`,
+      url: "https://html-validate.org/rules/valid-for.html"
+    };
+  }
+  setup() {
+    this.on("dom:ready", (event) => {
+      const { document } = event;
+      for (const node of document.querySelectorAll("label[for]")) {
+        const attr = node.getAttribute("for");
+        if (!isStaticAttribute(attr) || !attr.value) {
+          continue;
+        }
+        const selector = generateIdSelector(attr.value);
+        const target = document.querySelector(selector);
+        if (!target) {
+          continue;
+        }
+        if (isLabelable(target)) {
+          continue;
+        }
+        this.report({
+          node,
+          message: '<label> "for" attribute must reference a labelable form control',
+          location: attr.valueLocation
+        });
+      }
+    });
+  }
+}
+
 const defaults$4 = {
   relaxed: false
 };
@@ -10336,7 +10483,9 @@ class H36 extends Rule {
   setup() {
     this.on("tag:end", (event) => {
       const node = event.previous;
-      if (node.tagName !== "input") return;
+      if (node.tagName !== "input") {
+        return;
+      }
       if (node.getAttributeValue("type") !== "image") {
         return;
       }
@@ -10662,6 +10811,7 @@ const bundledRules = {
   "unique-landmark": UniqueLandmark,
   "unrecognized-char-ref": UnknownCharReference,
   "valid-autocomplete": ValidAutocomplete,
+  "valid-for": ValidFor,
   "valid-id": ValidID,
   "void-content": VoidContent,
   "void-style": VoidStyle,
@@ -11015,6 +11165,7 @@ const config$1 = {
     "unique-landmark": "error",
     "unrecognized-char-ref": "error",
     "valid-autocomplete": "error",
+    "valid-for": "error",
     "valid-id": ["error", { relaxed: false }],
     void: "off",
     "void-content": "error",
@@ -11062,6 +11213,7 @@ const config = {
     "script-element": "error",
     "unrecognized-char-ref": "error",
     "valid-autocomplete": "error",
+    "valid-for": "error",
     "valid-id": ["error", { relaxed: true }],
     "void-content": "error"
   }
@@ -11668,7 +11820,9 @@ class Config {
     }
     for (const plugin of plugins) {
       for (const [name, config] of Object.entries(plugin.configs ?? {})) {
-        if (!config) continue;
+        if (!config) {
+          continue;
+        }
         Config.validate(config, name);
         configs.set(`${plugin.name}:${name}`, config);
         if (plugin.name !== plugin.originalName) {
@@ -11969,7 +12123,7 @@ class EventHandler {
 }
 
 const name = "html-validate";
-const version = "10.4.0";
+const version = "10.6.0";
 const bugs = "https://gitlab.com/html-validate/html-validate/issues/new";
 
 function freeze(src) {
@@ -12020,6 +12174,7 @@ class Reporter {
       warningCount: sumWarnings(results)
     };
   }
+  /* eslint-disable-next-line @typescript-eslint/max-params -- technical debt */
   add(rule, message, severity, node, location, context) {
     if (!(location.filename in this.result)) {
       this.result[location.filename] = [];
@@ -12139,7 +12294,7 @@ class ParserError extends Error {
 }
 
 function isAttrValueToken(token) {
-  return Boolean(token && token.type === TokenType.ATTR_VALUE);
+  return token?.type === TokenType.ATTR_VALUE;
 }
 function svgShouldRetainTag(foreignTagName, tagName) {
   return foreignTagName === "svg" && ["title", "desc"].includes(tagName);
@@ -12485,7 +12640,7 @@ class Parser {
    *      ^^^          ^^^         ^^^    (null)   (null)
    */
   getAttributeValueLocation(token) {
-    if (!token || token.type !== TokenType.ATTR_VALUE || token.data[2] === "") {
+    if (token?.type !== TokenType.ATTR_VALUE || token.data[2] === "") {
       return null;
     }
     const quote = token.data[3];
@@ -12501,7 +12656,7 @@ class Parser {
    */
   getAttributeLocation(key, value) {
     const begin = key.location;
-    const end = value && value.type === TokenType.ATTR_VALUE ? value.location : void 0;
+    const end = value?.type === TokenType.ATTR_VALUE ? value.location : void 0;
     return {
       filename: begin.filename,
       line: begin.line,
@@ -12523,7 +12678,11 @@ class Parser {
       throw new Error(`Failed to parse directive "${text}"`);
     }
     if (!isValidDirective(action)) {
-      throw new ParserError(token.location, `Unknown directive "${action}"`);
+      this.trigger("parse:error", {
+        location: token.location,
+        message: `Unknown directive "${action}"`
+      });
+      return;
     }
     const [, data, separator2, comment] = match;
     const prefix = "html-validate-";
@@ -12616,7 +12775,9 @@ class Parser {
     while (!it.done) {
       const token = it.value;
       yield token;
-      if (token.type === search) return;
+      if (token.type === search) {
+        return;
+      }
       it = this.next(tokenStream);
     }
     throw new ParserError(
@@ -12779,6 +12940,9 @@ class Engine {
       parser.on("directive", (_2, event) => {
         this.processDirective(event, parser, directiveContext);
       });
+      parser.on("parse:error", (_2, event) => {
+        this.reportError("parser-error", event.message, event.location);
+      });
       try {
         parser.parseHtml(source);
       } catch (e) {
@@ -12976,7 +13140,9 @@ class Engine {
     const availableRules = {};
     for (const plugin of config.getPlugins()) {
       for (const [name, rule] of Object.entries(plugin.rules ?? {})) {
-        if (!rule) continue;
+        if (!rule) {
+          continue;
+        }
         availableRules[name] = rule;
       }
     }
@@ -13009,6 +13175,7 @@ class Engine {
   /**
    * Load and setup a rule using current config.
    */
+  /* eslint-disable-next-line @typescript-eslint/max-params -- technical debt */
   loadRule(ruleId, config, severity, options, parser, report) {
     const meta = config.getMetaTable();
     const rule = this.instantiateRule(ruleId, options);