import {chromium} from 'playwright';
const b = await chromium.launch({channel:'chrome'});
const p = await b.newContext({viewport:{width:390,height:844},deviceScaleFactor:2,isMobile:true,hasTouch:true}).then(c=>c.newPage());
await p.goto('http://localhost/s/stay',{waitUntil:'domcontentloaded'});
await p.waitForTimeout(7000);
console.log(JSON.stringify(await p.evaluate(() => {
  const vis=e=>{const s=getComputedStyle(e),r=e.getBoundingClientRect();return s.display!=='none'&&s.visibility!=='hidden'&&r.width>0&&r.height>0;};
  const hdr = document.querySelector('header');
  const burger = [...document.querySelectorAll('button')].filter(vis).find(b => /메뉴|menu/i.test((b.getAttribute('aria-label')||'')+b.className));
  return {headerTag: hdr ? hdr.outerHTML.slice(0,320) : null,
    burger: burger ? {label:burger.getAttribute('aria-label'), cls:burger.className.slice(0,80),
                      expanded:burger.getAttribute('aria-expanded'), controls:burger.getAttribute('aria-controls')} : null,
    buttons: [...document.querySelectorAll('header button')].map(b=>({al:b.getAttribute('aria-label'), id:b.id, cls:b.className.slice(0,50)}))};
}), null, 1));
// 햄버거 열기
await p.evaluate(() => {
  const vis=e=>{const s=getComputedStyle(e),r=e.getBoundingClientRect();return s.display!=='none'&&r.width>0;};
  const b=[...document.querySelectorAll('header button')].filter(vis).pop();
  b.click();
});
await p.waitForTimeout(1000);
console.log('=== 메뉴 열린 뒤');
console.log(JSON.stringify(await p.evaluate(() => {
  const vis=e=>{const s=getComputedStyle(e),r=e.getBoundingClientRect();return s.display!=='none'&&s.visibility!=='hidden'&&r.width>0&&r.height>0;};
  const panel = document.querySelector('[role="dialog"], nav[id], #w4d-menu, [data-menu]') ;
  const links = [...document.querySelectorAll('a')].filter(vis).filter(a=>(a.getAttribute('href')||'').startsWith('#'));
  return {panelId: panel?panel.id||panel.tagName:null,
    anchorLinks: links.map(a=>a.textContent.trim()+' '+a.getAttribute('href')).slice(0,20),
    panelHTML: links.length ? links[0].parentElement.parentElement.outerHTML.slice(0,400) : null};
}), null, 1));
await p.screenshot({path: process.argv[2]+'/menu.png'});
await b.close();