66 lines
2.6 KiB
JavaScript
66 lines
2.6 KiB
JavaScript
const { chromium } = require("playwright");
|
|
(async () => {
|
|
const browser = await chromium.launch({ headless: true });
|
|
const page = await browser.newPage({ viewport: { width: 1440, height: 900 } });
|
|
|
|
try {
|
|
await page.goto("http://localhost:3001/products/novavis", { waitUntil: "domcontentloaded", timeout: 15000 });
|
|
await page.waitForTimeout(4000);
|
|
|
|
const result = await page.evaluate(() => {
|
|
const header = document.querySelector("header .container-wide");
|
|
const headerRect = header?.getBoundingClientRect();
|
|
const headerContentLeft = headerRect ? headerRect.left : null;
|
|
|
|
const sections = document.querySelectorAll("section");
|
|
const sectionData = [];
|
|
|
|
sections.forEach((section, i) => {
|
|
const rect = section.getBoundingClientRect();
|
|
if (rect.height < 30) return;
|
|
|
|
const container = section.querySelector(".container-wide, .container-full");
|
|
const containerRect = container?.getBoundingClientRect();
|
|
|
|
const firstTextBlock = section.querySelector("h1, h2, h3, p");
|
|
const textRect = firstTextBlock?.getBoundingClientRect();
|
|
|
|
sectionData.push({
|
|
index: i,
|
|
sectionLeft: Math.round(rect.left),
|
|
containerLeft: containerRect ? Math.round(containerRect.left) : null,
|
|
firstTextLeft: textRect ? Math.round(textRect.left) : null,
|
|
height: Math.round(rect.height),
|
|
text: firstTextBlock?.textContent?.substring(0, 40).trim(),
|
|
});
|
|
});
|
|
|
|
return { headerContentLeft, sections: sectionData };
|
|
});
|
|
|
|
console.log("=== NovaVis 产品页内容对齐检测 ===\n");
|
|
console.log(`Header container left: ${result.headerContentLeft}px\n`);
|
|
|
|
let allAligned = true;
|
|
for (const s of result.sections) {
|
|
const containerOk = s.containerLeft === result.headerContentLeft;
|
|
const textOk = s.firstTextLeft !== null && Math.abs(s.firstTextLeft - result.headerContentLeft) < 5;
|
|
|
|
if (!containerOk && s.containerLeft !== null) {
|
|
allAligned = false;
|
|
console.log(` ❌ Section[${s.index}]: containerLeft=${s.containerLeft} (期望 ${result.headerContentLeft}) | ${s.text?.substring(0, 30)}`);
|
|
} else if (s.containerLeft !== null) {
|
|
console.log(` ✅ Section[${s.index}]: containerLeft=${s.containerLeft} | ${s.text?.substring(0, 30)}`);
|
|
}
|
|
}
|
|
|
|
if (allAligned) {
|
|
console.log("\n🎉 所有区块容器与 Header 对齐！");
|
|
}
|
|
|
|
} catch(e) {
|
|
console.error("ERROR:", e.message);
|
|
}
|
|
await browser.close();
|
|
})();
|