Per the orchestrator checkpoint protocol + the saved-memory feedback
"trust harness over manual UAT", Task 4's dark-mode aesthetic
judgment uses Puppeteer-produced screenshots (NOT a manual Chrome
session). This script:
1. Loads dist/ via puppeteer.launch enableExtensions.
2. Resolves the runtime extension ID via the canonical
browser.extensions() Map (mirrors tests/uat/lib/launch.ts
resolveExtensionIdWithPolling).
3. Opens chrome-extension://<id>/src/welcome/welcome.html.
4. Captures the .welcome-hero bounding-box region in LIGHT surface
(default OS appearance — the regression-baseline shot, matching
the Plan 01-10 cycle-2 operator ack 2026-05-20).
5. Sets [data-theme="dark"] on <html> (Mokosh's tokens.css cascade
uses the explicit .dark / [data-theme="dark"] selector at line
234; emulateMediaFeatures alone does NOT trigger it because
tokens.css has no @media (prefers-color-scheme: dark) block — a
fact verified live this session). emulateMediaFeatures is also
set, forward-compatible with any future @media block.
6. Re-screenshot the hero region — the DARK-surface aesthetic shot.
Output paths (canonical per the 04-06-PLAN Task 4 contract):
- /tmp/04-06-welcome-hero-light.png
- /tmp/04-06-welcome-hero-dark.png
Run results (this session):
- LIGHT: computed stroke = rgb(250, 247, 241) — linen-50; the
--mks-fg-inverse value on the LIGHT cascade flowing through
.welcome-hero__mark to the inline <svg>'s currentColor.
- DARK: computed stroke = rgb(24, 27, 42) — ink-900; the
--mks-fg-inverse value AFTER the .dark cascade override
(tokens.css 244 sets --mks-fg-inverse: var(--mks-ink-900)) —
the strategy's contrast flip is empirically verified.
Implementation notes (deviation Rule 3 — observed environment
constraints fixed inline):
- Initial extension ID resolver used browser.targets() polling +
regex; rewritten to use the canonical Puppeteer 22.x
browser.extensions() Map approach.
- Initial screenshot used ElementHandle.screenshot(); Puppeteer
Runtime.callFunctionOn timed out on the second elementHandle
evaluate in headless extension page context. Rewritten to a
single page.evaluate() that returns getBoundingClientRect() +
computedStroke in one CDP round trip, then page.screenshot({clip})
against those coordinates — succeeds reliably.
- protocolTimeout set to 120s to match the UAT harness baseline.
References:
- .planning/phases/04-harden-clean-up-optional/04-06-PLAN.md Task 4.
- tests/uat/lib/launch.ts (the canonical extension-loading pattern).
- https://pptr.dev/api/puppeteer.browser.extensions
- https://pptr.dev/api/puppeteer.page.screenshot
Plan 01-10 (welcome tab) has NOT yet landed at execute-plan time
(verified: ls src/welcome/welcome.html returns absent). Per Wave 5
branch 2B, src/welcome/* file modifications are DEFERRED — when Plan
01-10 lands, its executor will use src/shared/tokens.css directly
(skipping the placeholder welcome-tokens.css step entirely; the
canonical tokens.css is already import-ready from src/shared/).
Unconditional changes in this wave:
1. vite.config.ts gains __VITE_DEV__ define-token (RESEARCH §12 +
D-09 spirit-satisfaction). Defaults to false; activates iff env
var VITE_DEV=1 is set. Reserved for any future inline smoke-mode
check. Currently smoke.sh lives entirely outside Vite's input set
so the gate is a defensive no-op:
define: { __MOKOSH_UAT__: 'false', __VITE_DEV__: JSON.stringify(...) }
2. vite.test.config.ts inherits __VITE_DEV__ via mergeConfig (the
test config only overrides __MOKOSH_UAT__: 'true'; __VITE_DEV__
from base flows through untouched).
3. scripts/README.md (NEW, ~50 lines): documents the smoke-isolation
invariant — dev-only scripts in scripts/ are NOT bundled by
`npm run build`; the production dist/ contains zero smoke
artifacts (verified by RESEARCH §12 grep gate). Provides usage
example for VITE_DEV env override + cross-references RESEARCH §12
and brand-decisions-v1.md D-09. Index lists subset-fonts.sh,
rasterize-icons.sh, and smoke.sh (if present).
Note on Plan 01-10 deferral: when Plan 01-10 executes after this
plan closes, the welcome page src/welcome/welcome.css can either
@import '../shared/tokens.css' directly OR a thin welcome-tokens.css
re-export — both paths are supported by the canonical tokens.css
landed in Wave 1. Plan 01-10's executor must adopt chrome.i18n.getMessage
for any welcome copy strings using the 16-key matrix in _locales/
(welcomeHeroRu + welcomeHeroEn already defined; additional keys
added per Plan 01-10's own artifact list).
Verification:
- vitest baseline 147/147 GREEN (no change from Wave 4 close)
- npm run build clean (no warnings; __VITE_DEV__ propagates through
define static replacement)
- scripts/README.md exists with the smoke-isolation paragraph
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
scripts/rasterize-icons.sh (80 lines) is the one-off rasterization
recipe. It reads src/shared/brand/mokosh-mark.svg and emits the three
toolbar icon sizes via rsvg-convert, with assets-spec.md size FLOOR
sanity checks embedded.
Before:
icons/icon16.png 574 B 16-bit/color RGB (Bug A placeholder)
icons/icon48.png 1153 B 16-bit/color RGB (Bug A placeholder)
icons/icon128.png 2615 B 16-bit/color RGB (Bug A placeholder)
After:
icons/icon16.png 406 B 8-bit/color RGBA (Loom mark — D-01)
icons/icon48.png 784 B 8-bit/color RGBA (Loom mark — D-01)
icons/icon128.png 1952 B 8-bit/color RGBA (Loom mark — D-01)
All three clear assets-spec.md Chrome imageUtil silent-rejection floors
(16≥200B, 48≥500B, 128≥1024B). Sizes match RESEARCH §3 verification.
Per D-06 (Neutral mark + dynamic badge): single neutral mark per size;
no per-state PNG sets. The dynamic chrome.action.setBadgeBackgroundColor
in src/background/index.ts does state communication via colored badge.
Per RESEARCH §3 anti-pattern: PNGs are COMMITTED as static artifacts;
not regenerated at build time. scripts/rasterize-icons.sh is the
documented re-run recipe (for when src/shared/brand/mokosh-mark.svg
changes).
Verification:
- tests/build/icons-present.test.ts: 15/15 GREEN (existence, FLOOR,
PNG signature, dimensions, color-type byte === 6 RGBA)
- Bug A regression check: file content differs from prior placeholders
(verified via git diff binary status); the placeholder fingerprint
used by harness A19 (Wave 6) will distinguish on first 32 bytes.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
