#!/usr/bin/env node import { spawn } from 'node:child_process'; import { setTimeout as delay } from 'node:timers/promises'; import { chromium } from 'playwright'; import { resolve } from 'node:path'; import { promises as fs } from 'node:fs'; import process from 'node:process'; async function run(command, args = [], options = {}) { return new Promise((resolvePromise, reject) => { const child = spawn(command, args, { stdio: 'inherit', shell: false, ...options }); child.on('error', reject); child.on('exit', (code) => { if (code === 0) resolvePromise(undefined); else reject(new Error(`${command} ${args.join(' ')} exited with code ${code}`)); }); }); } async function waitForServer(url, timeoutMs = 60000) { const start = Date.now(); while (Date.now() - start < timeoutMs) { try { const res = await fetch(url); if (res.ok) return; } catch {} await delay(500); } throw new Error(`Server did not start in time: ${url}`); } function parseArgs(argv) { const out = {}; for (const arg of argv.slice(2)) { if (!arg.startsWith('--')) continue; const [k, v] = arg.replace(/^--/, '').split('='); out[k] = v === undefined ? true : v; } return out; } function slugify(text) { return String(text || '') .normalize('NFKD') .replace(/\p{Diacritic}+/gu, '') .toLowerCase() .replace(/[^a-z0-9]+/g, '-') .replace(/^-+|-+$/g, '') .slice(0, 120) || 'article'; } function parseMargin(margin) { if (!margin) return { top: '12mm', right: '12mm', bottom: '16mm', left: '12mm' }; const parts = String(margin).split(',').map(s => s.trim()).filter(Boolean); if (parts.length === 1) { return { top: parts[0], right: parts[0], bottom: parts[0], left: parts[0] }; } if (parts.length === 2) { return { top: parts[0], right: parts[1], bottom: parts[0], left: parts[1] }; } if (parts.length === 3) { return { top: parts[0], right: parts[1], bottom: parts[2], left: parts[1] }; } return { top: parts[0] || '12mm', right: parts[1] || '12mm', bottom: parts[2] || '16mm', left: parts[3] || '12mm' }; } function cssLengthToMm(val) { if (!val) return 0; const s = String(val).trim(); if (/mm$/i.test(s)) return parseFloat(s); if (/cm$/i.test(s)) return parseFloat(s) * 10; if (/in$/i.test(s)) return parseFloat(s) * 25.4; if (/px$/i.test(s)) return (parseFloat(s) / 96) * 25.4; // 96 CSS px per inch const num = parseFloat(s); return Number.isFinite(num) ? num : 0; // assume mm if unitless } function getFormatSizeMm(format) { const f = String(format || 'A4').toLowerCase(); switch (f) { case 'letter': return { w: 215.9, h: 279.4 }; case 'legal': return { w: 215.9, h: 355.6 }; case 'a3': return { w: 297, h: 420 }; case 'tabloid': return { w: 279.4, h: 431.8 }; case 'a4': default: return { w: 210, h: 297 }; } } async function waitForImages(page, timeoutMs = 15000) { await page.evaluate(async (timeout) => { const deadline = Date.now() + timeout; const imgs = Array.from(document.images || []); const unloaded = imgs.filter(img => !img.complete || (img.naturalWidth === 0)); await Promise.race([ Promise.all(unloaded.map(img => new Promise(res => { if (img.complete && img.naturalWidth !== 0) return res(undefined); img.addEventListener('load', () => res(undefined), { once: true }); img.addEventListener('error', () => res(undefined), { once: true }); }))), new Promise(res => setTimeout(res, Math.max(0, deadline - Date.now()))) ]); }, timeoutMs); } async function waitForPlotly(page, timeoutMs = 20000) { await page.evaluate(async (timeout) => { const start = Date.now(); const hasPlots = () => Array.from(document.querySelectorAll('.js-plotly-plot')).length > 0; // Wait until plots exist or timeout while (!hasPlots() && (Date.now() - start) < timeout) { await new Promise(r => setTimeout(r, 200)); } const deadline = start + timeout; // Then wait until each plot contains the main svg const allReady = () => Array.from(document.querySelectorAll('.js-plotly-plot')).every(el => el.querySelector('svg.main-svg')); while (!allReady() && Date.now() < deadline) { await new Promise(r => setTimeout(r, 200)); } }, timeoutMs); } async function waitForD3(page, timeoutMs = 20000) { await page.evaluate(async (timeout) => { const start = Date.now(); const isReady = () => { // Prioritize hero banner if present const hero = document.querySelector('.hero .d3-galaxy') || document.querySelector('.d3-galaxy'); if (hero) { return !!hero.querySelector('svg circle, svg path, svg rect, svg g'); } // Else require all D3 containers on page to have shapes const containers = [ ...Array.from(document.querySelectorAll('.d3-line')), ...Array.from(document.querySelectorAll('.d3-bar')) ]; if (!containers.length) return true; return containers.every(c => c.querySelector('svg circle, svg path, svg rect, svg g')); }; while (!isReady() && (Date.now() - start) < timeout) { await new Promise(r => setTimeout(r, 200)); } }, timeoutMs); } async function waitForStableLayout(page, timeoutMs = 5000) { const start = Date.now(); let last = await page.evaluate(() => document.scrollingElement ? document.scrollingElement.scrollHeight : document.body.scrollHeight); let stableCount = 0; while ((Date.now() - start) < timeoutMs && stableCount < 3) { await page.waitForTimeout(250); const now = await page.evaluate(() => document.scrollingElement ? document.scrollingElement.scrollHeight : document.body.scrollHeight); if (now === last) stableCount += 1; else { stableCount = 0; last = now; } } } async function main() { const cwd = process.cwd(); const port = Number(process.env.PREVIEW_PORT || 8080); const baseUrl = `http://127.0.0.1:${port}/`; const args = parseArgs(process.argv); // Default: light (do not rely on env vars implicitly) const theme = (args.theme === 'dark' || args.theme === 'light') ? args.theme : 'light'; const format = args.format || 'A4'; const margin = parseMargin(args.margin); const wait = (args.wait || 'full'); // 'networkidle' | 'images' | 'plotly' | 'full' // filename can be provided, else computed from page title later let outFileBase = (args.filename && String(args.filename).replace(/\.pdf$/i, '')) || 'article'; console.log('> Building Astro site…'); await run('npm', ['run', 'build']); console.log('> Starting Astro preview…'); // Start preview in its own process group so we can terminate all children reliably const preview = spawn('npm', ['run', 'preview'], { cwd, stdio: 'inherit', detached: true }); const previewExit = new Promise((resolvePreview) => { preview.on('close', (code, signal) => resolvePreview({ code, signal })); }); try { await waitForServer(baseUrl, 60000); console.log('> Server ready, generating PDF…'); const browser = await chromium.launch({ headless: true }); try { const context = await browser.newContext(); await context.addInitScript((desired) => { try { localStorage.setItem('theme', desired); // Apply theme immediately to avoid flashes if (document && document.documentElement) { document.documentElement.dataset.theme = desired; } } catch {} }, theme); const page = await context.newPage(); // Pre-fit viewport width to printable width so charts size correctly const fmt = getFormatSizeMm(format); const mw = fmt.w - cssLengthToMm(margin.left) - cssLengthToMm(margin.right); const printableWidthPx = Math.max(320, Math.round((mw / 25.4) * 96)); await page.setViewportSize({ width: printableWidthPx, height: 1200 }); await page.goto(baseUrl, { waitUntil: 'load', timeout: 60000 }); // Give time for CDN scripts (Plotly/D3) to attach and for our fragment hooks to run try { await page.waitForFunction(() => !!window.Plotly, { timeout: 8000 }); } catch {} try { await page.waitForFunction(() => !!window.d3, { timeout: 8000 }); } catch {} // Compute slug from title if needed if (!args.filename) { const title = await page.evaluate(() => { const h1 = document.querySelector('h1.hero-title'); const t = h1 ? h1.textContent : document.title; return (t || '').replace(/\s+/g, ' ').trim(); }); outFileBase = slugify(title); } // Wait for render readiness if (wait === 'images' || wait === 'full') { await waitForImages(page); } if (wait === 'd3' || wait === 'full') { await waitForD3(page); } if (wait === 'plotly' || wait === 'full') { await waitForPlotly(page); } if (wait === 'full') { await waitForStableLayout(page); } await page.emulateMedia({ media: 'print' }); // Generate OG thumbnail (1200x630) try { const ogW = 1200, ogH = 630; await page.setViewportSize({ width: ogW, height: ogH }); // Give layout a tick to adjust await page.waitForTimeout(200); // Ensure layout & D3 re-rendered after viewport change await page.evaluate(() => { window.scrollTo(0, 0); window.dispatchEvent(new Event('resize')); }); try { await waitForD3(page, 8000); } catch {} // Temporarily improve visibility for light theme thumbnails // - Force normal blend for points // - Ensure an SVG background (CSS background on svg element) const cssHandle = await page.addStyleTag({ content: ` .hero .points { mix-blend-mode: normal !important; } .d3-galaxy svg { background: var(--surface-bg); } ` }); const thumbPath = resolve(cwd, 'dist', 'thumb.jpg'); await page.screenshot({ path: thumbPath, type: 'jpeg', quality: 85, fullPage: false }); // Also emit PNG for compatibility if needed const thumbPngPath = resolve(cwd, 'dist', 'thumb.png'); await page.screenshot({ path: thumbPngPath, type: 'png', fullPage: false }); const publicThumb = resolve(cwd, 'public', 'thumb.jpg'); const publicThumbPng = resolve(cwd, 'public', 'thumb.png'); try { await fs.copyFile(thumbPath, publicThumb); } catch {} try { await fs.copyFile(thumbPngPath, publicThumbPng); } catch {} // Remove temporary style so PDF is unaffected try { await cssHandle.evaluate((el) => el.remove()); } catch {} console.log(`✅ OG thumbnail generated: ${thumbPath}`); } catch (e) { console.warn('Unable to generate OG thumbnail:', e?.message || e); } const outPath = resolve(cwd, 'dist', `${outFileBase}.pdf`); // Restore viewport to printable width before PDF (thumbnail changed it) try { const fmt2 = getFormatSizeMm(format); const mw2 = fmt2.w - cssLengthToMm(margin.left) - cssLengthToMm(margin.right); const printableWidthPx2 = Math.max(320, Math.round((mw2 / 25.4) * 96)); await page.setViewportSize({ width: printableWidthPx2, height: 1400 }); await page.evaluate(() => { window.scrollTo(0, 0); window.dispatchEvent(new Event('resize')); }); try { await waitForD3(page, 8000); } catch {} await waitForStableLayout(page); } catch {} // Temporarily make D3 banner reliably visible for PDF let pdfCssHandle = null; try { pdfCssHandle = await page.addStyleTag({ content: ` .hero .points { mix-blend-mode: normal !important; } .d3-galaxy svg { background: var(--surface-bg); } ` }); } catch {} await page.pdf({ path: outPath, format, printBackground: true, margin }); try { if (pdfCssHandle) await pdfCssHandle.evaluate((el) => el.remove()); } catch {} console.log(`✅ PDF generated: ${outPath}`); // Copy into public only under the slugified name const publicSlugPath = resolve(cwd, 'public', `${outFileBase}.pdf`); try { await fs.mkdir(resolve(cwd, 'public'), { recursive: true }); await fs.copyFile(outPath, publicSlugPath); console.log(`✅ PDF copied to: ${publicSlugPath}`); } catch (e) { console.warn('Unable to copy PDF to public/:', e?.message || e); } } finally { await browser.close(); } } finally { // Try a clean shutdown of preview (entire process group first) try { if (process.platform !== 'win32') { try { process.kill(-preview.pid, 'SIGINT'); } catch {} } try { preview.kill('SIGINT'); } catch {} await Promise.race([previewExit, delay(3000)]); // Force kill if still alive // eslint-disable-next-line no-unsafe-optional-chaining if (!preview.killed) { try { if (process.platform !== 'win32') { try { process.kill(-preview.pid, 'SIGKILL'); } catch {} } try { preview.kill('SIGKILL'); } catch {} } catch {} await Promise.race([previewExit, delay(1000)]); } } catch {} } } main().catch((err) => { console.error(err); process.exit(1); });