ktg-plugin-marketplace/plugins/voyage/tests/playground/voyage-playground.test.mjs
Kjell Tore Guttormsen 249142df2f feat(voyage): vendor markdown-it/highlight.js + playground render-pipeline + scripts/render-artifact.mjs CLI — v4.2 Step 8 [skip-docs]
Vendored libs (locked headless via scripts/vendor-playground-libs.mjs;
plan-critic B3 — never use highlightjs.org website builder):
  - playground/lib/markdown-it.min.js           — markdown-it@14.1.0 UMD bundle
  - playground/lib/markdown-it-front-matter.min.js — markdown-it-front-matter@0.2.4 IIFE-wrapped
  - playground/lib/highlight.min.js             — highlight.js@11.11.1 (5-lang bundle:
                                                   yaml/json/javascript/bash/markdown/diff)
  - playground/lib/VENDOR-MANIFEST.json         — pin record + audit trail

scripts/vendor-playground-libs.mjs implements the reproducible
CommonJS-to-IIFE wrapping. Re-vendoring requires only:
  node scripts/vendor-playground-libs.mjs

Render pipeline in playground/voyage-playground.html (~330 LoC total):
  - inline <script src=lib/...> for the three vendored bundles
  - markdown-it init with html: true (preserves voyage:anchor comments)
  - front-matter plugin with pre-render-then-wrap pattern (research/03)
  - paste-import-row textarea + Render/Sample/Clear buttons
  - voyage-viewport region with role + aria-live for A11Y
  - localStorage key pattern: voyage_ann_<project>__<slug> (risk-assessor H7)
  - inline sample plan (mirrors annotation-plan.md fixture)

scripts/render-artifact.mjs CLI (~200 LoC) — brief SC1 + SC11:
  - reads input.md, runs same vendored pipeline server-side
  - inlines DS CSS + (URL-stripped) highlight.js into output
  - zero http://https:// URLs in output (verified by test)
  - deterministic: two invocations -> byte-identical sha256
  - default output: <input>.html next to input

Test coverage:
  - tests/scripts/render-artifact.test.mjs — 5 cases (SC1/SC11)
  - tests/playground/voyage-playground.test.mjs — +5 cases (Step 8 extension)

Verify: node --test tests/playground/voyage-playground.test.mjs
       tests/scripts/render-artifact.test.mjs -> 18 pass / 0 fail.
Full npm test: 587 pass / 0 fail / 2 skipped (Docker).

Refs plan.md Step 8 + plan-critic B3 + scope-guardian B1.
2026-05-09 15:20:17 +02:00

97 lines
4.4 KiB
JavaScript

// tests/playground/voyage-playground.test.mjs
// Filesystem + content tests for v4.2 voyage playground.
// Pure existence + grep checks — no browser launch.
import { test } from 'node:test';
import { strict as assert } from 'node:assert';
import { existsSync, statSync, readFileSync, readdirSync } from 'node:fs';
import { dirname, resolve, join } from 'node:path';
import { fileURLToPath } from 'node:url';
const __dirname = dirname(fileURLToPath(import.meta.url));
const ROOT = resolve(__dirname, '..', '..');
const PLAYGROUND = join(ROOT, 'playground');
const HTML = join(PLAYGROUND, 'voyage-playground.html');
const VENDOR = join(PLAYGROUND, 'vendor', 'playground-design-system');
const MANIFEST = join(VENDOR, 'MANIFEST.json');
test('voyage-playground.html exists and has nonzero size', () => {
assert.ok(existsSync(HTML), 'voyage-playground.html must exist');
assert.ok(statSync(HTML).size > 0, 'must have content');
});
test('voyage-playground.html has DOCTYPE + html closing tag', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /^<!DOCTYPE html>/i);
assert.match(text, /<\/html>\s*$/);
});
test('voyage-playground.html does NOT contain external (http/https) URLs', () => {
// SC1 zero-network constraint: all assets must be relative to ./vendor/
const text = readFileSync(HTML, 'utf-8');
assert.ok(!/https?:\/\//.test(text), 'no external URLs allowed in playground HTML');
});
test('voyage-playground.html does NOT contain literal `marked` (renderer ban per risk-assessor H1)', () => {
const text = readFileSync(HTML, 'utf-8');
// marked is disqualified by issue #3515; markdown-it locked instead
// Allow comments mentioning "marked" as an explanatory artifact, but no actual import paths
assert.ok(!/from ['"].*marked/.test(text), 'no import from marked');
assert.ok(!/<script[^>]*marked\.min\.js/.test(text), 'no marked script tag');
});
test('voyage-playground.html includes skip-to-main link (A11Y baseline)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /Skip to main content/);
});
test('voyage-playground.html declares aria-live region', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /aria-live="polite"/);
});
test('playground/vendor/playground-design-system/MANIFEST.json exists and parses as JSON with expected keys', () => {
assert.ok(existsSync(MANIFEST), 'MANIFEST.json must be present from sync-design-system.mjs');
const obj = JSON.parse(readFileSync(MANIFEST, 'utf-8'));
assert.ok(obj.source_commit, 'source_commit field required');
assert.ok(obj.sync_date, 'sync_date field required');
assert.ok(obj.files && typeof obj.files === 'object', 'files map required');
});
test('playground/vendor/playground-design-system/ contains expected DS files', () => {
const files = readdirSync(VENDOR);
for (const expected of ['tokens.css', 'base.css', 'components.css', 'fonts.css', 'print.css']) {
assert.ok(files.includes(expected), `${expected} expected in vendor/`);
}
assert.ok(files.includes('fonts'), 'fonts/ subdirectory expected');
});
// --- Step 8 — render pipeline + vendored libs ---------------------------
const PLAYGROUND_LIB = join(PLAYGROUND, 'lib');
test('voyage-playground.html references markdown-it (Step 8 render pipeline)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /markdown-it/, 'voyage-playground.html should load/initialize markdown-it');
});
test('voyage-playground.html references highlight.js (Step 8 syntax highlighting)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /highlight/, 'voyage-playground.html should load highlight.js');
});
test('voyage-playground.html includes paste-import-row (Step 8 import affordance)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /paste-import-row/, 'voyage-playground.html should include the paste-import-row pattern');
});
test('voyage-playground.html declares voyage_ann_ localStorage key prefix (Step 8 risk-assessor H7)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /voyage_ann_/, 'localStorage key prefix voyage_ann_<project>__<file> must appear');
});
test('playground/lib/ contains vendored markdown-it + front-matter + highlight bundles', () => {
for (const f of ['markdown-it.min.js', 'markdown-it-front-matter.min.js', 'highlight.min.js', 'VENDOR-MANIFEST.json']) {
assert.ok(existsSync(join(PLAYGROUND_LIB, f)), `playground/lib/${f} expected from vendor-playground-libs.mjs`);
}
});