Files
workspace/code/fms/.playwright-cli/inspect-dialog-bars.mjs
T
2026-08-21 17:34:18 +08:00

93 lines
4.0 KiB
JavaScript

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 } })
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)
const result = await page.evaluate(() => {
const ff = document.querySelector('.ff-splitter')
if (!ff) return { error: 'no .ff-splitter' }
const all = ff.querySelectorAll(':scope > *')
const items = Array.from(all).map((el, i) => {
const cls = el.className
const rect = el.getBoundingClientRect()
const cs = getComputedStyle(el)
const barInfo = cls.includes('fms-splitter-bar')
? (() => {
const style = getComputedStyle(el, '::before')
const grip = el.querySelector('.fms-splitter-bar-grip')
const gripStyle = grip ? getComputedStyle(grip) : null
return {
w: Math.round(rect.width),
beforeW: style.width,
beforeH: style.height,
beforeBg: style.background,
gripW: gripStyle ? gripStyle.width : null,
gripH: gripStyle ? gripStyle.height : null,
gripOpacity: gripStyle ? gripStyle.opacity : null,
}
})()
: null
return {
index: i,
class: cls,
left: Math.round(rect.left),
top: Math.round(rect.top),
width: Math.round(rect.width),
height: Math.round(rect.height),
csWidth: cs.width,
csMargin: cs.margin,
csFlex: cs.flex,
csFlexBasis: cs.flexBasis,
barInfo,
}
})
const container = ff.closest('.ff-container')
const containerRect = container ? container.getBoundingClientRect() : null
const containerCS = container ? getComputedStyle(container) : null
const modalBody = document.querySelector('.fms-modal-body')
const modalBodyRect = modalBody ? modalBody.getBoundingClientRect() : null
const panels = Array.from(ff.querySelectorAll(':scope > .fms-splitter-panel')).map((el) => {
const r = el.getBoundingClientRect()
const cs = getComputedStyle(el)
return { w: Math.round(r.width), h: Math.round(r.height), flex: cs.flex, flexBasis: cs.flexBasis, padding: cs.padding, border: cs.border }
})
return { items, containerRect, containerCS: containerCS ? { border: containerCS.border, padding: containerCS.padding } : null, modalBodyRect, panels }
})
console.log(JSON.stringify(result, null, 2))
await browser.close()