// v7.69.3 — la section Aide doit avoir le MÊME positionnement que Settings
const { test, expect } = require('@playwright/test');
const FD_BASE = process.env.FD_BASE_URL || 'http://localhost:8081';
const USER = process.env.FD_USER || 'e2e@flowdeck.local';
const PASS = process.env.FD_PASS || 'e2e-secret-123';

async function login(page) {
  await page.goto(`${FD_BASE}/auth/login?provider=local`, { waitUntil: 'domcontentloaded' });
  await page.fill('#email', USER);
  await page.fill('#password', PASS);
  await page.click('.btn-primary');
  await page.waitForURL('**/workspaces', { timeout: 8000 }).catch(() => {});
}

// géométrie de l'overlay + du panneau, telle que perçue à l'écran
const geo = (page) =>
  page.evaluate(() => {
    const ov = document.querySelector('.settings-overlay');
    const pn = document.querySelector('.settings-panel');
    const o = getComputedStyle(ov);
    const p = getComputedStyle(pn);
    const r = pn.getBoundingClientRect();
    return {
      ovPosition: o.position,
      ovBgSet: o.backgroundColor !== 'rgba(0, 0, 0, 0)',
      pnWidth: Math.round(r.width),
      pnHeight: Math.round(r.height),
      pnCentered: Math.abs(r.left - (window.innerWidth - r.width) / 2) < 24,
      pnTop: Math.round(r.top),
      closeTop: Math.round(document.querySelector('.settings-close').getBoundingClientRect().top - r.top),
      closeRight: Math.round(r.right - document.querySelector('.settings-close').getBoundingClientRect().right),
    };
  });

test('Aide et Settings partagent le même positionnement', async ({ page }) => {
  await login(page);
  await page.goto(`${FD_BASE}/help`, { waitUntil: 'domcontentloaded' });
  await page.waitForTimeout(400);
  const h = await geo(page);

  await page.goto(`${FD_BASE}/settings`, { waitUntil: 'domcontentloaded' });
  await page.waitForTimeout(400);
  const s = await geo(page);

  console.log('HELP   =', JSON.stringify(h));
  console.log('SETTING=', JSON.stringify(s));

  // l'overlay de Aide n'est plus désactivé en inline
  expect(h.ovPosition).toBe(s.ovPosition);
  expect(h.ovPosition).toBe('fixed');
  expect(h.ovBgSet).toBe(true);
  // panneau centré et de la même taille que Settings
  expect(h.pnCentered).toBe(true);
  expect(h.pnWidth).toBe(s.pnWidth);
  expect(h.pnHeight).toBe(s.pnHeight);
  // le bouton close occupe la même place relative au panneau
  expect(h.closeTop).toBe(s.closeTop);
  expect(h.closeRight).toBe(s.closeRight);
  await page.goto(`${FD_BASE}/help`, { waitUntil: 'domcontentloaded' });
  await page.waitForTimeout(300);
  await page.screenshot({ path: 'shots/v7693-help-overlay.png' });
});