20260821173417

code/fms/.playwright-cli/pixel-scan-dialog.mjs

@@ -0,0 +1,97 @@
+import { chromium } from 'playwright-core'
+
+const BASE = 'http://localhost:5082'
+const browser = await chromium.launch({
+  headless: true,
+  executablePath: 'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
+})
+const page = await browser.newPage({ viewport: { width: 1440, height: 900 }, deviceScaleFactor: 1 })
+
+await page.addInitScript(() => {
+  sessionStorage.setItem('fms-login', JSON.stringify({ loginInfo: { token: 'dev-token', user: { id: 1, name: 'dev', account: 'g3soft' } } }))
+  localStorage.setItem('fms-user', JSON.stringify({ userInfo: { orgId: 'G3HD', account: 'g3soft' } }))
+})
+await page.route('**/api/**', async (route) => {
+  const req = route.request()
+  const url = req.url()
+  let body = {}
+  try { body = req.postDataJSON() || {} } catch {}
+  if (url.includes('/data/loaddata')) {
+    const rows = body.view_name === 's_module' ? [{ b_id: 1, b_code: 'b_port', b_name: '港口管理' }] :
+      body.view_name === 'bf_files_cateid' ? [{ b_id: '10', b_name: '合同文件' }] : []
+    return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ code: 0, data: rows }) })
+  }
+  if (url.includes('/data/page')) {
+    const files = Array.from({ length: 4 }, (_, i) => ({
+      subid: String(1000 + i), father: '1001', mx_moduleid: '1', mx_cate_id: '10',
+      mx_filename: `文件-${i + 1}.pdf`, mx_filesize: (i + 1) * 1024 * 1024,
+      mx_fileext: 'pdf', mx_mapfilename: '',
+    }))
+    return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ code: 0, data: { rows: files, total: files.length } }) })
+  }
+  return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ code: 0, data: null }) })
+})
+
+await page.goto(`${BASE}/file-demo`, { waitUntil: 'networkidle', timeout: 30000 })
+await page.waitForTimeout(2000)
+await page.locator('button:has-text("声明式弹窗")').click()
+await page.waitForTimeout(1500)
+
+// Take screenshot as base64, load into canvas inside the page, and sample pixel columns
+const b64 = await page.screenshot({ encoding: 'base64' })
+const analysis = await page.evaluate(async (b64) => {
+  const img = new Image()
+  img.src = 'data:image/png;base64,' + b64
+  await img.decode()
+  const canvas = document.createElement('canvas')
+  canvas.width = img.width
+  canvas.height = img.height
+  const ctx = canvas.getContext('2d')
+  ctx.drawImage(img, 0, 0)
+  const { width, height } = canvas
+
+  // get color at pixel
+  const px = (x, y) => {
+    const d = ctx.getImageData(x, y, 1, 1).data
+    return `${d[0]},${d[1]},${d[2]}`
+  }
+
+  // Scan a horizontal strip at y = 500 (mid of dialog) from x=570 to x=1410
+  // and report runs of distinct colors
+  const y = 500
+  const runs = []
+  let cur = null
+  for (let x = 570; x < 1410; x++) {
+    const c = px(x, y)
+    if (cur && cur.color === c) {
+      cur.to = x
+    } else {
+      if (cur) runs.push(cur)
+      cur = { color: c, from: x, to: x }
+    }
+  }
+  if (cur) runs.push(cur)
+
+  // Vertical line detection: for a given x, count how many y in [215, 850] have the same color
+  const lineAt = (x) => {
+    const counts = new Map()
+    for (let yy = 215; yy < 850; yy += 2) {
+      const c = px(x, yy)
+      counts.set(c, (counts.get(c) || 0) + 1)
+    }
+    const sorted = [...counts.entries()].sort((a, b) => b[1] - a[1]).slice(0, 3)
+    return sorted.map(([c, n]) => ({ color: c, count: n }))
+  }
+
+  // Check the two bar regions: every x in the bar area, list dominant colors
+  const bars = []
+  for (const [x0, x1] of [[795, 806], [1301, 1312]]) {
+    const cols = []
+    for (let x = x0; x <= x1; x++) cols.push({ x, colors: lineAt(x) })
+    bars.push(cols)
+  }
+  return { runs, bars, imgW: width, imgH: height }
+}, b64)
+
+console.log(JSON.stringify(analysis, null, 2))
+await browser.close()