html-validate 9.6.1 → 9.7.0

package/dist/cjs/core.js

@@ -666,6 +666,11 @@ const patternProperties = {
 					}
 				]
 			},
+			templateRoot: {
+				title: "Mark element as an element ignoring DOM ancestry, i.e. <template>.",
+				description: "The <template> element can contain any elements.",
+				type: "boolean"
+			},
 			deprecatedAttributes: {
 				title: "List of deprecated attributes",
 				type: "array",
@@ -1107,6 +1112,7 @@ function migrateElement(src) {
     textContent: src.textContent,
     focusable: src.focusable ?? false,
     implicitRole,
+    templateRoot: src.templateRoot === true,
     aria: {
       implicitRole,
       naming: normalizeAriaNaming(src.aria?.naming)
@@ -4113,7 +4119,7 @@ class Rule {
   }
 }
 
-const defaults$x = {
+const defaults$y = {
   allowExternal: true,
   allowRelative: true,
   allowAbsolute: true,
@@ -4157,7 +4163,7 @@ class AllowedLinks extends Rule {
   allowRelative;
   allowAbsolute;
   constructor(options) {
-    super({ ...defaults$x, ...options });
+    super({ ...defaults$y, ...options });
     this.allowExternal = parseAllow(this.options.allowExternal);
     this.allowRelative = parseAllow(this.options.allowRelative);
     this.allowAbsolute = parseAllow(this.options.allowAbsolute);
@@ -4325,7 +4331,7 @@ class AllowedLinks extends Rule {
   }
 }
 
-const defaults$w = {
+const defaults$x = {
   accessible: true
 };
 function findByTarget(target, siblings) {
@@ -4355,7 +4361,7 @@ function getDescription$1(context) {
 }
 class AreaAlt extends Rule {
   constructor(options) {
-    super({ ...defaults$w, ...options });
+    super({ ...defaults$x, ...options });
   }
   static schema() {
     return {
@@ -4434,7 +4440,7 @@ class AriaHiddenBody extends Rule {
   }
 }
 
-const defaults$v = {
+const defaults$w = {
   allowAnyNamable: false
 };
 const whitelisted = [
@@ -4476,7 +4482,7 @@ function isValidUsage(target, meta) {
 }
 class AriaLabelMisuse extends Rule {
   constructor(options) {
-    super({ ...defaults$v, ...options });
+    super({ ...defaults$w, ...options });
   }
   documentation() {
     const valid = [
@@ -4587,14 +4593,14 @@ class CaseStyle {
   }
 }
 
-const defaults$u = {
+const defaults$v = {
   style: "lowercase",
   ignoreForeign: true
 };
 class AttrCase extends Rule {
   style;
   constructor(options) {
-    super({ ...defaults$u, ...options });
+    super({ ...defaults$v, ...options });
     this.style = new CaseStyle(this.options.style, "attr-case");
   }
   static schema() {
@@ -4952,7 +4958,7 @@ class AttrDelimiter extends Rule {
 }
 
 const DEFAULT_PATTERN = "[a-z0-9-:]+";
-const defaults$t = {
+const defaults$u = {
   pattern: DEFAULT_PATTERN,
   ignoreForeign: true
 };
@@ -4985,7 +4991,7 @@ function generateDescription(name, pattern) {
 class AttrPattern extends Rule {
   pattern;
   constructor(options) {
-    super({ ...defaults$t, ...options });
+    super({ ...defaults$u, ...options });
     this.pattern = generateRegexp(this.options.pattern);
   }
   static schema() {
@@ -5032,7 +5038,7 @@ class AttrPattern extends Rule {
   }
 }
 
-const defaults$s = {
+const defaults$t = {
   style: "auto",
   unquoted: false
 };
@@ -5098,7 +5104,7 @@ class AttrQuotes extends Rule {
     };
   }
   constructor(options) {
-    super({ ...defaults$s, ...options });
+    super({ ...defaults$t, ...options });
     this.style = parseStyle$3(this.options.style);
   }
   setup() {
@@ -5255,13 +5261,13 @@ class AttributeAllowedValues extends Rule {
   }
 }
 
-const defaults$r = {
+const defaults$s = {
   style: "omit"
 };
 class AttributeBooleanStyle extends Rule {
   hasInvalidStyle;
   constructor(options) {
-    super({ ...defaults$r, ...options });
+    super({ ...defaults$s, ...options });
     this.hasInvalidStyle = parseStyle$2(this.options.style);
   }
   static schema() {
@@ -5327,13 +5333,13 @@ function reportMessage$1(attr, style) {
   return "";
 }
 
-const defaults$q = {
+const defaults$r = {
   style: "omit"
 };
 class AttributeEmptyStyle extends Rule {
   hasInvalidStyle;
   constructor(options) {
-    super({ ...defaults$q, ...options });
+    super({ ...defaults$r, ...options });
     this.hasInvalidStyle = parseStyle$1(this.options.style);
   }
   static schema() {
@@ -5528,12 +5534,12 @@ class BasePatternRule extends Rule {
   }
 }
 
-const defaults$p = {
+const defaults$q = {
   pattern: "kebabcase"
 };
 class ClassPattern extends BasePatternRule {
   constructor(options) {
-    super("class", { ...defaults$p, ...options });
+    super("class", { ...defaults$q, ...options });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -5680,13 +5686,13 @@ class CloseOrder extends Rule {
   }
 }
 
-const defaults$o = {
+const defaults$p = {
   include: null,
   exclude: null
 };
 class Deprecated extends Rule {
   constructor(options) {
-    super({ ...defaults$o, ...options });
+    super({ ...defaults$p, ...options });
   }
   static schema() {
     return {
@@ -5840,12 +5846,12 @@ let NoStyleTag$1 = class NoStyleTag extends Rule {
   }
 };
 
-const defaults$n = {
+const defaults$o = {
   style: "uppercase"
 };
 class DoctypeStyle extends Rule {
   constructor(options) {
-    super({ ...defaults$n, ...options });
+    super({ ...defaults$o, ...options });
   }
   static schema() {
     return {
@@ -5873,13 +5879,13 @@ class DoctypeStyle extends Rule {
   }
 }
 
-const defaults$m = {
+const defaults$n = {
   style: "lowercase"
 };
 class ElementCase extends Rule {
   style;
   constructor(options) {
-    super({ ...defaults$m, ...options });
+    super({ ...defaults$n, ...options });
     this.style = new CaseStyle(this.options.style, "element-case");
   }
   static schema() {
@@ -5939,7 +5945,7 @@ class ElementCase extends Rule {
   }
 }
 
-const defaults$l = {
+const defaults$m = {
   pattern: "^[a-z][a-z0-9\\-._]*-[a-z0-9\\-._]*$",
   whitelist: [],
   blacklist: []
@@ -5947,7 +5953,7 @@ const defaults$l = {
 class ElementName extends Rule {
   pattern;
   constructor(options) {
-    super({ ...defaults$l, ...options });
+    super({ ...defaults$m, ...options });
     this.pattern = new RegExp(this.options.pattern);
   }
   static schema() {
@@ -5984,7 +5990,7 @@ class ElementName extends Rule {
         ...context.blacklist.map((cur) => `- ${cur}`)
       ];
     }
-    if (context.pattern !== defaults$l.pattern) {
+    if (context.pattern !== defaults$m.pattern) {
       return [
         `<${context.tagName}> is not a valid element name. This project is configured to only allow names matching the following regular expression:`,
         "",
@@ -6030,7 +6036,8 @@ class ElementName extends Rule {
 }
 
 function isNativeTemplate(node) {
-  return Boolean(node.tagName === "template" && node.meta?.scriptSupporting);
+  const { tagName, meta } = node;
+  return Boolean(tagName === "template" && meta?.templateRoot && meta?.scriptSupporting);
 }
 function getTransparentChildren(node, transparent) {
   if (typeof transparent === "boolean") {
@@ -6473,7 +6480,7 @@ class EmptyTitle extends Rule {
   }
 }
 
-const defaults$k = {
+const defaults$l = {
   allowArrayBrackets: true,
   allowCheckboxDefault: true,
   shared: ["radio", "button", "reset", "submit"]
@@ -6521,7 +6528,7 @@ function getDocumentation(context) {
 }
 class FormDupName extends Rule {
   constructor(options) {
-    super({ ...defaults$k, ...options });
+    super({ ...defaults$l, ...options });
   }
   static schema() {
     return {
@@ -6680,7 +6687,7 @@ class FormDupName extends Rule {
   }
 }
 
-const defaults$j = {
+const defaults$k = {
   allowMultipleH1: false,
   minInitialRank: "h1",
   sectioningRoots: ["dialog", '[role="dialog"]', '[role="alertdialog"]']
@@ -6712,7 +6719,7 @@ class HeadingLevel extends Rule {
   sectionRoots;
   stack = [];
   constructor(options) {
-    super({ ...defaults$j, ...options });
+    super({ ...defaults$k, ...options });
     this.minInitialRank = parseMaxInitial(this.options.minInitialRank);
     this.sectionRoots = this.options.sectioningRoots.map((it) => new Compound(it));
     this.stack.push({
@@ -6949,12 +6956,12 @@ class HiddenFocusable extends Rule {
   }
 }
 
-const defaults$i = {
+const defaults$j = {
   pattern: "kebabcase"
 };
 class IdPattern extends BasePatternRule {
   constructor(options) {
-    super("id", { ...defaults$i, ...options });
+    super("id", { ...defaults$j, ...options });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -7272,13 +7279,13 @@ function findLabelByParent(el) {
   return [];
 }
 
-const defaults$h = {
+const defaults$i = {
   maxlength: 70
 };
 class LongTitle extends Rule {
   maxlength;
   constructor(options) {
-    super({ ...defaults$h, ...options });
+    super({ ...defaults$i, ...options });
     this.maxlength = this.options.maxlength;
   }
   static schema() {
@@ -7306,12 +7313,12 @@ class LongTitle extends Rule {
   }
 }
 
-const defaults$g = {
+const defaults$h = {
   allowLongDelay: false
 };
 class MetaRefresh extends Rule {
   constructor(options) {
-    super({ ...defaults$g, ...options });
+    super({ ...defaults$h, ...options });
   }
   documentation() {
     return {
@@ -7496,12 +7503,12 @@ class MultipleLabeledControls extends Rule {
   }
 }
 
-const defaults$f = {
+const defaults$g = {
   pattern: "camelcase"
 };
 class NamePattern extends BasePatternRule {
   constructor(options) {
-    super("name", { ...defaults$f, ...options });
+    super("name", { ...defaults$g, ...options });
   }
   static schema() {
     return BasePatternRule.schema();
@@ -7590,13 +7597,13 @@ class NoAbstractRole extends Rule {
   }
 }
 
-const defaults$e = {
+const defaults$f = {
   include: null,
   exclude: null
 };
 class NoAutoplay extends Rule {
   constructor(options) {
-    super({ ...defaults$e, ...options });
+    super({ ...defaults$f, ...options });
   }
   documentation(context) {
     return {
@@ -7915,14 +7922,14 @@ Omitted end tags can be ambigious for humans to read and many editors have troub
   }
 }
 
-const defaults$d = {
+const defaults$e = {
   include: null,
   exclude: null,
   allowedProperties: ["display"]
 };
 class NoInlineStyle extends Rule {
   constructor(options) {
-    super({ ...defaults$d, ...options });
+    super({ ...defaults$e, ...options });
   }
   static schema() {
     return {
@@ -8108,7 +8115,7 @@ class NoMultipleMain extends Rule {
   }
 }
 
-const defaults$c = {
+const defaults$d = {
   relaxed: false
 };
 const textRegexp = /([<>]|&(?![a-zA-Z0-9#]+;))/g;
@@ -8126,7 +8133,7 @@ const replacementTable = {
 class NoRawCharacters extends Rule {
   relaxed;
   constructor(options) {
-    super({ ...defaults$c, ...options });
+    super({ ...defaults$d, ...options });
     this.relaxed = this.options.relaxed;
   }
   static schema() {
@@ -8299,13 +8306,13 @@ class NoRedundantRole extends Rule {
 }
 
 const xmlns = /^(.+):.+$/;
-const defaults$b = {
+const defaults$c = {
   ignoreForeign: true,
   ignoreXML: true
 };
 class NoSelfClosing extends Rule {
   constructor(options) {
-    super({ ...defaults$b, ...options });
+    super({ ...defaults$c, ...options });
   }
   static schema() {
     return {
@@ -8389,13 +8396,13 @@ class NoTrailingWhitespace extends Rule {
   }
 }
 
-const defaults$a = {
+const defaults$b = {
   include: null,
   exclude: null
 };
 class NoUnknownElements extends Rule {
   constructor(options) {
-    super({ ...defaults$a, ...options });
+    super({ ...defaults$b, ...options });
   }
   static schema() {
     return {
@@ -8501,13 +8508,13 @@ const replacement = {
   reset: '<button type="reset">',
   image: '<button type="button">'
 };
-const defaults$9 = {
+const defaults$a = {
   include: null,
   exclude: null
 };
 class PreferButton extends Rule {
   constructor(options) {
-    super({ ...defaults$9, ...options });
+    super({ ...defaults$a, ...options });
   }
   static schema() {
     return {
@@ -8573,7 +8580,7 @@ class PreferButton extends Rule {
   }
 }
 
-const defaults$8 = {
+const defaults$9 = {
   mapping: {
     article: "article",
     banner: "header",
@@ -8603,7 +8610,7 @@ const defaults$8 = {
 };
 class PreferNativeElement extends Rule {
   constructor(options) {
-    super({ ...defaults$8, ...options });
+    super({ ...defaults$9, ...options });
   }
   static schema() {
     return {
@@ -8717,12 +8724,12 @@ class PreferTbody extends Rule {
   }
 }
 
-const defaults$7 = {
+const defaults$8 = {
   tags: ["script", "style"]
 };
 class RequireCSPNonce extends Rule {
   constructor(options) {
-    super({ ...defaults$7, ...options });
+    super({ ...defaults$8, ...options });
   }
   static schema() {
     return {
@@ -8769,7 +8776,7 @@ class RequireCSPNonce extends Rule {
   }
 }
 
-const defaults$6 = {
+const defaults$7 = {
   target: "all",
   include: null,
   exclude: null
@@ -8798,7 +8805,7 @@ function linkSupportsSri(node) {
 class RequireSri extends Rule {
   target;
   constructor(options) {
-    super({ ...defaults$6, ...options });
+    super({ ...defaults$7, ...options });
     this.target = this.options.target;
   }
   static schema() {
@@ -8971,7 +8978,7 @@ class SvgFocusable extends Rule {
   }
 }
 
-const defaults$5 = {
+const defaults$6 = {
   characters: [
     { pattern: " ", replacement: "&nbsp;", description: "non-breaking space" },
     { pattern: "-", replacement: "&#8209;", description: "non-breaking hyphen" }
@@ -9003,7 +9010,7 @@ function matchAll(text, regexp) {
 class TelNonBreaking extends Rule {
   regex;
   constructor(options) {
-    super({ ...defaults$5, ...options });
+    super({ ...defaults$6, ...options });
     this.regex = constructRegex(this.options.characters);
   }
   static schema() {
@@ -9378,7 +9385,7 @@ class UniqueLandmark extends Rule {
   }
 }
 
-const defaults$4 = {
+const defaults$5 = {
   ignoreCase: false,
   requireSemicolon: true
 };
@@ -9412,7 +9419,7 @@ function getDescription(context, options) {
 }
 class UnknownCharReference extends Rule {
   constructor(options) {
-    super({ ...defaults$4, ...options });
+    super({ ...defaults$5, ...options });
   }
   static schema() {
     return {
@@ -10028,12 +10035,12 @@ class ValidAutocomplete extends Rule {
   }
 }
 
-const defaults$3 = {
+const defaults$4 = {
   relaxed: false
 };
 class ValidID extends Rule {
   constructor(options) {
-    super({ ...defaults$3, ...options });
+    super({ ...defaults$4, ...options });
   }
   static schema() {
     return {
@@ -10139,13 +10146,13 @@ class VoidContent extends Rule {
   }
 }
 
-const defaults$2 = {
+const defaults$3 = {
   style: "omit"
 };
 class VoidStyle extends Rule {
   style;
   constructor(options) {
-    super({ ...defaults$2, ...options });
+    super({ ...defaults$3, ...options });
     this.style = parseStyle(this.options.style);
   }
   static schema() {
@@ -10346,13 +10353,13 @@ class H36 extends Rule {
   }
 }
 
-const defaults$1 = {
+const defaults$2 = {
   allowEmpty: true,
   alias: []
 };
 class H37 extends Rule {
   constructor(options) {
-    super({ ...defaults$1, ...options });
+    super({ ...defaults$2, ...options });
     if (!Array.isArray(this.options.alias)) {
       this.options.alias = [this.options.alias];
     }
@@ -10414,9 +10421,62 @@ class H37 extends Rule {
   }
 }
 
+const defaults$1 = {
+  strict: false
+};
 const { enum: validScopes } = elements.html5.th.attributes?.scope;
 const joinedScopes = utils_naturalJoin.naturalJoin(validScopes);
+const td = 0;
+const th = 1;
+function getShape(cells) {
+  const rows = cells.length;
+  const cols = cells[0].length;
+  return { rows, cols };
+}
+function isSimpleTable(table) {
+  const haveHeadersAttr = table.querySelector("> tr > [headers], > tbody > tr > [headers]");
+  if (haveHeadersAttr) {
+    return false;
+  }
+  const rows = table.querySelectorAll("> tr, > thead > tr, > tbody > tr");
+  if (rows.length === 0) {
+    return false;
+  }
+  const cells = rows.map((tr) => tr.querySelectorAll("> *").map((el) => el.is("th") ? th : td));
+  if (cells[0].length === 0) {
+    return false;
+  }
+  const numColumns = cells[0].length;
+  if (!cells.every((row) => row.length === numColumns)) {
+    return false;
+  }
+  const shape = getShape(cells);
+  const headersPerRow = cells.map((row) => row.reduce((sum, cell) => sum + cell, 0));
+  const headersPerColumn = Array(shape.cols).fill(0).map((_, index) => {
+    return cells.reduce((sum, it) => sum + it[index], 0);
+  });
+  const [firstRow, ...otherRows] = headersPerRow;
+  if (firstRow === shape.cols && otherRows.every((row) => row === 0)) {
+    return true;
+  }
+  const [firstCol, ...otherCols] = headersPerColumn;
+  const haveThead = Boolean(table.querySelector("> thead"));
+  if (firstCol === shape.rows && otherCols.every((col) => col === 0) && !haveThead) {
+    return true;
+  }
+  return false;
+}
 class H63 extends Rule {
+  constructor(options) {
+    super({ ...defaults$1, ...options });
+  }
+  static schema() {
+    return {
+      strict: {
+        type: "boolean"
+      }
+    };
+  }
   documentation() {
     return {
       description: "H63: Using the scope attribute to associate header cells and data cells in data tables",
@@ -10424,23 +10484,31 @@ class H63 extends Rule {
     };
   }
   setup() {
-    this.on("tag:ready", (event) => {
+    const { strict } = this.options;
+    this.on("element:ready", (event) => {
       const node = event.target;
-      if (node.tagName !== "th") {
+      if (!node.is("table")) {
         return;
       }
-      const scope = node.getAttribute("scope");
+      if (strict || !isSimpleTable(node)) {
+        this.validateTable(node);
+      }
+    });
+  }
+  validateTable(node) {
+    for (const th2 of node.querySelectorAll("th")) {
+      const scope = th2.getAttribute("scope");
       const value = scope?.value;
       if (value instanceof DynamicValue) {
-        return;
+        continue;
       }
       if (value && validScopes.includes(value)) {
-        return;
+        continue;
       }
       const message = `<th> element must have a valid scope attribute: ${joinedScopes}`;
-      const location = scope?.valueLocation ?? scope?.keyLocation ?? node.location;
-      this.report(node, message, location);
-    });
+      const location = scope?.valueLocation ?? scope?.keyLocation ?? th2.location;
+      this.report(th2, message, location);
+    }
   }
 }
 
@@ -11732,7 +11800,7 @@ class EventHandler {
 }
 
 const name = "html-validate";
-const version = "9.6.1";
+const version = "9.7.0";
 const bugs = "https://gitlab.com/html-validate/html-validate/issues/new";
 
 function freeze(src) {