`scripts/render-check.mjs`

44 lines
#!/usr/bin/env node
// render-check.mjs — headless proof that the refreshed growth page renders AND that the
// daynight-defeat pin holds when the rentv app injects day-mode inline vars. $0 / local.
import { chromium } from 'playwright';
import { dirname, join } from 'node:path';
import { fileURLToPath } from 'node:url';
const HERE = dirname(fileURLToPath(import.meta.url));
const FILE = 'file://' + join(HERE, '..', 'public', 'portal.html');
const OUT = join(HERE, '..', 'reports');

const b = await chromium.launch();
const pg = await b.newPage({ viewport: { width: 1440, height: 1400 }, deviceScaleFactor: 1 });
await pg.goto(FILE, { waitUntil: 'networkidle', timeout: 45000 }).catch(()=>{});
// the deliverable reveals body via JS; force-show for the shot if still hidden
await pg.evaluate(() => { document.body.style.display = 'block'; });
await pg.waitForTimeout(1200);

// --- shot 1: default (standalone dark theme) ---
await pg.screenshot({ path: join(OUT, 'portal-default.png'), fullPage: false });

// --- simulate rentv daynight.js DAY MODE: set the exact vars it flips, as NON-important inline on <html> ---
await pg.evaluate(() => {
  const h = document.documentElement;
  for (const [k,v] of Object.entries({'--bg':'#ffffff','--ink':'#111111','--sub':'rgba(20,20,20,.7)','--wash':'#ffffff','--line':'#cccccc'}))
    h.style.setProperty(k, v); // non-important inline — mimics daynight.js exactly
});
await pg.waitForTimeout(400);
await pg.screenshot({ path: join(OUT, 'portal-daymode.png'), fullPage: false });

// --- numeric proof: computed bg of body + a SWOT heading's color/bg ---
const probe = await pg.evaluate(() => {
  const cs = getComputedStyle(document.body);
  const swot = document.querySelector('.swotq h3, .swotq, [class*="swot"] h3, [class*="swot"]');
  const scs = swot ? getComputedStyle(swot) : null;
  const rootBg = getComputedStyle(document.documentElement).getPropertyValue('--bg').trim();
  return {
    bodyBg: cs.backgroundColor, bodyColor: cs.color, cssVarBg: rootBg,
    swotSel: swot ? swot.className : '(none)',
    swotColor: scs ? scs.color : null, swotBg: scs ? scs.backgroundColor : null,
  };
});
console.log(JSON.stringify(probe, null, 2));
await b.close();