#!/usr/bin/env node
// Vérification E2E de la ZONE CENTRALE de l'IDE, par interaction réelle (pas des captures) : daemon
// temporaire isolé + Chromium headless piloté en CDP + cookie de session injecté. On clique dans
// l'arbre comme un utilisateur, puis on lit le DOM de Monaco.
//
// Ce que ce script prouve, et qu'aucune capture ne prouvait :
//  (a) ouvrir un fichier alors qu'AUCUN onglet n'est persisté affiche réellement son contenu. C'est
//      le cas nominal qui restait vide et muet : le conteneur de Monaco vivait sous un `v-if`, donc
//      l'éditeur n'était jamais créé et aucun watcher ne retentait ;
//  (b) fermer le dernier onglet puis réouvrir un fichier réaffiche le contenu (le conteneur ne doit
//      pas être détruit, sinon l'éditeur pointe sur un noeud détaché) ;
//  (c) sur mobile, toucher un fichier amène la zone centrale au premier plan (l'arbre et l'éditeur
//      étant mutuellement exclusifs sous 768 px, un contenu visible EST la preuve de la bascule) ;
//  (d) chunk de l'éditeur introuvable : un message et des actions de récupération, pas une zone vide ;
//  (e) la bascule Fichiers / Changements liste bien les fichiers modifiés et permet de committer.
//
// Usage : node packages/server/scripts/verify-editor.mjs
// Prérequis : `npm run build` puis `node packages/server/scripts/copy-web.mjs`.
import { spawn, execFileSync } from 'node:child_process';
import { mkdtempSync, mkdirSync, rmSync, writeFileSync, existsSync } from 'node:fs';
import { tmpdir } from 'node:os';
import { join, dirname } from 'node:path';
import { fileURLToPath } from 'node:url';
import { createRequire } from 'node:module';

const require = createRequire(import.meta.url);
const WebSocket = require('ws');

const PORT = 7412;
const CDP_PORT = 9335;
const ORIGIN = `http://127.0.0.1:${PORT}`;
const MARKER = 'ARB_EDITOR_RENDERED_4242';
const serverDir = join(dirname(fileURLToPath(import.meta.url)), '..');
const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
const results = [];
const check = (name, ok, detail = '') => {
  results.push({ name, ok, detail });
  console.log(`${ok ? '✅' : '❌'} ${name}${detail ? `: ${detail}` : ''}`);
};

function findChromium() {
  for (const bin of ['chromium', 'chromium-browser', 'google-chrome', 'google-chrome-stable']) {
    try {
      return execFileSync('which', [bin]).toString().trim();
    } catch {
      /* essai suivant */
    }
  }
  return null;
}

/** Client CDP minimal : un seul socket, corrélation par id, sessionId pour la cible attachée. */
function cdp(url) {
  const ws = new WebSocket(url, { perMessageDeflate: false, maxPayload: 256 * 1024 * 1024 });
  let nextId = 1;
  const pending = new Map();
  const events = [];
  ws.on('message', (raw) => {
    const msg = JSON.parse(String(raw));
    if (msg.id && pending.has(msg.id)) {
      const { resolve, reject } = pending.get(msg.id);
      pending.delete(msg.id);
      msg.error ? reject(new Error(JSON.stringify(msg.error))) : resolve(msg.result);
      return;
    }
    if (msg.method) events.push(msg);
  });
  const ready = new Promise((res, rej) => (ws.on('open', res), ws.on('error', rej)));
  const send = (method, params = {}, sessionId) =>
    new Promise((resolve, reject) => {
      const id = nextId++;
      pending.set(id, { resolve, reject });
      ws.send(JSON.stringify({ id, method, params, ...(sessionId ? { sessionId } : {}) }));
      setTimeout(() => pending.has(id) && (pending.delete(id), reject(new Error(`CDP timeout: ${method}`))), 30_000);
    });
  return { ws, ready, send, events };
}

const tmp = mkdtempSync(join(tmpdir(), 'arb-verify-editor-'));
let srv = null;
let browser = null;

try {
  const publicIndex = join(serverDir, 'public', 'index.html');
  check('SPA copiée dans packages/server/public', existsSync(publicIndex), publicIndex);

  // --- dépôt de démonstration : un fichier sonde EN PREMIÈRE LIGNE (Monaco virtualise le rendu) ---
  const repo = join(tmp, 'demo-repo');
  mkdirSync(repo, { recursive: true });
  const git = (...args) => execFileSync('git', args, { cwd: repo, stdio: 'pipe' });
  git('init', '-b', 'main');
  git('config', 'user.email', 'test@arboretum.dev');
  git('config', 'user.name', 'Test');
  writeFileSync(join(repo, 'README.md'), '# demo\n');
  writeFileSync(join(repo, 'probe.ts'), `export const probe = '${MARKER}';\n`);
  git('add', '-A');
  git('commit', '-m', 'commit initial');
  // du travail non commité, pour la vue Changements
  writeFileSync(join(repo, 'dirty.txt'), 'travail en cours\n');

  srv = spawn(
    'node',
    [join(serverDir, 'dist', 'index.js'), '--port', String(PORT), '--db', join(tmp, 't.db'), '--claude-home', join(tmp, 'claude'), '--no-discover'],
    { env: { ...process.env, XDG_DATA_HOME: join(tmp, 'xdg'), ARBORETUM_LOG: 'warn' }, stdio: ['ignore', 'pipe', 'pipe'] },
  );
  let srvOut = '';
  srv.stdout.on('data', (d) => (srvOut += d));
  srv.stderr.on('data', (d) => (srvOut += d));
  for (let i = 0; i < 60 && !/arb_[0-9a-f]{16,}/.test(srvOut); i++) await sleep(150);
  const token = /arb_[0-9a-f]{16,}/.exec(srvOut)?.[0];
  check('daemon temporaire démarré + token', !!token);

  const login = await fetch(`${ORIGIN}/api/v1/auth/login`, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json', Origin: ORIGIN },
    body: JSON.stringify({ token }),
  });
  const sessionCookie = (login.headers.getSetCookie?.() ?? []).map((c) => c.split(';')[0]).find((c) => c.startsWith('arb_session='));
  check('login → cookie de session', !!sessionCookie);
  const cookieValue = sessionCookie?.slice('arb_session='.length) ?? '';

  const j = (path, method, body) =>
    fetch(`${ORIGIN}${path}`, {
      method,
      headers: { Origin: ORIGIN, Cookie: sessionCookie ?? '', ...(body ? { 'Content-Type': 'application/json' } : {}) },
      ...(body ? { body: JSON.stringify(body) } : {}),
    });
  const repoRes = await (await j('/api/v1/repos', 'POST', { path: repo })).json();
  const repoId = repoRes.repo?.id;
  const repoLabel = repoRes.repo?.label;
  check('dépôt de démonstration enregistré', !!repoId, repoLabel ?? '');

  const chromeBin = findChromium();
  check('Chromium disponible', !!chromeBin, chromeBin ?? 'introuvable');
  if (!chromeBin) throw new Error('Chromium introuvable : impossible de vérifier le rendu');
  browser = spawn(
    chromeBin,
    [
      '--headless=new',
      `--remote-debugging-port=${CDP_PORT}`,
      `--user-data-dir=${join(tmp, 'chrome')}`,
      '--no-first-run',
      '--no-default-browser-check',
      '--disable-gpu',
      '--hide-scrollbars',
    ],
    { stdio: ['ignore', 'pipe', 'pipe'] },
  );
  let wsUrl = null;
  for (let i = 0; i < 80 && !wsUrl; i++) {
    await sleep(200);
    try {
      wsUrl = (await (await fetch(`http://127.0.0.1:${CDP_PORT}/json/version`)).json()).webSocketDebuggerUrl;
    } catch {
      /* pas encore prêt */
    }
  }
  check('Chromium en écoute CDP', !!wsUrl);
  const client = cdp(wsUrl);
  await client.ready;

  // localStorage est partagé par les cibles d'un même profil : on l'efface pour chaque scénario.
  // AUCUN onglet persisté : c'est précisément le cas qui restait vide. `arboretum.locale` n'est pas
  // un persistedRef (chaîne brute, pas de JSON).
  const seed = (extra = '') =>
    `localStorage.clear();localStorage.setItem('arb.theme', '"dark"');localStorage.setItem('arboretum.locale', 'en');${extra}`;

  /** Ouvre une cible isolée, authentifiée, avec un état de vue amorcé. */
  async function openTarget({ width = 1440, height = 900, extraSeed = '', blocked = [] } = {}) {
    const { targetId } = await client.send('Target.createTarget', { url: 'about:blank' });
    const { sessionId } = await client.send('Target.attachToTarget', { targetId, flatten: true });
    await client.send('Runtime.enable', {}, sessionId);
    await client.send('Log.enable', {}, sessionId);
    await client.send('Network.enable', {}, sessionId);
    await client.send('Page.enable', {}, sessionId);
    await client.send('Emulation.setDeviceMetricsOverride', { width, height, deviceScaleFactor: 1, mobile: width < 500 }, sessionId);
    await client.send('Network.setCookie', { name: 'arb_session', value: cookieValue, domain: '127.0.0.1', path: '/', httpOnly: true }, sessionId);
    if (blocked.length > 0) await client.send('Network.setBlockedURLs', { urls: blocked }, sessionId);
    await client.send('Page.addScriptToEvaluateOnNewDocument', { source: seed(extraSeed) }, sessionId);
    const before = client.events.length;
    await client.send('Page.navigate', { url: `${ORIGIN}/ide` }, sessionId);
    return { targetId, sessionId, before };
  }

  const evaluate = async (expression, sessionId) =>
    (await client.send('Runtime.evaluate', { expression, returnByValue: true }, sessionId)).result?.value;

  /** Attend qu'une condition devienne vraie (jamais de sleep fixe sur un rendu asynchrone). */
  async function waitFor(fn, tries = 60, delay = 250) {
    for (let i = 0; i < tries; i++) {
      if (await fn()) return true;
      await sleep(delay);
    }
    return false;
  }

  // Clic sur une ligne par son libellé exact : les libellés vivent dans un <span> à l'intérieur du
  // <button> de la ligne (arbre de projets comme arbre de fichiers).
  const clickRow = (label, sessionId) =>
    evaluate(
      `(() => {
        const span = [...document.querySelectorAll('button span')].find((s) => s.textContent.trim() === ${JSON.stringify(label)});
        const btn = span?.closest('button');
        if (!btn) return false;
        btn.click();
        return true;
      })()`,
      sessionId,
    );

  // Monaco VIRTUALISE : seules les lignes visibles existent dans le DOM, et les espaces sortent en
  // U+00A0. La sonde est donc en première ligne, et on normalise avant comparaison.
  const editorText = async (sessionId) =>
    (await evaluate(
      `(() => {
        const lines = document.querySelector('.monaco-editor .view-lines');
        return lines ? lines.textContent.replace(/\\u00a0/g, ' ') : '';
      })()`,
      sessionId,
    )) ?? '';

  const editorBox = async (sessionId) =>
    JSON.parse(
      (await evaluate(
        `JSON.stringify((() => {
          const el = document.querySelector('.monaco-editor');
          if (!el) return null;
          const r = el.getBoundingClientRect();
          return { w: Math.round(r.width), h: Math.round(r.height) };
        })())`,
        sessionId,
      )) ?? 'null',
    );

  const describeError = (e) => {
    const d = e.params?.exceptionDetails;
    if (d) {
      const ex = d.exception ?? {};
      const where = d.url ? ` @${d.url}:${d.lineNumber ?? '?'}` : '';
      return `${d.text ?? ''} ${ex.description ?? ex.value ?? ''}${where}`.trim();
    }
    return (e.params?.args ?? []).map((a) => a.description ?? a.value ?? a.type).join(' ');
  };

  const consoleErrors = (sessionId, before) =>
    client.events
      .slice(before)
      .filter((e) => e.sessionId === sessionId)
      .filter((e) => (e.method === 'Runtime.consoleAPICalled' && e.params?.type === 'error') || e.method === 'Runtime.exceptionThrown')
      .map(describeError)
      .filter((m) => m && !/favicon|manifest\.webmanifest/i.test(m));

  /** Déroule l'arbre jusqu'au fichier sonde : dépôt, puis branche, puis fichier. */
  async function openProbeFile(sessionId) {
    if (!(await waitFor(() => clickRow(repoLabel, sessionId)))) return false;
    if (!(await waitFor(() => clickRow('main', sessionId)))) return false;
    return waitFor(() => clickRow('probe.ts', sessionId));
  }

  // --- (a) desktop, aucun onglet persisté : le cas nominal qui restait vide ---
  {
    const { targetId, sessionId, before } = await openTarget();
    const treeReady = await waitFor(async () => !!(await clickRow(repoLabel, sessionId)));
    check('a · arbre de projets rendu', treeReady);
    // L'éditeur ne doit pas exister avant qu'un fichier soit demandé (chargement paresseux préservé).
    check('a · Monaco non chargé avant ouverture d un fichier', (await editorBox(sessionId)) === null);

    check('a · navigation jusqu au fichier', await waitFor(() => clickRow('main', sessionId)) && (await waitFor(() => clickRow('probe.ts', sessionId))));
    const shown = await waitFor(async () => (await editorText(sessionId)).includes(MARKER));
    check('a · le contenu du fichier est réellement rendu', shown, shown ? '' : await editorText(sessionId));
    const box = await editorBox(sessionId);
    check('a · l éditeur occupe une surface réelle', !!box && box.w > 200 && box.h > 100, JSON.stringify(box));
    check('a · la gouttière de numéros est rendue', !!(await evaluate("!!document.querySelector('.margin-view-overlays .line-numbers')", sessionId)));
    const errs = consoleErrors(sessionId, before);
    check('a · aucune erreur console', errs.length === 0, errs.slice(0, 3).join(' | '));
    await client.send('Target.closeTarget', { targetId });
  }

  // --- (b) fermer le dernier onglet, puis réouvrir : le conteneur ne doit pas avoir été détruit ---
  {
    const { targetId, sessionId, before } = await openTarget();
    check('b · fichier ouvert une première fois', (await openProbeFile(sessionId)) && (await waitFor(async () => (await editorText(sessionId)).includes(MARKER))));

    const closed = await evaluate(
      `(() => {
        const tab = [...document.querySelectorAll('[title="probe.ts"]')].find((e) => e.querySelector('button'));
        const btn = tab?.querySelector('button');
        if (!btn) return false;
        btn.click();
        return true;
      })()`,
      sessionId,
    );
    check('b · dernier onglet fermé', !!closed);
    const tabsLeft = await evaluate("JSON.parse(localStorage.getItem('arb.ide.tabs') ?? '[]').length", sessionId);
    check('b · plus aucun onglet', tabsLeft === 0, `restants: ${tabsLeft}`);
    // Le point à prouver : le CONTENEUR survit (v-show, pas v-if). Sans modèle, Monaco détruit sa
    // vue de lui-même (`.monaco-editor` disparaît) et la recrée au prochain setModel : c'est normal.
    // Ce qui ne doit jamais disparaître, c'est le conteneur, sinon l'instance garde une référence sur
    // un noeud détaché et la zone reste définitivement vide.
    const hostAlive = await waitFor(
      async () => (await evaluate("!!document.querySelector('[data-editor-host]')", sessionId)) === true,
      12,
    );
    check('b · le conteneur de l éditeur survit à la fermeture', hostAlive);
    check(
      'b · état vide affiché',
      await waitFor(async () => String(await evaluate('document.body.innerText', sessionId)).includes('No file open'), 12),
    );

    check('b · fichier réouvert', await waitFor(() => clickRow('probe.ts', sessionId)));
    check('b · le contenu revient après réouverture', await waitFor(async () => (await editorText(sessionId)).includes(MARKER)));
    const errs = consoleErrors(sessionId, before);
    check('b · aucune erreur console', errs.length === 0, errs.slice(0, 3).join(' | '));
    await client.send('Target.closeTarget', { targetId });
  }

  // --- (c) mobile : l'arbre et l'éditeur sont mutuellement exclusifs, donc un contenu visible
  //         prouve que l'ouverture d'un fichier a bien amené la zone centrale au premier plan ---
  {
    const { targetId, sessionId } = await openTarget({ width: 390, height: 844 });
    check('c · fichier ouvert depuis l explorateur mobile', await openProbeFile(sessionId));
    check('c · le contenu s affiche (le panneau a basculé)', await waitFor(async () => (await editorText(sessionId)).includes(MARKER)));
    const treeGone = await evaluate(
      `![...document.querySelectorAll('button span')].some((s) => s.textContent.trim() === 'probe.ts')`,
      sessionId,
    );
    check('c · l explorateur a laissé la place à l éditeur', !!treeGone);
    await client.send('Target.closeTarget', { targetId });
  }

  // --- (d) chunk de l'éditeur introuvable : message + actions, puis récupération au rechargement ---
  //     On bloque UNIQUEMENT le module d'import dynamique. Surtout pas *vendor-monaco* : le chunk
  //     d'entrée l'importe statiquement, le bloquer tuerait toute la SPA.
  {
    const { targetId, sessionId } = await openTarget({ blocked: ['*monaco-setup*'] });
    check('d · fichier demandé malgré le chunk bloqué', await openProbeFile(sessionId));
    const said = await waitFor(async () =>
      String(await evaluate('document.body.innerText', sessionId)).includes('The code editor could not be loaded'),
    );
    check('d · l échec est annoncé au lieu d une zone vide', said);
    const actions = await evaluate(
      `(() => {
        const labels = [...document.querySelectorAll('button')].map((b) => b.textContent.trim());
        return labels.includes('Retry') && labels.includes('Reload page');
      })()`,
      sessionId,
    );
    check('d · des actions de récupération sont proposées', !!actions);

    await client.send('Network.setBlockedURLs', { urls: [] }, sessionId);
    await client.send('Page.reload', {}, sessionId);
    check('d · après rechargement, le fichier s ouvre', (await openProbeFile(sessionId)) && (await waitFor(async () => (await editorText(sessionId)).includes(MARKER))));
    await client.send('Target.closeTarget', { targetId });
  }

  // --- (e) bascule Fichiers / Changements : la liste des fichiers non commités et le commit ---
  {
    const { targetId, sessionId, before } = await openTarget({
      extraSeed:
        `localStorage.setItem('arb.ide.centerMode', '"changes"');` +
        `localStorage.setItem('arb.ide.expandedRepos', ${JSON.stringify(JSON.stringify([repoId]))});` +
        `localStorage.setItem('arb.ide.changesExpanded', ${JSON.stringify(JSON.stringify([`${repoId}\0${repo}`]))});`,
    });
    const listed = await waitFor(async () => String(await evaluate('document.body.innerText', sessionId)).includes('dirty.txt'));
    check('e · la vue Changements liste le fichier non commité', listed);
    const hasCommit = await evaluate(
      `[...document.querySelectorAll('button')].some((b) => b.textContent.trim().startsWith('Commit'))`,
      sessionId,
    );
    check('e · le panneau de commit est présent dans le bloc', !!hasCommit);
    // La bascule de mode vit dans la barre d'onglets, donc elle est là même sans aucun onglet ouvert.
    const switched = await evaluate(
      `(() => {
        const btn = [...document.querySelectorAll('button[title]')].find((b) => b.getAttribute('title') === 'Files');
        if (!btn) return false;
        btn.click();
        return true;
      })()`,
      sessionId,
    );
    check('e · la bascule Fichiers est accessible sans onglet ouvert', !!switched);
    check(
      'e · retour au mode Fichiers',
      await waitFor(async () => String(await evaluate('document.body.innerText', sessionId)).includes('No file open')),
    );
    const errs = consoleErrors(sessionId, before);
    check('e · aucune erreur console', errs.length === 0, errs.slice(0, 3).join(' | '));
    await client.send('Target.closeTarget', { targetId });
  }

  client.ws.close();
} catch (err) {
  check('exception', false, String(err));
} finally {
  browser?.kill('SIGTERM');
  srv?.kill('SIGTERM');
  await sleep(1200);
  rmSync(tmp, { recursive: true, force: true });
  const failed = results.filter((r) => !r.ok);
  console.log(failed.length === 0 ? '\nVERIFY EDITOR: ALL GREEN' : `\nVERIFY EDITOR: ${failed.length} FAILURE(S)`);
  process.exit(failed.length === 0 ? 0 : 1);
}