pour-engine 1.46.2 → 1.46.3

package/config/project.config.js

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

package/engine/lib/contrast.js

@@ -1,5 +1,5 @@
 // WCAG contrast math (WCAG 2.x, relative luminance per sRGB).
-import { containsNode } from './dom.js';
+import { childrenOf, 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
@@ -136,6 +136,9 @@ export function composite(top, bottom) {
 let backgroundCache = new WeakMap();
 let opacityCache = new WeakMap();
 let opacityAnimatorsCache = null;
+// Nodes read at full opacity while a verdict is re-checked as it would be
+// once a scroll reveal has run (see pendingReveal, withRevealed).
+const revealedNodes = new WeakSet();
 let mediaRectsCache = null;
 let panelRectsCache = null;
 let pseudoCache = new WeakMap();
@@ -477,6 +480,7 @@ export function restingOpacity(element) {
   const animators = opacityAnimators(element.ownerDocument);
   let product = 1;
   for (let node = element; node && node.nodeType === 1; node = node.parentElement ?? node.getRootNode()?.host) {
+    if (revealedNodes.has(node)) continue;
     if (animators.has(node)) {
       const rest = animators.get(node);
       product *= rest === null ? 1 : rest;
@@ -487,6 +491,53 @@ export function restingOpacity(element) {
   return product;
 }
 
+/** The nodes holding this text dim until it scrolls into view: an element
+ *  or flat-tree ancestor below full opacity that declares a transition on
+ *  opacity, around text that starts outside the viewport. That is how a
+ *  scroll reveal is built (an observer flips a class as the element enters
+ *  and the transition fades it in), so the dim state is the one nobody who
+ *  scrolls to the text sees. The page cannot say where the transition will
+ *  land, so a verdict that depends on it is a question for a person. Empty
+ *  when the text starts in view or nothing up the chain is fading.
+ *
+ *  Also empty when a fading node has a sibling of its own kind that is out
+ *  of view too and already at full opacity. Nothing has scrolled to that
+ *  sibling, so its opacity is not a reveal's work: the dim state is one of
+ *  the page's own states, as in a list that keeps every card but the active
+ *  one dim, and it is seen on screen wherever the reader scrolls (a
+ *  benchmark page, 2026-11-09: the inactive cards stayed at 46% in view). */
+export function pendingReveal(element) {
+  const view = element.ownerDocument.defaultView;
+  const outOfView = (rect) => !(rect.bottom > 0 && rect.top < view.innerHeight);
+  if (!view || !outOfView(element.getBoundingClientRect())) return [];
+  const nodes = [];
+  for (let node = element; node && node.nodeType === 1; node = node.parentElement ?? node.getRootNode()?.host) {
+    const style = getComputedStyle(node);
+    if (!((parseFloat(style.opacity) || 0) < 1)) continue;
+    const properties = style.transitionProperty.split(',').map((p) => p.trim());
+    const durations = style.transitionDuration.split(',').map((d) => parseFloat(d) || 0);
+    // The duration list repeats to the length of the property list.
+    if (!properties.some((p, i) => (p === 'opacity' || p === 'all') && durations[i % durations.length] > 0)) continue;
+    const parent = node.parentElement;
+    const settled = parent && [...childrenOf(parent)].some((other) => other !== node && other.tagName === node.tagName
+      && (parseFloat(getComputedStyle(other).opacity) || 0) >= 1 && outOfView(other.getBoundingClientRect()));
+    if (settled) return [];
+    nodes.push(node);
+  }
+  return nodes;
+}
+
+/** Runs judge() with these nodes read at full opacity, the state a scroll
+ *  reveal brings them to, and restores the reading after. */
+export async function withRevealed(nodes, judge) {
+  for (const node of nodes) revealedNodes.add(node);
+  opacityCache = new WeakMap();
+  try { return await judge(); } finally {
+    for (const node of nodes) revealedNodes.delete(node);
+    opacityCache = new WeakMap();
+  }
+}
+
 /** Product of the element's and its flat-tree ancestors' opacity, memoized
  *  per audit. Near-zero means the element isn't visually presented at all. */
 export function cumulativeOpacity(element) {
@@ -494,7 +545,7 @@ export function cumulativeOpacity(element) {
   let cached = opacityCache.get(element);
   if (cached === undefined) {
     const parent = element.parentElement ?? element.getRootNode()?.host ?? null;
-    cached = (parseFloat(getComputedStyle(element).opacity) || 0) * cumulativeOpacity(parent);
+    cached = (revealedNodes.has(element) ? 1 : (parseFloat(getComputedStyle(element).opacity) || 0)) * cumulativeOpacity(parent);
     opacityCache.set(element, cached);
   }
   return cached;
@@ -503,6 +554,7 @@ export function cumulativeOpacity(element) {
 /** One node's own opacity at rest: the landing value of a running
  *  animation on it, otherwise its computed opacity. */
 function nodeRestingOpacity(node) {
+  if (revealedNodes.has(node)) return 1;
   const animators = opacityAnimators(node.ownerDocument);
   if (animators.has(node)) {
     const rest = animators.get(node);

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

@@ -6,7 +6,7 @@ import {
   opacityAnimating, restingOpacity, mediaRects, inZeroClipSubtree,
   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';
+  showRatio, asRgb, splitBackgroundLayers, backgroundLayerUrl, sampleGridFor, opacityGroupPaint, pseudoTextColors, BOLD_WEIGHT, hasPaintEffects, isolatedBlendBackdrop, labelReferrers, beneathOpaqueAncestor, lazyWithheldBackground, pendingReveal, withRevealed } from '../../lib/contrast.js';
 import { childrenOf, containsNode } from '../../lib/dom.js';
 
 /** The first url() among a background-image list's layers, or null. */
@@ -1519,6 +1519,21 @@ export function createContrastRule({ id, name, tags, help, helpUrl, thresholds }
         message: 'This text sits in a section whose background image is lazy-loaded and has not loaded yet, so it was measured against a background visitors never see. Scroll the page to this text and run the audit again, or check it by eye.',
       };
     }
+    // Text held faint until it scrolls into view (see pendingReveal): when it
+    // meets the minimum at the opacity the reveal fades it to, the failure
+    // is a state no visitor who scrolls there sees, so it goes to a person.
+    // Text that still fails at full opacity keeps its failure.
+    const fading = pendingReveal(element);
+    if (fading.length) {
+      const revealed = await withRevealed(fading, () => judge(element, helpers));
+      if (revealed.status !== 'fail') {
+        const dim = Math.round(fading.reduce((product, node) => product * (parseFloat(getComputedStyle(node).opacity) || 0), 1) * 100);
+        return {
+          status: 'incomplete',
+          message: `This text starts out of view at ${dim}% opacity under an element that transitions its opacity, the way a scroll reveal fades content in. At full opacity it meets the minimum. Scroll to it and check that it ends at full opacity.`,
+        };
+      }
+    }
     // A miss on a glyph that is not words: see glyphNotWords. Every fail
     // path passes through here, so this is said once. A glyph still owes
     // 3:1 under 1.4.11 when it is needed to identify a control, so one that

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

@@ -43,15 +43,31 @@ function containsComposed(ancestor, element) {
 }
 
 function outsideHiddenOverflow(element, rect) {
-  for (let parent = element.parentElement; parent; parent = parent.parentElement) {
+  // Where the target can be brought to. A scrollable ancestor lets the
+  // reader scroll it anywhere along that ancestor's own box, so past one the
+  // target's reach on that axis is the scroller's box: a list scrolled out of
+  // a panel that hides its overflow (a long table of contents, a row of tags
+  // scrolling sideways) is still in reach and still judged.
+  // The walk stops below the body: the root's and the body's overflow is the
+  // viewport's, and a page that hides it is locking its scroll behind a
+  // dialog for now (a benchmark page, 2026-11-09, under its consent banner),
+  // not parking everything below the fold out of reach; whether the
+  // document reaches a target is isHiddenFromPointer's question.
+  const { body, documentElement } = element.ownerDocument;
+  let { left, right, top, bottom } = rect;
+  for (let parent = element.parentElement; parent && parent !== body && parent !== documentElement; parent = parent.parentElement) {
     const style = getComputedStyle(parent);
     if (style.display === 'contents') continue; // no principal box to clip its children
     const x = /^(hidden|clip)$/.test(style.overflowX);
     const y = /^(hidden|clip)$/.test(style.overflowY);
-    if (!x && !y) continue;
+    const scrollsX = /^(auto|scroll)$/.test(style.overflowX);
+    const scrollsY = /^(auto|scroll)$/.test(style.overflowY);
+    if (!x && !y && !scrollsX && !scrollsY) continue;
     const clip = parent.getBoundingClientRect();
-    if ((x && (clip.width === 0 || rect.right <= clip.left || rect.left >= clip.right))
-      || (y && (clip.height === 0 || rect.bottom <= clip.top || rect.top >= clip.bottom))) return true;
+    if ((x && (clip.width === 0 || right <= clip.left || left >= clip.right))
+      || (y && (clip.height === 0 || bottom <= clip.top || top >= clip.bottom))) return true;
+    if (scrollsX) { left = clip.left; right = clip.right; }
+    if (scrollsY) { top = clip.top; bottom = clip.bottom; }
   }
   return false;
 }
@@ -358,13 +374,17 @@ export function createTargetSizeRule({ id, tags, help, helpUrl, min, spacingExce
     // Inert targets accept no pointer action at all, so they are neither
     // judged nor counted as crowders (bbc.com/news keeps 28 controls of a
     // closed menu in an inert subtree; the browser ignores every click on
-    // them, and so must the size judgment).
+    // them, and so must the size judgment). Nor are targets wholly outside
+    // an ancestor that hides its overflow: the slides a carousel has moved
+    // out of its window are painted nowhere and take no click until it
+    // moves them back (the benchmark's Mars demo, 2026-11-06, where links
+    // on the off-screen slides were failed as crowded by each other).
     const laidOut = [];
     for (let i = 0; i < elements.length; i++) {
       if (i % 64 === 0) await yieldToMain();
       const r = rects[i], element = elements[i];
       laidOut.push(r.width > 0 && r.height > 0 && !element.matches(':disabled') && !isInert(element)
-        && !isHiddenFromPointer(element, r) && !layoutSkipped(element));
+        && !isHiddenFromPointer(element, r) && !layoutSkipped(element) && !outsideHiddenOverflow(element, r));
     }
     const undersized = rects.map((r, i) => laidOut[i] && (r.width < min || r.height < min));
     // One rect fully inside another is one control drawn twice (stretched-

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pour-engine",
-  "version": "1.46.2",
+  "version": "1.46.3",
   "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",