html-validate 10.1.2 → 10.2.1

package/dist/esm/core.js

@@ -1486,7 +1486,7 @@ function sliceLocation(location, begin, end, wrap) {
   if (wrap) {
     let index = -1;
     const col = sliced.column;
-    do {
+    for (; ; ) {
       index = wrap.indexOf("\n", index + 1);
       if (index >= 0 && index < begin) {
         sliced.column = col - (index + 1);
@@ -1494,7 +1494,7 @@ function sliceLocation(location, begin, end, wrap) {
       } else {
         break;
       }
-    } while (true);
+    }
   }
   return sliced;
 }
@@ -3471,7 +3471,7 @@ function inAccessibilityTree(node) {
 function isAriaHiddenImpl(node) {
   const getAriaHiddenAttr = (node2) => {
     const ariaHidden = node2.getAttribute("aria-hidden");
-    return Boolean(ariaHidden && ariaHidden.value === "true");
+    return ariaHidden?.value === "true";
   };
   return {
     byParent: node.parent ? isAriaHidden(node.parent) : false,
@@ -3706,7 +3706,7 @@ function getSchemaValidator(ruleId, properties) {
   return ajv$1.compile(schema);
 }
 function isErrorDescriptor(value) {
-  return Boolean(value[0] && value[0].message);
+  return Boolean(value[0] && value[0]["message"]);
 }
 function unpackErrorDescriptor(value) {
   if (isErrorDescriptor(value)) {
@@ -3977,8 +3977,7 @@ class Rule {
    * @returns Rule documentation and url with additional details or `null` if no
    * additional documentation is available.
    */
-  /* eslint-disable-next-line @typescript-eslint/no-unused-vars -- technical debt, prototype should be moved to interface */
-  documentation(context) {
+  documentation(_context) {
     return null;
   }
 }
@@ -4307,7 +4306,7 @@ class AriaHiddenBody extends Rule {
 const defaults$w = {
   allowAnyNamable: false
 };
-const whitelisted = [
+const allowlist = /* @__PURE__ */ new Set([
   "main",
   "nav",
   "table",
@@ -4320,18 +4319,19 @@ const whitelisted = [
   "article",
   "dialog",
   "form",
+  "iframe",
   "img",
   "area",
   "fieldset",
   "summary",
   "figure"
-];
+]);
 function isValidUsage(target, meta) {
   const explicit = meta.attributes["aria-label"];
   if (explicit) {
     return true;
   }
-  if (whitelisted.includes(target.tagName)) {
+  if (allowlist.has(target.tagName)) {
     return true;
   }
   if (target.hasAttribute("role")) {
@@ -4349,7 +4349,7 @@ class AriaLabelMisuse extends Rule {
   constructor(options) {
     super({ ...defaults$w, ...options });
   }
-  documentation() {
+  documentation(context) {
     const valid = [
       "Interactive elements",
       "Labelable elements",
@@ -4363,25 +4363,41 @@ class AriaLabelMisuse extends Rule {
       "`<summary>`",
       "`<table>`, `<td>` and `<th>`"
     ];
-    const lines = valid.map((it) => `- ${it}
-`).join("");
-    return {
-      description: `\`aria-label\` can only be used on:
-
-${lines}`,
-      url: "https://html-validate.org/rules/aria-label-misuse.html"
-    };
+    const lines = valid.map((it) => `- ${it}`);
+    const url = "https://html-validate.org/rules/aria-label-misuse.html";
+    if (context.allowsNaming) {
+      return {
+        description: [
+          `\`${context.attr}\` is strictly allowed but is not recommended to be used on this element.`,
+          `\`${context.attr}\` can only be used on:`,
+          "",
+          ...lines
+        ].join("\n"),
+        url
+      };
+    } else {
+      return {
+        description: [`\`${context.attr}\` can only be used on:`, "", ...lines].join("\n"),
+        url
+      };
+    }
   }
   setup() {
     this.on("dom:ready", (event) => {
       const { document } = event;
-      for (const target of document.querySelectorAll("[aria-label]")) {
-        this.validateElement(target);
+      for (const target of document.querySelectorAll("[aria-label], [aria-labelledby]")) {
+        const ariaLabel = target.getAttribute("aria-label");
+        if (ariaLabel) {
+          this.validateElement(target, ariaLabel, "aria-label");
+        }
+        const ariaLabelledby = target.getAttribute("aria-labelledby");
+        if (ariaLabelledby) {
+          this.validateElement(target, ariaLabelledby, "aria-labelledby");
+        }
       }
     });
   }
-  validateElement(target) {
-    const attr = target.getAttribute("aria-label");
+  validateElement(target, attr, key) {
     if (!attr.value || attr.valueMatches("", false)) {
       return;
     }
@@ -4392,10 +4408,26 @@ ${lines}`,
     if (isValidUsage(target, meta)) {
       return;
     }
-    if (this.options.allowAnyNamable && ariaNaming(target) === "allowed") {
+    const allowsNaming = ariaNaming(target) === "allowed";
+    if (allowsNaming && this.options.allowAnyNamable) {
       return;
     }
-    this.report(target, `"aria-label" cannot be used on this element`, attr.keyLocation);
+    const context = { attr: key, allowsNaming };
+    if (allowsNaming) {
+      this.report({
+        node: target,
+        location: attr.keyLocation,
+        context,
+        message: `"{{ attr }}" is strictly allowed but is not recommended to be used on this element`
+      });
+    } else {
+      this.report({
+        node: target,
+        location: attr.keyLocation,
+        context,
+        message: `"{{ attr }}" cannot be used on this element`
+      });
+    }
   }
 }
 
@@ -5090,9 +5122,6 @@ class AttributeAllowedValues extends Rule {
       description: "Attribute has invalid value.",
       url: "https://html-validate.org/rules/attribute-allowed-values.html"
     };
-    if (!context) {
-      return docs;
-    }
     const { allowed, attribute, element, value } = context;
     if (allowed.enum) {
       const allowedList = allowed.enum.map((value2) => {
@@ -5927,7 +5956,10 @@ class ElementName extends Rule {
 
 function isNativeTemplate(node) {
   const { tagName, meta } = node;
-  return Boolean(tagName === "template" && meta?.templateRoot && meta?.scriptSupporting);
+  if (!meta) {
+    return false;
+  }
+  return Boolean(tagName === "template" && meta.templateRoot && meta.scriptSupporting);
 }
 function getTransparentChildren(node, transparent) {
   if (typeof transparent === "boolean") {
@@ -6156,7 +6188,7 @@ class ElementPermittedParent extends Rule {
         }
         const rules = node.meta?.permittedParent;
         if (!rules) {
-          return false;
+          return;
         }
         if (Validator.validatePermitted(parent, rules)) {
           return;
@@ -6223,14 +6255,10 @@ class ElementRequiredAncestor extends Rule {
 
 class ElementRequiredAttributes extends Rule {
   documentation(context) {
-    const docs = {
-      description: "Element is missing a required attribute",
+    return {
+      description: `The \`<${context.element}>\` element is required to have a \`${context.attribute}\` attribute.`,
       url: "https://html-validate.org/rules/element-required-attributes.html"
     };
-    if (context) {
-      docs.description = `The <${context.element}> element is required to have a "${context.attribute}" attribute.`;
-    }
-    return docs;
   }
   setup() {
     this.on("tag:end", (event) => {
@@ -8233,10 +8261,9 @@ class NoSelfClosing extends Rule {
       }
     };
   }
-  documentation(tagName) {
-    tagName = tagName || "element";
+  documentation(context) {
     return {
-      description: `Self-closing elements are disallowed. Use regular end tag <${tagName}></${tagName}> instead of self-closing <${tagName}/>.`,
+      description: `Self-closing elements are disallowed. Use regular end tag <${context}></${context}> instead of self-closing <${context}/>.`,
       url: "https://html-validate.org/rules/no-self-closing.html"
     };
   }
@@ -8814,7 +8841,7 @@ class ScriptElement extends Rule {
   setup() {
     this.on("tag:end", (event) => {
       const node = event.target;
-      if (!node || node.tagName !== "script") {
+      if (node?.tagName !== "script") {
         return;
       }
       if (node.closed !== NodeClosed.EndTag) {
@@ -10027,13 +10054,13 @@ class ValidID extends Rule {
 }
 
 class VoidContent extends Rule {
-  documentation(tagName) {
+  documentation(context) {
     const doc = {
       description: "HTML void elements cannot have any content and must not have content or end tag.",
       url: "https://html-validate.org/rules/void-content.html"
     };
-    if (tagName) {
-      doc.description = `<${tagName}> is a void element and must not have content or end tag.`;
+    if (context) {
+      doc.description = `<${context}> is a void element and must not have content or end tag.`;
     }
     return doc;
   }
@@ -10336,7 +10363,7 @@ class H37 extends Rule {
 const defaults$1 = {
   strict: false
 };
-const { enum: validScopes } = html5.th.attributes?.scope;
+const { enum: validScopes } = html5.th.attributes.scope;
 const joinedScopes = naturalJoin(validScopes);
 const td = 0;
 const th = 1;
@@ -10434,7 +10461,7 @@ class H67 extends Rule {
   setup() {
     this.on("tag:end", (event) => {
       const node = event.target;
-      if (!node || node.tagName !== "img") {
+      if (node?.tagName !== "img") {
         return;
       }
       const title = node.getAttribute("title");
@@ -11878,7 +11905,7 @@ class EventHandler {
 }
 
 const name = "html-validate";
-const version = "10.1.2";
+const version = "10.2.1";
 const bugs = "https://gitlab.com/html-validate/html-validate/issues/new";
 
 function freeze(src) {
@@ -12611,9 +12638,9 @@ class Parser {
    * Trigger close events for any still open elements.
    */
   closeTree(source, location) {
-    let active;
     const documentElement = this.dom.root;
-    while ((active = this.dom.getActive()) && !active.isRootElement()) {
+    let active = this.dom.getActive();
+    while (!active.isRootElement()) {
       if (active.meta?.implicitClosed) {
         active.closed = NodeClosed.ImplicitClosed;
         this.closeElement(source, documentElement, active, location);
@@ -12621,6 +12648,7 @@ class Parser {
         this.closeElement(source, null, active, location);
       }
       this.dom.popActive();
+      active = this.dom.getActive();
     }
   }
 }
@@ -12987,8 +13015,8 @@ function getUnnamedTransformerFromPlugin(name, plugin) {
     throw new ConfigError(`Plugin does not expose any transformers`);
   }
   if (typeof plugin.transformer !== "function") {
-    if (plugin.transformer.default) {
-      return plugin.transformer.default;
+    if (plugin.transformer["default"]) {
+      return plugin.transformer["default"];
     }
     throw new ConfigError(
       `Transformer "${name}" refers to unnamed transformer but plugin exposes only named.`
@@ -13217,7 +13245,7 @@ function checkstyleFormatter(results) {
   output += "</checkstyle>\n";
   return output;
 }
-const formatter$3 = checkstyleFormatter;
+const formatter$2 = checkstyleFormatter;
 
 const defaults = {
   showLink: true,
@@ -13392,7 +13420,7 @@ function codeframe(results, options) {
 function jsonFormatter(results) {
   return JSON.stringify(results);
 }
-const formatter$2 = jsonFormatter;
+const formatter$1 = jsonFormatter;
 
 function linkSummary(results) {
   const urls = results.reduce((result, it) => {
@@ -13421,7 +13449,6 @@ function stylish(results) {
   const links = linkSummary(results);
   return `${errors}${links}`;
 }
-const formatter$1 = stylish;
 
 function textFormatter(results) {
   let output = "";
@@ -13451,10 +13478,10 @@ function textFormatter(results) {
 const formatter = textFormatter;
 
 const availableFormatters = {
-  checkstyle: formatter$3,
+  checkstyle: formatter$2,
   codeframe,
-  json: formatter$2,
-  stylish: formatter$1,
+  json: formatter$1,
+  stylish,
   text: formatter
 };
 function getFormatter(name) {