Marcos Paulo
c2b35d5355
The Astro /full-guide/ ends after `.sources`. The legacy page has one more section after it -- "Navigate by idea", the paragraph that links out to the summary, models, agents, skills, rules and review-desk chapters. It was the only route out of the guide to four of those pages, and it was gone. Nothing caught it. verify.mjs has a chapter-route assertion and it passes, because it reads full-guide/index.html -- the legacy file, which still has the section. The section has no `translations.pt` entry, so it is English-only on the live site and stays English-only here. Adds .agents/scripts/rendered-text-diff.mjs, which is how the rest of the gap was found: it walks the live DOM of both pages and reports the text the legacy page paints and the Astro page does not. Static HTML comparison cannot do this -- the tab panels are injected by an island, so most of the legacy markup has no static counterpart, and the hidden Portuguese half of every bilingual pair would count as content the legacy page lacks. It currently reports 86 further missing spans on /full-guide/. That is a separate, larger restoration; this commit does not attempt it. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
93 lines
3.4 KiB
JavaScript
93 lines
3.4 KiB
JavaScript
#!/usr/bin/env node
|
|
// Compare the *rendered* text of a legacy page against its Astro replacement.
|
|
//
|
|
// node .agents/scripts/rendered-text-diff.mjs full-guide
|
|
//
|
|
// Why this exists: scripts/verify.mjs reads the legacy files, so a migrated
|
|
// page can drop half its content and still pass the gate. Task 15d shipped
|
|
// /full-guide/ missing 86 rendered spans -- the entire verification section,
|
|
// the hands-on exercise brief, and both "Clone from Gitea" links -- and every
|
|
// check was green.
|
|
//
|
|
// Static HTML comparison is useless here: the guide's tab panels are injected
|
|
// by an island at runtime, so half the legacy page's markup has no static
|
|
// counterpart. This walks the live DOM instead and skips anything the browser
|
|
// is not painting -- which also drops the hidden Portuguese half of each
|
|
// bilingual pair, so the two sides line up.
|
|
//
|
|
// Requires playwright (devDependency) and two static servers; it starts both.
|
|
import { spawn } from 'node:child_process';
|
|
import { cpSync, mkdtempSync, rmSync } from 'node:fs';
|
|
import { tmpdir } from 'node:os';
|
|
import { join } from 'node:path';
|
|
import { chromium } from 'playwright';
|
|
|
|
const route = process.argv[2];
|
|
if (!route) {
|
|
console.error('usage: rendered-text-diff.mjs <route> e.g. full-guide');
|
|
process.exit(2);
|
|
}
|
|
|
|
// The built site expects to be served under the configured base path.
|
|
const staging = mkdtempSync(join(tmpdir(), 'af-rtd-'));
|
|
cpSync('dist', join(staging, 'ai-for-dummies'), { recursive: true });
|
|
|
|
const serve = (dir, port) =>
|
|
spawn('python3', ['-m', 'http.server', String(port), '-d', dir], { stdio: 'ignore' });
|
|
const servers = [serve('.', 4197), serve(staging, 4196)];
|
|
const stop = () => {
|
|
servers.forEach((s) => s.kill());
|
|
rmSync(staging, { recursive: true, force: true });
|
|
};
|
|
|
|
// Visible text nodes, in document order, whitespace collapsed.
|
|
const visibleText = () => {
|
|
const out = [];
|
|
const walk = (node) => {
|
|
for (const child of node.childNodes) {
|
|
if (child.nodeType === Node.TEXT_NODE) {
|
|
const text = child.textContent.replace(/\s+/g, ' ').trim();
|
|
if (text) out.push(text);
|
|
continue;
|
|
}
|
|
if (child.nodeType !== Node.ELEMENT_NODE) continue;
|
|
if (child.tagName === 'SCRIPT' || child.tagName === 'STYLE') continue;
|
|
const style = getComputedStyle(child);
|
|
if (child.hidden || style.display === 'none' || style.visibility === 'hidden') continue;
|
|
walk(child);
|
|
}
|
|
};
|
|
walk(document.body);
|
|
return out;
|
|
};
|
|
|
|
try {
|
|
await new Promise((r) => setTimeout(r, 1500));
|
|
const browser = await chromium.launch();
|
|
const grab = async (url) => {
|
|
const page = await browser.newPage({ viewport: { width: 1400, height: 1000 } });
|
|
await page.goto(url, { waitUntil: 'load' });
|
|
// The islands hydrate and render their initial panel on load; without this
|
|
// every panel's copy reads as missing.
|
|
await page.waitForTimeout(1200);
|
|
const spans = await page.evaluate(visibleText);
|
|
await page.close();
|
|
return spans;
|
|
};
|
|
|
|
const legacy = await grab(`http://localhost:4197/${route}/index.html`);
|
|
const astro = await grab(`http://localhost:4196/ai-for-dummies/${route}/`);
|
|
await browser.close();
|
|
|
|
const rendered = new Set(astro);
|
|
const missing = legacy.filter((span) => !rendered.has(span));
|
|
|
|
console.log(
|
|
`legacy ${legacy.length} spans · astro ${astro.length} spans · missing ${missing.length}`,
|
|
);
|
|
for (const span of missing) console.log(` - ${span}`);
|
|
process.exitCode = missing.length === 0 ? 0 : 1;
|
|
} finally {
|
|
stop();
|
|
}
|