@bongos/core 1.24.67 → 1.24.68

package/.bongos-core.json

@@ -2,11 +2,11 @@
   "artifact": "bongos-core",
   "manifest_schema": 1,
   "generator": "scripts/bongos/package-core.js",
-  "core_version": "1.24.67",
-  "core_contract": "1.24.67",
-  "source_commit": "cb3a73a80b0216905417a6379f4caf4f66a159c2",
+  "core_version": "1.24.68",
+  "core_contract": "1.24.68",
+  "source_commit": "11d18a24f88e4a0dc0348653d46f1436332533b7",
   "source_ref": "HEAD",
-  "built_at": "2026-11-09T20:07:37.283Z",
+  "built_at": "2026-11-09T20:26:36.856Z",
   "redaction": {
     "model": "docs-redacted+functional-verbatim",
     "docs_redacted": 638,
@@ -17,7 +17,7 @@
     "gate": "passed"
   },
   "file_count": 4575,
-  "tree_sha256": "ab4503425d89d4eec00873f68e4ed95088cb713b9816a7a0f3cc218da4f734d1",
+  "tree_sha256": "55f8f3d3ffc2f4ed3ccf4c3dfbc91607b1a72f70d465e1930d322a45ed7438dd",
   "files": [
     {
       "path": ".claude/skills/ask-for-help/SKILL.md",
@@ -3007,7 +3007,7 @@
     {
       "path": "docs/module-api-changelog.md",
       "mode": "0000644",
-      "sha256": "b2ea544c7a4c86e2c83d079531d105a0f8ade34933bfe96929c5bd8256dcea5c"
+      "sha256": "15027e86a94259e4ea08d9d2b47234bd92e4ee8b205677ee27ef20b6579e30a2"
     },
     {
       "path": "docs/modules-contract.md",
@@ -3262,7 +3262,7 @@
     {
       "path": "docs/recipes/ui-look-before-you-ship.md",
       "mode": "0000644",
-      "sha256": "691bbbf06c9622a91aa8b4f5d40a4be2e7198e9219a6a689bb7dd1ecb1430f94"
+      "sha256": "c78908392eedeed9255a952f959c866cd6282acd6a746258e7761e156f2bcff0"
     },
     {
       "path": "docs/recipes/upgrading-the-core.md",
@@ -11357,7 +11357,7 @@
     {
       "path": "modules/ui-design/kit/README.md",
       "mode": "0000644",
-      "sha256": "a95397538d363364347d76a875663ffc9b36eb1cba03475f11bc175e2e2787fc"
+      "sha256": "8fe3b49ba8dc29bd0f923c300978e6650fe27b7937dacef9f14b3f368babf52b"
     },
     {
       "path": "modules/ui-design/kit/check-mock.js",
@@ -11667,7 +11667,7 @@
     {
       "path": "modules/ui-design/kit/lib.js",
       "mode": "0000644",
-      "sha256": "e593169a194cd60838193df799dfb3b19ac72e92e2e6beadb3cd28128305abad"
+      "sha256": "70d6c629ee019f96d10726cdc70e0faa2f1a3422a858d70ea9dd0d3cc17002f8"
     },
     {
       "path": "modules/ui-design/kit/png.js",
@@ -11902,12 +11902,12 @@
     {
       "path": "package-lock.json",
       "mode": "0000644",
-      "sha256": "02030268a28d3b76dc99198d41bf1de043460b72e8dedde3caa400b65c5ea4bf"
+      "sha256": "ae81a9706d5fb007fa6ab9d3fa6783616f3adb642fd256c5478bf30a211026f6"
     },
     {
       "path": "package.json",
       "mode": "0000644",
-      "sha256": "f18b77185a5d2b924bf459cc5415880fea61d1118f9a358f0691b8d703565120"
+      "sha256": "cd129832a4eea52b6613553aa6da6fb2ce7f853bff8d1032d5adfd233e53710c"
     },
     {
       "path": "public-docs/index.html",
@@ -11927,7 +11927,7 @@
     {
       "path": "release-notes.json",
       "mode": "0000644",
-      "sha256": "576be7645a892c65c51e1ae3c8a17d7a5ecb2a2505cf9467dfff7a26b7aa5679"
+      "sha256": "24f4dda6011cf1e1c255226457e1647e80821260e443a11b76e858193073b8eb"
     },
     {
       "path": "scripts/bongos/CLAUDE.md",
@@ -15877,7 +15877,7 @@
     {
       "path": "src/module-api.js",
       "mode": "0000644",
-      "sha256": "ab5adbd2f126b45470953b8c28545124554f69e04a1ba70494471d888288d509"
+      "sha256": "c1a27021e0c321c2125b4cac14ae9441f74250c88c3b9fb8fe2d7b562d06924c"
     },
     {
       "path": "src/module-loader/catalog.js",
@@ -22567,12 +22567,12 @@
     {
       "path": "tests/ui_design_kit.mjs",
       "mode": "0000644",
-      "sha256": "f5160521be5a2edecfe8997275cbbc65b8cf6ac8aac7cca2e90e23378d4e64f3"
+      "sha256": "a5187e0955766f86c5eafe7ec57b5b7af553883a23342cea03ee29278291a807"
     },
     {
       "path": "tests/ui_design_kit_fit.mjs",
       "mode": "0000644",
-      "sha256": "010a7b1427aa28d4807093f2ff31871058b366c46daafb1818cda2eee4f404cc"
+      "sha256": "f72a2535bd11c2bfa2d29f01c05af1b2228de1f559551ab214b42f9b7997d78d"
     },
     {
       "path": "tests/ui_design_skills.mjs",

package/docs/module-api-changelog.md

@@ -3388,5 +3388,7 @@ is load-bearing: the script throws rather than guess if it is missing, and
         landed since 1.24.65 with no explicit bump. run 42686885661. (task 1002620)
   1.24.67 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
         landed since 1.24.66 with no explicit bump. run 42689728958. (task 1002620)
+  1.24.68 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
+        landed since 1.24.67 with no explicit bump. run 42692736161. (task 1002620)
 ---------------------------------------------------------------------------
 ```

package/docs/recipes/ui-look-before-you-ship.md

@@ -49,6 +49,7 @@ node modules/ui-design/kit/render.js --page / --style expedition        # the sa
 | `text-fit` | a word of text more than 1px past its box (the padding box of its nearest non-inline ancestor), or an SVG `<text>` past the smallest `<rect>` in its own `<g>` that holds its start — a scroller, `text-overflow: ellipsis` and a visually-hidden label are skipped ([ADR 0329](../adr/0329-the-rendered-fit-check-is-a-kit-floor-and-an-advisory-ship-check-row.md)) |
 | `sibling-overlap` | two in-flow, block-level children of one parent that both carry text overlapping by more than 2px each way — absolute, fixed, sticky and negative-margin layering is deliberate and skipped |
 | `empty-graphic` | a shown `<use>` that paints nothing (its referenced SVG failed to parse, or the id is missing) or an `<img>` that did not decode or renders 0×0 — the logo that silently vanishes; a sprite sheet's own `<symbol>`/`<defs>`, a hidden graphic and a lazy image not yet loaded are skipped (task 1005104) |
+| `covered-content` | on-screen text a painted layer sits on top of — hit-tested at the middle of each text run with pointer-events forced on, so a `pointer-events: none` veil counts: an ancestor's positioned `::before`/`::after` (the hall's fixed `body::after` plate veil over content not lifted above it), or another element that paints at half alpha or more. A fixed or sticky bar, a masked or clipped shape, a glow that fades to transparent, a transparent stretched-link overlay, the scrim behind an open modal and a visually-hidden label are skipped (task 1005132) |
 | `one-header-main-h1` | not exactly one *rendered* `<header>`, `<main>` and `<h1>` |
 | `controls-24px` | a visible control under 24px on either side (`ignoreControls` for the skip link and the like) |
 | `top-bar-80px` | a `<header>` taller than 80px |

package/modules/ui-design/kit/README.md

@@ -12,7 +12,7 @@ node modules/ui-design/kit/contrast.js --pack [look] | --url <url> [--glyphs sel
 
 A **look** is a branding pack from the module's style library (`modules/ui-design/styles/<name>/`, task 1003323): `STYLE=<name>` lays it over the instance's own pack through `GDS_BRANDING_FILE`, so any surface renders under any look with no page edit.
 
-Two of the floors are about fit ([task 1004203](https://cloudbongos.com/builders#/task/1004203), [ADR 0329](../../../docs/adr/0329-the-rendered-fit-check-is-a-kit-floor-and-an-advisory-ship-check-row.md)): `text-fit` (text past its box, SVG text past its card) and `sibling-overlap` (text-bearing siblings on top of each other). `scripts/bongos/render-check.js` runs just those two over the pages a branch changed, and `/ship-check` shows them as an advisory row. A third in-page floor, `empty-graphic` ([task 1005104](https://cloudbongos.com/builders#/task/1005104)), reports a shown `<use>` or `<img>` that paints nothing — a referenced SVG that failed to parse leaves no console error and no failed request, so the logo vanished under ALL CLEAN.
+Two of the floors are about fit ([task 1004203](https://cloudbongos.com/builders#/task/1004203), [ADR 0329](../../../docs/adr/0329-the-rendered-fit-check-is-a-kit-floor-and-an-advisory-ship-check-row.md)): `text-fit` (text past its box, SVG text past its card) and `sibling-overlap` (text-bearing siblings on top of each other). `scripts/bongos/render-check.js` runs just those two over the pages a branch changed, and `/ship-check` shows them as an advisory row. A third in-page floor, `empty-graphic` ([task 1005104](https://cloudbongos.com/builders#/task/1005104)), reports a shown `<use>` or `<img>` that paints nothing — a referenced SVG that failed to parse leaves no console error and no failed request, so the logo vanished under ALL CLEAN. A fourth, `covered-content` ([task 1005132](https://cloudbongos.com/builders#/task/1005132)), reports on-screen text a painted layer sits on top of — the hall specimen read near-black in dark under the fixed `body::after` veil while every other floor passed.
 
 A surface describes itself in two JSON files beside it — `<page>.states.json` and `<page>.probes.json` — in the vocabularies `lib.js` defines and validates. A page served at the surface root (the hall's Home, `/builders/`) reads `index.states.json`. A file (or one state) may carry `"storage": { "session": {…}, "local": {…} }`, written into the browser before the page's own scripts run, so a first-visit question renders as a returning visitor sees it: every hall file seeds `hall-craft-asked` so the mode picker stays out of the shots ([task 1005080](https://cloudbongos.com/builders#/task/1005080)). A hall state that needs real data (a goal's detail, the Settings sections) passes against the hall-preview harness with `--base-in`/`--base-out`, one render at a time. The full loop, the file shapes and the failure table: [`docs/recipes/ui-look-before-you-ship.md`](../../../docs/recipes/ui-look-before-you-ship.md). Exit codes everywhere: 0 clean · 1 problems · 2 a broken file or usage · 3 no browser.
 

package/modules/ui-design/kit/lib.js

@@ -29,6 +29,7 @@ const FLOORS = Object.freeze([
   'text-fit',             // no text runs past its box (HTML) or its card rect (SVG)
   'sibling-overlap',      // no two in-flow, block-level, text-bearing siblings overlap
   'empty-graphic',        // no shown <use> or <img> that paints nothing (a referenced SVG that failed to parse)
+  'covered-content',      // no on-screen text sits under a painted layer (a veil, a plate, an overlay)
   'one-header-main-h1',  // exactly one <header>, one <main>, one <h1>
   'controls-24px',        // every visible control clears 24px on both sides
   'top-bar-80px',         // the page's <header> is at most 80px tall
@@ -307,6 +308,56 @@ function factsInPage(spec) {
     else if (r.width < 1 || r.height < 1) emptyGraphics.push(`${where(im)} → "${ref(im)}" renders ${Math.round(r.width)}x${Math.round(r.height)}`);
   });
   out.emptyGraphics = emptyGraphics;
+  // The covered-content floor (task 1005132): the hall specimen read near-black in dark because a fixed
+  // body::after veil painted OVER content that was not lifted above it, and every other floor passed. Hit-test the
+  // middle of each on-screen text run with pointer-events forced on (a veil is pointer-events: none, which hit
+  // testing would otherwise look straight through): a hit outside the text's own box is a layer on top of it, and
+  // it counts when that layer paints — an ancestor's positioned ::before/::after, or (with no modal open) another
+  // element or its pseudo. A transparent stretched-link overlay and the scrim behind an open dialog are skipped.
+  const alpha = (c) => { const m = String(c).match(/rgba?\(([^)]*)\)/); if (!m) return c === 'transparent' ? 0 : 1; const n = m[1].split(/[\s,/]+/).filter(Boolean); return n.length > 3 ? parseFloat(n[3]) * (/%/.test(n[3]) ? 0.01 : 1) : 1; };
+  // Opaque enough to hide text: a background colour, or a gradient every stop of which, at half alpha or more —
+  // a glow or halo that fades to transparent is not a cover. An image (url()) is not judged, and neither is a
+  // masked or clipped layer, whose box is bigger than what it paints (the cosmos orb's shaped disc).
+  const solid = (cs) => {
+    if ((cs.maskImage || cs.webkitMaskImage || 'none') !== 'none' || (cs.clipPath || 'none') !== 'none') return false;
+    const stops = /gradient\(/.test(cs.backgroundImage) ? cs.backgroundImage.match(/rgba?\([^)]*\)|transparent/g) || [] : [];
+    return +cs.opacity * Math.max(alpha(cs.backgroundColor), stops.length ? Math.min(...stops.map(alpha)) : 0) >= 0.5;
+  };
+  const paints = (cs, pseudo) => !!cs && (!pseudo || (cs.content !== 'none' && cs.content !== 'normal' && /absolute|fixed/.test(cs.position))) && cs.display !== 'none' && cs.visibility !== 'hidden' && solid(cs);
+  // A fixed or sticky bar that content scrolls under is layered on purpose.
+  const pinned = (hit, box) => { for (let a = hit; a && !a.contains(box); a = a.parentElement) if (/fixed|sticky/.test(getComputedStyle(a).position)) return true; return false; };
+  const layerOf = (hit, box) => {
+    const name = hit === document.body ? 'body' : hit === de ? 'html' : where(hit);
+    for (const ps of ['::after', '::before']) if (paints(getComputedStyle(hit, ps), true)) return name + ps;
+    return !hit.contains(box) && !pinned(hit, box) && paints(getComputedStyle(hit), false) ? name : null;
+  };
+  const modal = qa('dialog[open], [aria-modal="true"]').some(vis);
+  const coveredText = [], probed = new Set();
+  const force = document.createElement('style');
+  force.textContent = '*, *::before, *::after { pointer-events: auto !important; }';
+  de.appendChild(force);
+  try {
+    const tw = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);
+    for (let n = tw.nextNode(); n && probed.size < 300; n = tw.nextNode()) {
+      const el = n.parentElement;
+      if (!n.nodeValue.trim() || !el || NO_TEXT.test(el.tagName) || el.closest('svg') || !vis(el)) continue;
+      let box = el;
+      while (box && /^(inline|contents)$/.test(getComputedStyle(box).display)) box = box.parentElement;
+      if (!box || probed.has(box) || box.clientWidth < 4 || box.clientHeight < 4) continue; // < 4: a visually-hidden label
+      const rg = document.createRange(); rg.selectNodeContents(n);
+      const r = [...rg.getClientRects()].find((x) => x.width > 0 && x.height > 0);
+      if (!r) continue;
+      const x = r.left + r.width / 2, y = r.top + r.height / 2;
+      if (x < 0 || y < 0 || x >= innerWidth || y >= innerHeight) continue;
+      probed.add(box);
+      const hit = document.elementFromPoint(x, y);
+      if (!hit || hit === el || el.contains(hit) || box.contains(hit)) continue;
+      if (modal && !hit.contains(box)) continue;
+      const layer = layerOf(hit, box);
+      if (layer) coveredText.push(`${where(box)} "${quote(n.nodeValue)}" under ${layer}`);
+    }
+  } finally { force.remove(); }
+  out.covered = coveredText;
   return out;
 }
 // Pure: compare collected facts against an expectation. Returns problem strings.
@@ -345,6 +396,7 @@ function auditFloors(facts, { width, mode } = {}) {
   if (facts.textFit && facts.textFit.length) p.push(`text-fit: ${some(facts.textFit)}`);
   if (facts.overlaps && facts.overlaps.length) p.push(`sibling-overlap: ${some(facts.overlaps)}`);
   if (facts.emptyGraphics && facts.emptyGraphics.length) p.push(`empty-graphic: ${some(facts.emptyGraphics)}`);
+  if (facts.covered && facts.covered.length) p.push(`covered-content: ${some(facts.covered)}`);
   if (facts.headers !== 1 || facts.mains !== 1 || facts.h1s !== 1) p.push(`one-header-main-h1: header ${facts.headers} main ${facts.mains} h1 ${facts.h1s}`);
   if (facts.smallControls && facts.smallControls.length) p.push(`controls-24px: ${facts.smallControls.join(' | ')}`);
   if (facts.bar && facts.bar.h > 80) p.push(`top-bar-80px: header is ${facts.bar.h}px`);

package/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@bongos/core",
-  "version": "1.24.67",
+  "version": "1.24.68",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@bongos/core",
-      "version": "1.24.67",
+      "version": "1.24.68",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "express": "^4.21.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bongos/core",
-  "version": "1.24.67",
+  "version": "1.24.68",
   "description": "Cloud Bongos — the AI-first build platform core (GDS + platform surfaces + module system), installed as a versioned dependency (ADR 0108).",
   "license": "AGPL-3.0-or-later",
   "main": "src/platform-server.js",

package/release-notes.json

@@ -11405,5 +11405,11 @@
       "id": "1004383",
       "text": "The CI check that guards every merge is now protected, so a builder below Metic can no longer quietly switch its checks off. Protecting the credit-minting file was held back for the owner to decide, because it would lock the w"
     }
+  ],
+  "1.24.68": [
+    {
+      "id": "1005132",
+      "text": "The design checker now catches text hidden under a dark overlay (the bug that made the components page unreadable in dark mode), instead of reporting it clean."
+    }
   ]
 }

package/src/module-api.js

@@ -81,7 +81,7 @@ const { sleep } = require('./sleep');
 // MAJOR (see allowBoxScope below): passes the request through untouched.
 function deprecatedNoopMiddleware(_req, _res, next) { next(); }
 
-const CORE_VERSION = '1.24.67'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
+const CORE_VERSION = '1.24.68'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
 
 // A namespaced logger so a module's log lines are attributable + consistent.
 // Usage: const log = api.logger('discord'); log.info('mounted');

package/tests/ui_design_kit.mjs

@@ -27,7 +27,7 @@ const readJson = (rel) => JSON.parse(fs.readFileSync(path.join(ROOT, rel), 'utf8
 
 // ── the contract ──────────────────────────────────────────────────────────────
 test('the platform floors are a pinned list — a floor cannot vanish quietly', () => {
-  assert.deepEqual([...lib.FLOORS], ['console-errors', 'failed-requests', 'horizontal-overflow', 'text-fit', 'sibling-overlap', 'empty-graphic', 'one-header-main-h1', 'controls-24px', 'top-bar-80px', 'reduced-motion']);
+  assert.deepEqual([...lib.FLOORS], ['console-errors', 'failed-requests', 'horizontal-overflow', 'text-fit', 'sibling-overlap', 'empty-graphic', 'covered-content', 'one-header-main-h1', 'controls-24px', 'top-bar-80px', 'reduced-motion']);
   assert.deepEqual(lib.EXIT, { CLEAN: 0, PROBLEMS: 1, USAGE: 2, NO_BROWSER: 3 });
   assert.deepEqual(Object.keys(lib.SIZES), ['320', '390', '1024', '1280', '1440']);
   assert.deepEqual([...lib.DEFAULT_SIZES], [1440, 390, 320], 'render.js renders these unless --sizes names 1280');
@@ -103,6 +103,9 @@ test('auditFloors names each floor a render breaks, and says nothing about a cle
   // task 1005104: a logo whose referenced SVG failed to parse is a floor problem, not ALL CLEAN
   assert.deepEqual(lib.auditFloors({ ...clean(), emptyGraphics: [] }, { width: 1440, mode: 'dark' }), []);
   assert.deepEqual(lib.auditFloors({ ...clean(), emptyGraphics: ['a.brand > svg > use → "/logo.svg#mark" paints nothing'] }, { width: 1440, mode: 'dark' }), ['empty-graphic: a.brand > svg > use → "/logo.svg#mark" paints nothing']);
+  // task 1005132: text under a painted veil is a floor problem, not ALL CLEAN
+  assert.deepEqual(lib.auditFloors({ ...clean(), covered: [] }, { width: 1440, mode: 'dark' }), []);
+  assert.deepEqual(lib.auditFloors({ ...clean(), covered: ['main.spec-main > p.spec-lede "Each shared component" under body::after'] }, { width: 1440, mode: 'dark' }), ['covered-content: main.spec-main > p.spec-lede "Each shared component" under body::after']);
 });
 
 test('expectProblems compares every expectation the vocabulary allows', () => {

package/tests/ui_design_kit_fit.mjs

@@ -103,3 +103,58 @@ test('the empty-graphic floor reports a <use> or <img> that paints nothing, and
   const problems = lib.auditFloors(facts, { width: 1280 });
   assert.ok(problems.some((p) => p.startsWith('empty-graphic: ') && p.includes('#logo-gone')), problems.join('\n'));
 });
+
+// task 1005132: the hall specimen read near-black in dark because style.css's fixed body::after veil painted OVER
+// content that was not lifted above it (task 1005137 fixed the page) — and the render said ALL CLEAN. The
+// covered-content floor reports text a painted layer sits on top of; text lifted above the veil, a transparent
+// stretched-link overlay and the scrim behind an open dialog stay silent.
+const VEIL = `body::after { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background-image: linear-gradient(rgba(0,0,0,.82), rgba(0,0,0,.93)); }`;
+const covered = async (html) => {
+  const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+  const page = await ctx.newPage();
+  await page.setContent(html);
+  const facts = await page.evaluate(lib.factsInPage, {});
+  await ctx.close();
+  return facts;
+};
+
+test('the covered-content floor reports text a painted veil sits over, and not text lifted above it', { skip: !browser && 'no system Edge or Chrome' }, async () => {
+  const facts = await covered(`<!doctype html><html><head><style>${VEIL} .lift { position: relative; z-index: 1; }</style></head><body>
+    <header class="lift"><h1>lifted</h1></header><main><p id="under">this paragraph sits under the veil</p></main></body></html>`);
+  assert.deepEqual(facts.covered.map((c) => c.split(' "')[0]), ['#under'], facts.covered.join('\n'));
+  assert.match(facts.covered[0], /^#under "this paragraph sits under the v.*" under body::after$/);
+  assert.ok(lib.auditFloors(facts, { width: 1280 }).some((p) => p.startsWith('covered-content: #under')));
+});
+
+test('a transparent stretched link, an open dialog\'s scrim and an off-screen paragraph are not covered content', { skip: !browser && 'no system Edge or Chrome' }, async () => {
+  const facts = await covered(`<!doctype html><html><head><style>
+    .card { position: relative; width: 300px; } .card a::after { content: ""; position: absolute; inset: 0; }
+    .scrim { position: fixed; inset: 0; background: rgba(0,0,0,.6); }
+    dialog { z-index: 2; }
+  </style></head><body><header></header><main><h1>cards</h1>
+    <div class="card"><h2><a href="/x">the card's link</a></h2><p>the card's text under a transparent overlay</p></div>
+    <p>a paragraph behind the open dialog's scrim</p>
+    <p style="margin-top: 2000px">far below the fold</p>
+    <div class="scrim"></div><div role="dialog" aria-modal="true" style="position: fixed; top: 10px; left: 10px; z-index: 3; background: white">the dialog</div>
+  </main></body></html>`);
+  assert.deepEqual(facts.covered, [], facts.covered.join('\n'));
+});
+
+test('a fixed top bar over scrolled text, a glow that fades to transparent and a visually-hidden heading are not covered content', { skip: !browser && 'no system Edge or Chrome' }, async () => {
+  const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+  const page = await ctx.newPage();
+  await page.setContent(`<!doctype html><html><head><style>
+    header { position: fixed; top: 0; left: 0; right: 0; height: 60px; background: #111; z-index: 5; }
+    .orb { position: relative; width: 120px; } .orb .disc::before { content: ""; position: absolute; inset: -40px; background-image: radial-gradient(rgba(255,160,80,.6), transparent 70%); }
+    .vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
+    .sky { position: absolute; inset: 0; background: #000; z-index: 2; }
+  </style></head><body><header>the bar</header><main><div class="sky"></div><h1 class="vh">the project map</h1>
+    <div class="orb" style="position: relative; z-index: 3; margin-top: 80px"><span class="disc">●</span><div class="nm">Demo world</div></div>
+    <div class="orb" style="position: relative; z-index: 3"><span class="shape" style="position: relative; display: block; height: 20px"><i style="position: absolute; left: 0; top: 0; width: 120px; height: 80px; background: #c84; -webkit-mask-image: linear-gradient(black 20px, transparent 20px); mask-image: linear-gradient(black 20px, transparent 20px)"></i></span><div class="nm">a masked shape's name</div></div>
+    <p style="position: relative; z-index: 3">a paragraph the page scrolls under the bar</p><div style="height: 2000px"></div>
+  </main></body></html>`);
+  await page.evaluate(() => window.scrollTo(0, 120));
+  const facts = await page.evaluate(lib.factsInPage, {});
+  await ctx.close();
+  assert.deepEqual(facts.covered, [], facts.covered.join('\n'));
+});