spb/immo-ka

1// Validation ordre des sections — fiche Immo-Ka (ordre DOM = ordre visuel)2// Refonte 2026-09-07 : sections `.ik-*` / ids ; vérifie sur mobile que3// l'ordre visuel est croissant, que la page s'ouvre en haut (scrollY 0), que4// le héro (prix + galerie) est le premier contenu, qu'aucune section ne porte5// un `order` CSS et qu'il n'y a pas de débordement horizontal.6// Usage : node frontend/scripts/check-order.mjs <uid> [baseUrl]7import { chromium, devices } from "playwright";89const UID = process.argv[2];10if (!UID) { console.error("usage: node check-order.mjs <uid> [baseUrl]"); process.exit(2); }11const BASE = process.argv[3] || process.env.BASE || "http://localhost:8096";12const URL = `${BASE}/propriete/${encodeURIComponent(UID)}`;1314async function check(name, ctxOpts) {15  const browser = await chromium.launch();16  const ctx = await browser.newContext(ctxOpts);17  const page = await ctx.newPage();18  const errors = [];19  page.on("pageerror", (e) => errors.push(String(e)));20  page.on("console", (m) => { if (m.type() === "error") errors.push(m.text()); });21  await page.goto(URL, { waitUntil: "networkidle" });22  await page.waitForSelector(".ik-hero", { timeout: 20000 });23  await page.waitForTimeout(2500);24  const data = await page.evaluate(() => {25    const sel = [".ik-hero", "#score", "#resume", ".ik-nav", "#prix", "#propriete", "#description", "#inclusions",26                 "#financement", "#carte", "#proximite", "#transport", "#quartier", "#risques", "#air", "#essence",27                 "#dossier", "#sources"];28    const out = [];29    for (const s of sel) {30      const el = document.querySelector(s);31      if (!el) { out.push({ s, missing: true }); continue; }32      const r = el.getBoundingClientRect();33      out.push({ s, hidden: r.height === 0 && r.width === 0, top: Math.round(r.top + window.scrollY),34                 left: Math.round(r.left), order: getComputedStyle(el).order });35    }36    return { out, scrollY: window.scrollY, overflow: document.documentElement.scrollWidth - window.innerWidth };37  });38  console.log(`\n=== ${name} ===  scrollY initial: ${data.scrollY} · débordement horizontal: ${data.overflow}px`);39  for (const b of data.out)40    console.log(b.missing ? `${b.s.padEnd(14)} (non rendue)` : b.hidden ? `${b.s.padEnd(14)} (vide/masquée)` :41      `${b.s.padEnd(14)} top=${String(b.top).padStart(6)}  left=${String(b.left).padStart(4)}  order=${b.order}`);42  if (errors.length) console.log("console errors:", errors.slice(0, 5));43  await browser.close();44  return { ...data, errors };45}4647const mob = await check("iPhone 14 (mobile)", { ...devices["iPhone 14"] });48const desk = await check("Desktop 1440px", { viewport: { width: 1440, height: 900 } });4950const vis = mob.out.filter((b) => !b.missing && !b.hidden);51const sorted = vis.every((b, i) => i === 0 || b.top >= vis[i - 1].top);52const noOrder = vis.every((b) => b.order === "0");53const ok = sorted && mob.scrollY === 0 && vis[0].s === ".ik-hero" && vis[0].top < 200 && noOrder54  && mob.overflow <= 0 && desk.overflow <= 0;55console.log(`\nMOBILE: ordre visuel ${sorted ? "CROISSANT ✓" : "DÉSORDONNÉ ✗"} · scrollY=${mob.scrollY} · 1re section=${vis[0].s} top=${vis[0].top} · sans order CSS=${noOrder} · overflow mobile=${mob.overflow} desktop=${desk.overflow}`);56console.log(ok ? "VALIDATION OK" : "VALIDATION ÉCHEC");57process.exit(ok ? 0 : 1);58