71 lines
2.8 KiB
JavaScript
71 lines
2.8 KiB
JavaScript
import { chromium } from 'playwright';
|
|
|
|
const BASE = 'http://localhost:9027';
|
|
|
|
(async () => {
|
|
const browser = await chromium.launch();
|
|
const ctx = await browser.newContext({ viewport: { width: 1440, height: 900 } });
|
|
const page = await ctx.newPage();
|
|
|
|
await page.goto(`${BASE}/view/mhzc/home`, { waitUntil: 'networkidle', timeout: 30000 });
|
|
await page.waitForSelector('.capability-section', { timeout: 20000 });
|
|
|
|
await page.evaluate(() => {
|
|
const el = document.getElementById('section-capability');
|
|
if (el) el.scrollIntoView({ behavior: 'instant', block: 'start' });
|
|
});
|
|
await page.waitForTimeout(800);
|
|
|
|
// 点击
|
|
await page.locator('.capability-card').nth(0).click();
|
|
await page.waitForTimeout(3500);
|
|
|
|
// 查看 DOM 状态
|
|
const data = await page.evaluate(() => {
|
|
const out = {};
|
|
const wrap = document.querySelector('.content-wrap');
|
|
out.wrapScrollTop = wrap ? wrap.scrollTop : null;
|
|
out.wrapScrollHeight = wrap ? wrap.scrollHeight : null;
|
|
out.wrapClientHeight = wrap ? wrap.clientHeight : null;
|
|
out.wrapClasses = wrap ? wrap.className : null;
|
|
out.wrapStyleHeight = wrap ? getComputedStyle(wrap).height : null;
|
|
out.htmlClasses = document.documentElement.className;
|
|
out.htmlData = (function() {
|
|
const r = document.documentElement.getBoundingClientRect();
|
|
return { width: r.width, height: r.height };
|
|
})();
|
|
const root = document.documentElement;
|
|
out.homeFigmaScale = getComputedStyle(root).getPropertyValue('--home-figma-scale');
|
|
out.portalShellMinDesignHeight = getComputedStyle(root).getPropertyValue('--portal-shell-min-design-height');
|
|
out.portalLandingFirstScreenHeight = getComputedStyle(root).getPropertyValue('--portal-landing-first-screen-height');
|
|
out.pageNavHeight = getComputedStyle(root).getPropertyValue('--page-nav-height');
|
|
|
|
const outlet = document.querySelector('.portal-route-outlet');
|
|
out.outletChildren = outlet ? outlet.children.length : null;
|
|
const firstChild = outlet && outlet.firstElementChild;
|
|
out.firstChildClass = firstChild ? firstChild.className : null;
|
|
out.firstChildBoundingRect = firstChild ? (function() {
|
|
const r = firstChild.getBoundingClientRect();
|
|
return { top: r.top, left: r.left, width: r.width, height: r.height };
|
|
})() : null;
|
|
out.firstChildStyle = firstChild ? firstChild.getAttribute('style') : null;
|
|
|
|
// 找 content-1
|
|
const c1 = document.getElementById('content-1');
|
|
out.content1Rect = c1 ? (function() {
|
|
const r = c1.getBoundingClientRect();
|
|
return { top: r.top, left: r.left, width: r.width, height: r.height };
|
|
})() : null;
|
|
return out;
|
|
});
|
|
console.log(JSON.stringify(data, null, 2));
|
|
|
|
// 不截图
|
|
// await page.screenshot({ path: 'tmp-debug2.png', fullPage: false });
|
|
|
|
await browser.close();
|
|
})().catch((e) => {
|
|
console.error('TEST ERROR', e);
|
|
process.exit(1);
|
|
});
|