// 对比 canvas 与 ctx-menu 的 Vue 监听器挂载: node scripts/vei2.mjs <token>
import puppeteer from 'puppeteer-core'
const EDGE = 'C:/Program Files (x86)/Microsoft/Edge/Application/msedge.exe'
const token = process.argv[2]
const browser = await puppeteer.launch({
  executablePath: EDGE,
  headless: 'new',
  args: ['--window-size=1440,900', '--enable-unsafe-swiftshader', '--use-gl=angle', '--use-angle=swiftshader'],
  defaultViewport: { width: 1440, height: 900 },
})
const page = await browser.newPage()
await page.goto(`http://localhost:8000/combine?token=${encodeURIComponent(token)}`, { waitUntil: 'networkidle2' })
await page.waitForSelector('.lib-item')
await page.click('.lib-item')
await new Promise(r => setTimeout(r, 500))
const box = await (await page.$('.canvas-box')).boundingBox()
await page.mouse.click(box.x + box.width / 2, box.y + box.height / 2, { button: 'right' })
await new Promise(r => setTimeout(r, 300))
const res = await page.evaluate(() => {
  const cv = document.querySelector('.canvas-box canvas')
  const item = document.querySelector('.ctx-item')
  const menu = document.querySelector('.ctx-menu')
  const out = {
    canvasVei: cv && cv._vei ? Object.keys(cv._vei) : null,
    menuExists: !!menu,
    menuParentChain: [],
    itemTag: item ? item.tagName : null,
  }
  let e = item
  while (e && e.tagName !== 'BODY') {
    out.menuParentChain.push(e.tagName + (e.id ? '#' + e.id : '') + (e.className ? '.' + String(e.className).split(' ')[0] : ''))
    e = e.parentElement
  }
  return out
})
console.log(JSON.stringify(res, null, 1))
await new Promise(r => setTimeout(r, 300))
await browser.close()