pour-engine 1.46.1 → 1.46.2

package/config/project.config.js

@@ -6,6 +6,6 @@
 export default {
   engine: {
     name: 'pour engine',
-    version: '1.46.1',
+    version: '1.46.2',
   },
 };

package/engine/lib/contrast.js

@@ -1,4 +1,5 @@
 // WCAG contrast math (WCAG 2.x, relative luminance per sRGB).
+import { containsNode } from './dom.js';
 
 // Computed colours do not all come back as `rgb()` any more. A colour the
 // author wrote in a modern syntax is returned in THAT syntax: Chrome and
@@ -610,7 +611,7 @@ export function backgroundObscured(element) {
   if (start === -1) return 'unverifiable';
 
   for (const layer of stack.slice(start + 1)) {
-    if (layer.contains(element)) {
+    if (containsNode(layer, element)) {
       const style = getComputedStyle(layer);
       if (style.backgroundImage !== 'none') return layer;
       const bg = parseColor(style.backgroundColor);
@@ -1001,7 +1002,7 @@ function scrimIn(layersAbove, element, win) {
   const rect = element.getBoundingClientRect();
   const found = [];
   for (const layer of layersAbove) {
-    if (layer.contains(element) || element.contains(layer)) continue;
+    if (containsNode(layer, element) || containsNode(element, layer)) continue;
     const style = getComputedStyle(layer);
     const color = parseColor(style.backgroundColor);
     const alpha = (color ? color.a : 0) * opacityOf(style);
@@ -1100,7 +1101,7 @@ export function paintedBackdrop(element) {
   }
   const layers = [];
   for (const layer of stack.slice(start + 1)) {
-    while (missing.length && !missing[0].contains(layer)) layers.push(missing.shift());
+    while (missing.length && !containsNode(missing[0], layer)) layers.push(missing.shift());
     layers.push(layer);
   }
   layers.push(...missing);
@@ -1466,7 +1467,7 @@ export function beneathOpaqueAncestor(element, media) {
   if (inTopLayer(element) || inTopLayer(media)) return false;
   const box = element.getBoundingClientRect();
   for (let ancestor = element; ancestor; ancestor = ancestor.parentElement) {
-    if (ancestor.contains(media)) return false; // from here up the media is inside
+    if (containsNode(ancestor, media)) return false; // from here up the media is inside
     if (!createsStackingContext(ancestor)) continue;
     const style = getComputedStyle(ancestor);
     const color = parseColor(style.backgroundColor);
@@ -1479,7 +1480,7 @@ export function beneathOpaqueAncestor(element, media) {
     if (!insideRoundedBox(box, ancestor.getBoundingClientRect(), style)) continue;
     // The lowest stacking context holding both.
     let shared = ancestor.parentElement;
-    while (shared && !(createsStackingContext(shared) && shared.contains(media))) shared = shared.parentElement;
+    while (shared && !(createsStackingContext(shared) && containsNode(shared, media))) shared = shared.parentElement;
     if (!shared) return false;
     const over = paintRank(ancestor, shared);
     const under = paintRank(media, shared);
@@ -1489,7 +1490,7 @@ export function beneathOpaqueAncestor(element, media) {
     if (under.z !== over.z) return under.z < over.z;
     // Same layer and z-index: tree order, earlier paints first.
     return Boolean(under.node.compareDocumentPosition(over.node) & 4 /* FOLLOWING */)
-      && !under.node.contains(over.node);
+      && !containsNode(under.node, over.node);
   }
   return false;
 }

package/engine/lib/dom.js

@@ -149,12 +149,12 @@ function siblingPosition(element, index) {
   if (!positions) {
     const counts = new Map();
     positions = new WeakMap();
-    for (const child of parent.children) {
+    for (const child of childrenOf(parent)) {
       const position = (counts.get(child.tagName) ?? 0) + 1;
       counts.set(child.tagName, position);
       positions.set(child, { position, repeated: false });
     }
-    for (const child of parent.children) positions.get(child).repeated = counts.get(child.tagName) > 1;
+    for (const child of childrenOf(parent)) positions.get(child).repeated = counts.get(child.tagName) > 1;
     index.parents.set(parent, positions);
   }
   return positions.get(element);
@@ -215,6 +215,21 @@ export function attributesOf(element) {
   return attributesGetter ? attributesGetter.call(element) : [];
 }
 
+/** An element's child elements and a node's contains(), read through the
+ *  prototype for the same reason: a booking form's field named "children"
+ *  (jetblue.com) or a word search's field named "contains" (buchstaben.com)
+ *  takes the place of the form's own property, and the audit threw. A
+ *  select in that place is iterable, so its options cannot be told from
+ *  the children by shape; the prototype is always asked. */
+const childrenGetter = typeof Element !== 'undefined' ? Object.getOwnPropertyDescriptor(Element.prototype, 'children')?.get : null;
+export function childrenOf(element) {
+  return childrenGetter ? childrenGetter.call(element) : element.children;
+}
+const nodeContains = typeof Node !== 'undefined' ? Node.prototype.contains : null;
+export function containsNode(ancestor, node) {
+  return nodeContains ? nodeContains.call(ancestor, node) : ancestor.contains(node);
+}
+
 /** Element's opening markup (attributes) plus a snippet of its own text —
  *  enough to recognise it in a table. Built WITHOUT element.outerHTML, which
  *  serializes the whole subtree and turns audits quadratic on huge pages

package/engine/rules/best-practice/fieldset-legend.js

@@ -1,6 +1,7 @@
 // WAI forms tutorial: radio/checkbox groups need a group label — each
 // input's own label isn't enough to convey what the group asks.
 import { accessibleName, labelledByName } from '../../lib/accessible-name.js';
+import { containsNode } from '../../lib/dom.js';
 export default {
   id: 'fieldset-legend',
   name: 'Grouped field labels',
@@ -41,7 +42,7 @@ export default {
       // it empty (2026-08-25 overnight audit).
       const group = first.closest('fieldset, [role="group"], [role="radiogroup"]');
       const legend = group?.querySelector(':scope > legend');
-      const grouped = group && indexes.every((index) => group.contains(elements[index])) && (
+      const grouped = group && indexes.every((index) => containsNode(group, elements[index])) && (
         (legend && accessibleName(legend))
         || labelledByName(group)
         || group.getAttribute('aria-label')?.trim()

package/engine/rules/wcag/1.3.1-aria-required-children.js

@@ -2,6 +2,7 @@
 // Composite roles are meaningless without their required child roles —
 // role="list" with no listitems announces as an empty list.
 import { effectiveRole } from '../../lib/roles.js';
+import { childrenOf } from '../../lib/dom.js';
 // Every row of ARIA 1.2's Required Owned Elements table; verify:aria-tables
 // diffs this map against the spec (2026-09-01, after feed and row were
 // found missing).
@@ -112,7 +113,7 @@ export default {
     const role = effectiveRole(element);
     const required = REQUIRED_CHILDREN[role];
     if (!required) return { status: 'pass' };
-    const children = [...element.children, ...(element.shadowRoot?.children ?? [])]
+    const children = [...childrenOf(element), ...(element.shadowRoot?.children ?? [])]
       .filter((c) => !c.matches('script, style, template'));
     // A completely empty container is a lazy-load placeholder more often
     // than a defect — it announces as an empty list, which is accurate.

package/engine/rules/wcag/1.4.1-link-in-text-block.js

@@ -1,5 +1,6 @@
 // WCAG SC 1.4.1 Use of Color (Level A)
 import { parseColor, contrastRatio, composite, effectiveBackground, backgroundImageSource, asRgb } from '../../lib/contrast.js';
+import { containsNode } from '../../lib/dom.js';
 
 // Split a computed list value ("a, b(c, d), e") on the commas OUTSIDE
 // parentheses: gradients and colour functions carry commas of their own.
@@ -326,7 +327,7 @@ export default {
       const range = element.ownerDocument.createRange();
       let sharesLine = false;
       for (let node = walker.nextNode(); node && !sharesLine; node = walker.nextNode()) {
-        if (!node.textContent.trim() || element.contains(node)) continue;
+        if (!node.textContent.trim() || containsNode(element, node)) continue;
         range.selectNodeContents(node);
         for (const r of range.getClientRects()) {
           if (r.width > 0 && mids.some((mid) => r.top <= mid && r.bottom >= mid)) { sharesLine = true; break; }

package/engine/rules/wcag/1.4.3-color-contrast.js

@@ -7,6 +7,7 @@ import {
   paintedBackdrop, opaquePanelRects, viewportVeil, textShadowHalo, textShadowNegligible,
   pseudoBackdropForText, filmedContrastBounds, backgroundColorSource, scrimPaint, applyOverlays,
   showRatio, asRgb, splitBackgroundLayers, backgroundLayerUrl, sampleGridFor, opacityGroupPaint, pseudoTextColors, BOLD_WEIGHT, hasPaintEffects, isolatedBlendBackdrop, labelReferrers, beneathOpaqueAncestor, lazyWithheldBackground } from '../../lib/contrast.js';
+import { childrenOf, containsNode } from '../../lib/dom.js';
 
 /** The first url() among a background-image list's layers, or null. */
 const firstLayerUrl = (css) => splitBackgroundLayers(css ?? '').map(backgroundLayerUrl).find(Boolean) ?? null;
@@ -215,7 +216,7 @@ function coveredByTextTwin(element) {
   const index = stack.indexOf(element);
   if (index <= 0) return false;
   return stack.slice(0, index).some((layer) =>
-    !layer.contains(element) && !element.contains(layer) && layer.textContent.trim() === text);
+    !containsNode(layer, element) && !containsNode(element, layer) && layer.textContent.trim() === text);
 }
 
 /** Do any of the element's own text boxes MEANINGFULLY overlap the given
@@ -361,7 +362,7 @@ function unaccountedScrim(element, imageCarrier) {
   const start = stack.indexOf(element);
   if (start === -1) return false;
   return stack.slice(start + 1).some((layer) => {
-    if (layer.contains(element) || layer === imageCarrier) return false; // ancestor chain: already composited
+    if (containsNode(layer, element) || layer === imageCarrier) return false; // ancestor chain: already composited
     const color = parseColor(getComputedStyle(layer).backgroundColor);
     return color && color.a > 0;
   });
@@ -396,7 +397,7 @@ function coveringLayer(element, imageCarrier) {
   const overlays = [];
   for (const layer of stack.slice(start + 1)) {
     if (layer === imageCarrier) return null;
-    if (layer.contains(element)) {
+    if (containsNode(layer, element)) {
       const own = parseColor(getComputedStyle(layer).backgroundColor);
       if (own && own.a > 0 && own.a < 1) overlays.push(own);
       continue;
@@ -424,7 +425,7 @@ function positionedPaintInside(carrier, element) {
   const point = textSamplePoint(element);
   if (!point) return false;
   for (const node of carrier.querySelectorAll('*')) {
-    if (node.contains(element) || element.contains(node)) continue;
+    if (containsNode(node, element) || containsNode(element, node)) continue;
     const style = getComputedStyle(node);
     if (style.position !== 'absolute' && style.position !== 'fixed') continue;
     const paints = (style.backgroundImage !== 'none' && !paintsNothing(style.backgroundImage))
@@ -744,7 +745,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
     // Level 1: B(Cb, Cs) = Cb * Cs. Keep groups, filters and generated paint
     // outside this narrow path; its backdrop is resolved below as usual.
     const ownMultiply = style.mixBlendMode === 'multiply'
-      && styleSource === element && !element.children.length && !element.shadowRoot
+      && styleSource === element && !childrenOf(element).length && !element.shadowRoot
       && parseColor(style.backgroundColor)?.a === 0 && style.backgroundImage === 'none'
       && style.filter === 'none' && (!style.backdropFilter || style.backdropFilter === 'none')
       && (!style.textShadow || style.textShadow === 'none')
@@ -871,7 +872,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
         const near = (r) => Math.min(groupRect.right, r.right) - Math.max(groupRect.left, r.left) >= 3
           && Math.min(groupRect.bottom, r.bottom) - Math.max(groupRect.top, r.top) >= 3;
         const overMedia = mediaRects(doc).some(({ element: media, rect: mediaRect }) =>
-          near(mediaRect) && !media.contains(element) && !element.contains(media) && textIntersects(element, mediaRect));
+          near(mediaRect) && !containsNode(media, element) && !containsNode(element, media) && textIntersects(element, mediaRect));
         if (overMedia) {
           return {
             status: 'incomplete',
@@ -879,7 +880,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
           };
         }
         const flipping = opaquePanelRects(doc).some(({ element: panel, rect, color }) =>
-          near(rect) && !panel.contains(element) && !element.contains(panel) && textIntersects(element, rect)
+          near(rect) && !containsNode(panel, element) && !containsNode(element, panel) && textIntersects(element, rect)
           && (contrastRatio(composite(group.text, color), composite(group.paint, color)) >= required) !== (groupRatio >= required));
         if (flipping) {
           return {
@@ -898,7 +899,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
         let groupScrim = groupPainted?.scrim ?? null;
         if (!groupScrim && groupPainted === 'offscreen') {
           const veil = viewportVeil(doc);
-          if (veil && !veil.contains(element)) groupScrim = [veil];
+          if (veil && !containsNode(veil, element)) groupScrim = [veil];
         }
         if (groupScrim) {
           const groupVeil = scrimPaint(groupScrim);
@@ -1034,7 +1035,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
     // in-viewport, hence never routed through this branch.)
     if (!scrimLayers && painted === 'offscreen') {
       const veil = viewportVeil(doc);
-      if (veil && !veil.contains(element)) scrimLayers = [veil];
+      if (veil && !containsNode(veil, element)) scrimLayers = [veil];
     }
     if (scrimLayers) {
       veilPaint = scrimPaint(scrimLayers);
@@ -1264,7 +1265,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
       // to a person: can paint order prove an opaque ancestor lies over it?
       const overMedia = mediaRects(doc).some(({ element: media, rect: mediaRect, hitTestBlind }) =>
         (!blindOnly || hitTestBlind) && near(mediaRect)
-        && !media.contains(element) && !element.contains(media)
+        && !containsNode(media, element) && !containsNode(element, media)
         && textIntersects(element, mediaRect)
         && !beneathOpaqueAncestor(element, media));
       if (overMedia) {
@@ -1275,7 +1276,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
       }
       const flipping = opaquePanelRects(doc).some(({ element: panel, rect, color, hitTestBlind }) =>
         (!blindOnly || hitTestBlind) && near(rect)
-        && !panel.contains(element) && !element.contains(panel)
+        && !containsNode(panel, element) && !containsNode(element, panel)
         && textIntersects(element, rect)
         && (ownMultiply || (contrastRatio(foreground, color) >= required) !== (direction === 'pass')));
       if (flipping) {
@@ -1308,7 +1309,7 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
           const inside = block.querySelectorAll('*');
           if (inside.length <= 2000) {
             for (const sibling of inside) {
-              if (sibling === element || sibling.contains(element) || element.contains(sibling)) continue;
+              if (sibling === element || containsNode(sibling, element) || containsNode(element, sibling)) continue;
               const siblingStyle = getComputedStyle(sibling);
               if (siblingStyle.position !== 'static' || siblingStyle.visibility === 'hidden') continue;
               const paint = parseColor(siblingStyle.backgroundColor);

package/engine/rules/wcag/2.2.2-video-loop-motion.js

@@ -21,6 +21,8 @@
 // reason pause-stop-hide skips spinners: flagging every small moving
 // thumbnail would bury the full-bleed hero that matters. Silence there is
 // abstaining, not clearing.
+import { containsNode } from '../../lib/dom.js';
+
 /** A visible, enabled button whose aria-controls names the video or an
  *  ancestor of it, looked up in the video's own document or shadow tree. */
 function pauseControlFor(video, isVisible) {
@@ -31,7 +33,7 @@ function pauseControlFor(video, isVisible) {
     if (control.disabled || !isVisible(control)) continue;
     for (const id of control.getAttribute('aria-controls').split(/\s+/)) {
       const target = id && byId(id);
-      if (target && (target === video || target.contains(video))) return control;
+      if (target && (target === video || containsNode(target, video))) return control;
     }
   }
   return null;

package/engine/rules/wcag/2.4.10-section-heading.js

@@ -20,6 +20,8 @@
 // aria-labelledby or aria-label has a title by another route and is left
 // alone. Sections with little text, or none, are the UI-component case the
 // criterion excludes.
+import { childrenOf } from '../../lib/dom.js';
+
 const HEADING = 'h1, h2, h3, h4, h5, h6, [role="heading"]';
 const SUBSTANTIVE = 'img, svg, video, audio, canvas, iframe, input, select, textarea, button';
 const SKIP = 'script, style, template, noscript';
@@ -70,7 +72,7 @@ export default {
     // corpus page and helped nobody.
     const item = element.closest('article');
     if (item && item.parentElement && !item.querySelector(HEADING)) {
-      const items = (node) => [...node.children].filter((child) => child.matches('article') || child.querySelector(':scope > article')).length;
+      const items = (node) => [...childrenOf(node)].filter((child) => child.matches('article') || child.querySelector(':scope > article')).length;
       const container = item.parentElement;
       if (items(container) >= 3 || (container.parentElement && items(container.parentElement) >= 3)) return { status: 'pass' };
     }

package/engine/rules/wcag/2.4.11-focus-not-obscured.js

@@ -17,7 +17,7 @@
 //
 // Sites that apply the spec's own sufficient technique — scroll-padding for
 // the overlay's edge — are not flagged at all.
-import { isInert } from '../../lib/dom.js';
+import { isInert, containsNode } from '../../lib/dom.js';
 
 const FOCUSABLE = 'a[href], button, input:not([type="hidden"]), select, textarea, summary, [tabindex]:not([tabindex="-1"])';
 
@@ -105,7 +105,7 @@ export function createFocusObscuredRule({ id, name, tags, help, helpUrl, partial
         if (index <= 0) return null;
         const above = stack.slice(0, index);
         return above.find((layer) =>
-          !layer.contains(element) && !element.contains(layer)
+          !containsNode(layer, element) && !containsNode(element, layer)
           && isObscuringOverlay(layer)
           && (partial ? overlaps : contained)(rect, layer.getBoundingClientRect())) ?? null;
       };

package/engine/rules/wcag/2.5.8-target-size.js

@@ -29,12 +29,12 @@ const TARGETS = 'a[href], button, input, select, [role="button"], [role="link"]'
  * These are keyboard affordances, not pointer targets — and their phantom
  * rects must not count as "crowding" for the real targets around them.
  */
-import { isInert } from '../../lib/dom.js';
+import { isInert, containsNode } from '../../lib/dom.js';
 
 // A web component's internal link and its enclosing light-DOM link are
 // not independent pointer targets. DOM contains() stops at shadow roots.
 function containsComposed(ancestor, element) {
-  if (ancestor.contains(element)) return true;
+  if (containsNode(ancestor, element)) return true;
   if (ancestor.getRootNode() === element.getRootNode() && !element.assignedSlot) return false;
   for (let node = element; node; node = node.assignedSlot ?? node.parentElement ?? node.getRootNode()?.host) {
     if (node === ancestor) return true;
@@ -145,7 +145,7 @@ function reachableRects(element, rect) {
     // Anything above it that is part of the same control is not an
     // obstruction: a button's own icon paints over the button, an overlay
     // label over its input. Only a genuinely separate element blocks it.
-    if (stack.slice(0, index).every((layer) => layer.contains(element) || element.contains(layer))) {
+    if (stack.slice(0, index).every((layer) => containsNode(layer, element) || containsNode(element, layer))) {
       reachable.push(fragment);
     }
   }
@@ -438,8 +438,8 @@ export function createTargetSizeRule({ id, tags, help, helpUrl, min, spacingExce
       if (!win || typeof doc.elementsFromPoint !== 'function'
         || x < 0 || y < 0 || x >= win.innerWidth || y >= win.innerHeight) return false;
       for (const layer of doc.elementsFromPoint(x, y)) {
-        const inJ = elements[j] === layer || elements[j].contains(layer);
-        const inI = elements[i] === layer || elements[i].contains(layer);
+        const inJ = elements[j] === layer || containsNode(elements[j], layer);
+        const inI = elements[i] === layer || containsNode(elements[i], layer);
         if (inJ && !inI) return true;
         if (inI && !inJ) return false;
       }
@@ -504,7 +504,7 @@ export function createTargetSizeRule({ id, tags, help, helpUrl, min, spacingExce
     const calculateObscuredRect = (i) => {
       let areas = null;
       for (const j of nearbyCandidates(i)) {
-        if (elements[j].contains(elements[i]) || elements[i].contains(elements[j])) continue; // same control, nested markup
+        if (containsNode(elements[j], elements[i]) || containsNode(elements[i], elements[j])) continue; // same control, nested markup
         if (encloses(rects[j], rects[i]) || encloses(rects[i], rects[j])) continue; // one control drawn twice
         // Two links to the same place are one control in two boxes (a
         // card's image link over its title link): clicks in the overlap

package/engine/rules/wcag/4.1.2-aria-hidden-focus.js

@@ -1,5 +1,6 @@
 // WCAG SC 4.1.2 Name, Role, Value (Level A)
 import { cumulativeOpacity } from '../../lib/contrast.js';
+import { containsNode } from '../../lib/dom.js';
 
 const FOCUSABLE = 'a[href], area[href], button, input, select, textarea, summary, iframe, '
   + 'audio[controls], video[controls], [contenteditable]:not([contenteditable="false"]), [tabindex]';
@@ -44,7 +45,7 @@ export default {
     let modal = null;
     try { modal = doc.querySelector('dialog:modal'); } catch { /* older engine */ }
     modal ??= [...doc.querySelectorAll('[aria-modal="true"]')].find(isRendered) ?? null;
-    if (modal && !element.contains(modal) && !modal.contains(element)) {
+    if (modal && !containsNode(element, modal) && !containsNode(modal, element)) {
       return {
         status: 'incomplete',
         message: `This aria-hidden element contains ${focusable.length} focusable element(s) while a modal dialog is open — fine if the modal traps keyboard focus, a failure if Tab can reach them. Check the trap by keyboard.`,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pour-engine",
-  "version": "1.46.1",
+  "version": "1.46.2",
   "description": "Accessibility (WCAG 2.2) audit engine written from the W3C specifications — runs entirely in the browser, no dependencies.",
   "type": "module",
   "main": "engine/index.js",