repremium/mokosh
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(04-06): A35 live-DOM inline-SVG harness check + A17.8 raw-source update + back-patch

Browse Source 
Closes the iter-2 BLOCKER 1 resolution end-to-end: the inline-SVG
strategy now has HONEST automated coverage at two layers — source
contract (Task 1 unit tests + the narrowed A17.8 source-bundling
grep) and live-DOM cascade (the NEW host-side A35 harness assertion
that opens welcome.html as a real Puppeteer tab).

- tests/uat/extension-page-harness.ts (A17.8 NARROWED HONESTLY):
  swap the data:image/svg+xml URL-grep + .svg filename-grep target
  for a raw-source grep — A17.8 now asserts the welcome chunk JS
  contains the raw SVG signature `stroke="currentColor"` AND the
  canonical `viewBox="0 0 32 32"` (the `?raw` import's output). The
  explanatory comment block now DISAVOWS the live-DOM claim and
  points at the NEW A35 driver for the runtime injection + cascade
  proof. A17.8 is honest source-bundling only.
- tests/uat/lib/harness-page-driver.ts (NEW host-side driveA35):
  appended LAST per the iter-2 ADV-2C concern (any driver-pollution
  worry is moot since nothing reads A35's return value, AND
  welcomePage.close() in finally guarantees no tab leak). driveA35
  opens chrome-extension://<id>/src/welcome/welcome.html in a fresh
  browser.newPage() tab, waits for the `.welcome-hero__mark svg`
  selector at DOMContentLoaded, then runs a single page.evaluate()
  that reads four signals: A35.1 inline <svg> present, A35.2
  stroke=currentColor, A35.3 getComputedStyle().stroke resolves to
  a non-default colour (the real cascade proof), A35.4 no legacy
  <img> in the slot. Host-side pattern mirrors driveA32/A33/A34.
- tests/uat/harness.test.ts (orchestrator wiring):
  + driveA35 added to the import block from './lib/harness-page-driver'.
  + driveA35Wrapped closure capturing handles.browser + handles.extensionId
    (alongside driveA33Wrapped/driveA34Wrapped).
  + { name: 'A35', drive: driveA35Wrapped } appended as the LAST
    entry of the `drivers` array. Total auto-increments via
    `drivers.length + 1` (line 580) — no hardcoded count to bump.
  + Architecture banner string (line 283) refreshed with A33, A34,
    A35 inline (ADV-2A cosmetic advisory — banner was already stale
    pre-04-06; A33+A34 added at the same time).
- .planning/phases/01-stabilize-video-pipeline/01-07-SUMMARY.md
  (back-patch, DEFECT 2 resolution):
  Flipped 5 lines (22, 47, 82, 135, 205) that carried the now-stale
  "deferred to Phase 5" framing for cursor visibility — the
  `cursor: 'always'` constraint was opportunistically shipped in
  Plan 01-09 (recorder.ts:285) and is verified by Plan 04-06 Task 1
  (tests/build/cursor-visibility.test.ts). Each flip is surgical
  (single line / single bullet, with explicit "back-patched in
  Phase 4 Plan 04-06" citation). Historical commit-description
  lines 40, 89, 109, 110 are LEFT unchanged — they describe what
  the Phase-1-closure commits literally did at the time, not
  forward-looking deferrals.
- .planning/phases/04-harden-clean-up-optional/deferred-items.md
  (correction, BLOCKER 2 resolution):
  Corrected the misdiagnosed entry from commit 6a989e8. The prior
  entry named tests/build/strict-meta-json-validation.test.ts as
  failing on a clean tree — that diagnosis was WRONG (the test is
  8/8 GREEN in isolation). The real root cause is the pre-existing
  04-CONTEXT #9 + #10 parallel-vitest / ffprobe-timeout flake
  family (lands non-deterministically on whichever ffprobe / race
  test loses the worker race; observed instance this session was
  tests/background/webm-remux.test.ts > ffprobe -count_frames,
  which is also 5/5 GREEN in isolation). True clean baseline is
  184/184 GREEN; 188/188 after Plan 04-06's +4 new tests.

Gates run:
- npx tsc --noEmit exit 0.
- npm run build:test exit 0; dist-test/assets/welcome-CMygHJ_J.js
  carries the raw SVG source.
- HEADLESS=1 SKIP_PROD_REBUILD=0 SKIP_LONG_UAT=1 npm run test:uat:
  36/36 UAT assertions GREEN (was 35/35; +A35). A17.8 PASS:
  currentColorStroke=true, canonicalViewBox=true. A35 live-DOM
  probe: svgPresent=true strokeAttr=currentColor
  computedStroke="rgb(250, 247, 241)" (linen-50, the
  --mks-fg-inverse value flowing through the cascade — the
  currentColor strategy WORKS in real Chrome) imgPresent=false.
- All Task 3 acceptance greps PASS: driveA35 count in
  harness-page-driver.ts=5, in harness.test.ts=6; name:'A35'=1;
  getComputedStyle=6; stroke="currentColor" in
  extension-page-harness.ts=4; data:image/svg+xml=0 (grep target
  and comment refs both removed).

References:
- 04-06-PLAN.md iter-2 BLOCKER 1 + BLOCKER 2 resolutions.
- .planning/phases/04-harden-clean-up-optional/04-UI-SPEC.md
  §"Implementation amendment" (Option A currentColor + inline-SVG).
This commit is contained in:
Mark
2026-05-26 08:48:43 +02:00
parent c4161431e7
commit 3f8e31a329
5 changed files with 235 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
tests/uat/extension-page-harness.ts
View File

@@ -2246,55 +2246,48 @@ async function assertA17(): Promise<AssertionResult> {
passed: resolvedNonDefault,
});
// A17.8: Plan 01-10 must_have #9 path-A swap-in invariant (landed
// 2026-05-20 per debug session 01-10-welcome-page-missing-mark).
// Verifies the canonical Mokosh mark SVG is bundled into the
// welcome chunk so populateMark() can assign it as the <img src>.
// A17.8: Plan 04-06 UI-SPEC dark-logo `currentColor` strategy —
// SOURCE-BUNDLING check ONLY. Verifies that the `?raw` import in
// src/welcome/welcome.ts inlines the canonical mark SVG SOURCE
// string into the welcome chunk JS (the `?raw` query suffix
// returns module content as a UTF-8 string at build time per
// https://vite.dev/guide/assets.html#importing-asset-as-string —
// NOT a hashed asset URL and NOT a Vite-inlined small-asset URL).
//
// Vite's default behaviour (build.assetsInlineLimit = 4096 bytes,
// confirmed via vite.dev/config/build-options.html#build-assetsinlinelimit)
// inlines assets smaller than the limit as data: URLs. The
// canonical mokosh-mark.svg is ~600 bytes, so it's INLINED as a
// `data:image/svg+xml,...` literal inside the welcome JS chunk
// (NOT emitted as a separate `dist/assets/<hash>.svg` file).
// Scope (honest narrowing per iter-2 BLOCKER 1 resolution): A17.8
// proves the source was BUNDLED. It does NOT prove the inline-SVG
// was injected into the live welcome-page DOM, and it does NOT
// prove the `currentColor` CSS cascade resolved. Those runtime
// behaviours are verified by the NEW host-side harness assertion
// A35 (driveA35 in tests/uat/lib/harness-page-driver.ts), which
// opens welcome.html as a real Puppeteer tab, lets populateMark()
// run at DOMContentLoaded, then queries the LIVE injected
// `.welcome-hero__mark svg` element and reads
// `getComputedStyle().stroke` to prove the cascade actually
// resolves. A17.8 + A35 form the canonical source-vs-live coverage
// split for the dark-logo strategy.
//
// We accept BOTH bundling shapes — either is correct from a "the
// mark is reachable from the welcome page" standpoint:
// (a) data URL: `data:image/svg+xml,...` substring in jsText
// (Vite inlined small asset path; default behaviour).
// (b) file URL: a `.svg` filename string in jsText (Vite emitted
// separate asset path; would activate if SVG grew past
// 4096 bytes OR assetsInlineLimit was lowered).
//
// If neither shape is present, populateMark() would assign
// `img.src = undefined` and the welcome hero would render an
// empty/broken image — exactly the regression the operator
// reported in the 2026-05-20 UAT.
const hasInlineDataUrl = jsText.includes('data:image/svg+xml');
const svgFileUrlMatches = jsText.match(/["'][^"']*\.svg["']/g) ?? [];
const hasSvgFileUrl = svgFileUrlMatches.length > 0;
const hasBundledMark = hasInlineDataUrl || hasSvgFileUrl;
diag(result, `Step 7: bundled JS contains inlineDataUrl=${hasInlineDataUrl}, svgFileUrlCount=${svgFileUrlMatches.length}`);
// Cross-witness: the canonical mark's source SVG includes the
// viewBox="0 0 32 32" literal (32×32 woven-square mark per
// src/shared/brand/mokosh-mark.svg). The data URL inlining
// path preserves this verbatim (URL-percent-encoded:
// viewBox='0%200%2032%2032'). For the file URL path the
// substring lives at the fetched asset, not the chunk JS.
// Either way, the chunk JS string is sufficient to prove the
// mark survives the bundle.
// Pre-04-06 history: A17.8 previously accepted EITHER an inline
// small-asset URL literal OR a `.svg` filename (the `?url` import's
// two bundling shapes per Vite's assetsInlineLimit). Plan 04-06
// swapped `?url` -> `?raw` so the SVG source ends up as a verbatim
// string literal inside the JS — no inline asset URL, no separate
// `.svg` asset. The new check asserts the raw-source signature:
// `stroke="currentColor"` AND the canonical `viewBox="0 0 32 32"`
// both appear in the welcome JS.
const hasCurrentColorStroke =
jsText.includes('stroke="currentColor"')
|| jsText.includes("stroke='currentColor'");
const hasCanonicalViewBox =
jsText.includes('viewBox=\'0 0 32 32\'')
|| jsText.includes('viewBox="0 0 32 32"')
|| jsText.includes('viewBox=%270%200%2032%2032%27')
|| jsText.includes("viewBox='0%200%2032%2032'");
|| jsText.includes('viewBox="0 0 32 32"');
diag(result, `Step 7: welcome chunk JS contains stroke=currentColor=${hasCurrentColorStroke}, canonicalViewBox=${hasCanonicalViewBox} (?raw source-bundling check; live-DOM proof = A35)`);
result.checks.push({
name: 'A17.8: welcome chunk JS bundles the canonical mark SVG (data URL OR file URL) AND canonical viewBox preserved (Plan 01-10 must_have #9 path-A swap-in)',
expected: 'data:image/svg+xml OR .svg URL in bundle; canonical viewBox=\'0 0 32 32\' preserved',
actual: `inlineDataUrl=${hasInlineDataUrl}, svgFileUrl=${hasSvgFileUrl}, canonicalViewBox=${hasCanonicalViewBox}`,
passed: hasBundledMark && hasCanonicalViewBox,
name: 'A17.8: welcome chunk JS bundles the raw mark SVG source (stroke="currentColor" + canonical viewBox) via the Vite `?raw` import — Plan 04-06 dark-logo strategy SOURCE-BUNDLING check; live-DOM injection + currentColor cascade are verified by A35',
expected: 'jsText contains stroke="currentColor" AND viewBox="0 0 32 32" (the inlined raw SVG source signature)',
actual: `currentColorStroke=${hasCurrentColorStroke}, canonicalViewBox=${hasCanonicalViewBox}`,
passed: hasCurrentColorStroke && hasCanonicalViewBox,
});
result.passed = result.checks.every((c) => c.passed);