import fs from 'node:fs';
import path from 'node:path';
import {fileURLToPath} from 'node:url';
import {createRequire} from 'node:module';
const require=createRequire(import.meta.url),{chromium}=require('../../../portal/node_modules/@playwright/test');
const root=path.resolve(path.dirname(fileURLToPath(import.meta.url)),'..');
const model=JSON.parse(fs.readFileSync(path.join(root,'design-model.json'),'utf8'));
const browser=await chromium.launch({headless:true});const page=await browser.newPage({viewport:{width:1600,height:1100},deviceScaleFactor:1});
const errors=[];page.on('pageerror',e=>errors.push(String(e)));await page.goto('http://127.0.0.1:4177/');await page.evaluate(()=>document.fonts.ready);
const report=await page.evaluate(async model=>{const box=document.createElement('div');box.style.cssText='position:fixed;left:-20000px;top:0;width:1440px';document.body.append(box);const over=[],parentOver=[],overlaps=[];let measured=0;for(const b of model.boards){const map=new Map(),parents=new Map();const walk=(n,p)=>{map.set(n.id,n);parents.set(n.id,p);for(const c of n.children||[])walk(c,n)};b.children.forEach(n=>walk(n,b));const view=window.ANKRA_DESIGN.boards.find(x=>x.id===b.id);box.innerHTML=view.svg;for(const el of box.querySelectorAll('text[data-node]')){const n=map.get(el.dataset.node),p=parents.get(n.id),bounds=el.getBBox();measured++;if(bounds.width>n.w+3)over.push({screen:b.id,id:n.id,text:n.text,width:n.w,actual:Math.round(bounds.width*10)/10});if(p&&p.type==='FRAME'&&p.name.startsWith('Card')&&(n.y+n.h>p.h+2||n.x+n.w>p.w+2))parentOver.push({screen:b.id,id:n.id,text:n.text,parent:p.name,y:n.y,h:n.h,parentH:p.h});}const texts=[...box.querySelectorAll('text[data-node]')];const rects=texts.map(el=>{const r=el.getBoundingClientRect();return {el,x:r.x,y:r.y,w:r.width,h:r.height}});for(let i=0;i<rects.length;i++)for(let j=i+1;j<rects.length;j++){const a=rects[i],d=rects[j];if(a.w<2||d.w<2)continue;const xo=Math.min(a.x+a.w,d.x+d.w)-Math.max(a.x,d.x),yo=Math.min(a.y+a.h,d.y+d.h)-Math.max(a.y,d.y);if(xo>4&&yo>3)overlaps.push({screen:b.id,a:a.el.textContent,b:d.el.textContent,x:Math.round(xo),y:Math.round(yo)});}}box.remove();return {measured,textWidthOverflow:over,parentOverflow:parentOver,textOverlaps:overlaps};},model);
const selected=['overview','ai-home','ai-investigation','ai-plan','ai-execution','applications','app-overview','stack-builder','cluster-overview','security','cost','overview-dark','brand-colors','mobile-overview'];fs.mkdirSync(path.join(root,'preview/images'),{recursive:true});for(const id of selected){await page.goto('http://127.0.0.1:4177/#screen/'+id);await page.evaluate(()=>document.fonts.ready);await page.locator('#stage > svg').screenshot({path:path.join(root,'preview/images',id+'.png')});console.log('Rendered '+id);}
const sheet=await browser.newPage({viewport:{width:1536,height:1000}});await sheet.goto('http://127.0.0.1:4177/');await sheet.setContent('<!doctype html><style>@font-face{font-family:Inter;src:url(http://127.0.0.1:4177/assets/InterVariable.woff2);font-weight:100 900}body{margin:0}body>svg{display:block;width:1536px;height:auto}</style>'+fs.readFileSync(path.join(root,'ANKRA-COMPLETE-BOARD.svg'),'utf8'));await sheet.evaluate(()=>document.fonts.ready);await sheet.screenshot({path:path.join(root,'preview/images/complete-board.jpg'),type:'jpeg',quality:85,fullPage:true});await sheet.close();
await page.goto('http://127.0.0.1:4177/#screen/overview');await page.locator('#stage [data-target="ai-home"]').first().click();await page.waitForURL('**/#screen/ai-home');await page.locator('#stage [data-target="ai-chat"]').first().click();await page.waitForURL('**/#screen/ai-chat');await page.locator('#stage [data-target="ai-investigation"]').first().click();await page.waitForURL('**/#screen/ai-investigation');await page.locator('#stage [data-target="ai-plan"]').first().click();await page.waitForURL('**/#screen/ai-plan');await page.locator('#stage [data-target="ai-execution"]').first().click();await page.waitForURL('**/#screen/ai-execution');await page.keyboard.press('Escape');await page.waitForFunction(()=>!document.querySelector('#viewer').classList.contains('open'));await page.locator('#search').fill('mesh');const resultCount=await page.locator('.tile').count();if(resultCount!==1)throw new Error('Search filter failed: '+resultCount);report.interactionChecks=['Overview → AI home → chat → investigation → plan → execution','Escape closes viewer','Search filters to the mesh screen'];report.browserErrors=errors;fs.writeFileSync(path.join(root,'qa/browser-report.json'),JSON.stringify(report,null,2));console.log(JSON.stringify({measured:report.measured,widthOverflow:report.textWidthOverflow.length,parentOverflow:report.parentOverflow.length,textOverlaps:report.textOverlaps.length,browserErrors:errors},null,2));await browser.close();
