106 lines
4.4 KiB
TypeScript
106 lines
4.4 KiB
TypeScript
/**
|
|
* 화면 1053 검증: split-panel 레이아웃
|
|
* - 좌/우 패널, 버튼 오버레이, 높이 채움, overflow 확인
|
|
*/
|
|
|
|
import { chromium } from "playwright";
|
|
import * as path from "path";
|
|
import * as fs from "fs";
|
|
|
|
const BASE_URL = "http://localhost:9771";
|
|
const SCREENSHOT_DIR = path.join(__dirname, "../verification-screenshots");
|
|
|
|
async function main() {
|
|
const browser = await chromium.launch({ headless: true });
|
|
const context = await browser.newContext({ viewport: { width: 1280, height: 900 } });
|
|
const page = await context.newPage();
|
|
|
|
const report: Record<string, any> = {};
|
|
|
|
try {
|
|
await page.goto(`${BASE_URL}/screens/1053`, { waitUntil: "load", timeout: 30000 });
|
|
await page.waitForTimeout(2000);
|
|
|
|
if (page.url().includes("/login")) {
|
|
await page.fill("#userId", "wace");
|
|
await page.fill("#password", "qlalfqjsgh11");
|
|
await page.locator('button[type="submit"]').first().click();
|
|
await page.waitForURL((u) => !u.includes("/login"), { timeout: 15000 }).catch(() => {});
|
|
await page.waitForTimeout(2000);
|
|
await page.goto(`${BASE_URL}/screens/1053`, { waitUntil: "load", timeout: 30000 });
|
|
await page.waitForTimeout(2000);
|
|
}
|
|
|
|
await page.getByText("로딩중", { exact: false }).waitFor({ state: "hidden", timeout: 10000 }).catch(() => {});
|
|
await page.waitForTimeout(1500);
|
|
|
|
report.pageLoadsWithoutErrors = (await page.locator('text="화면을 찾을 수 없습니다"').count()) === 0;
|
|
|
|
const splitPanel = await page.evaluate(() => {
|
|
const leftPanel = document.querySelector("[class*='split'][class*='left'], [data-panel='left'], [class*='left-panel']");
|
|
const rightPanel = document.querySelector("[class*='split'][class*='right'], [data-panel='right'], [class*='right-panel']");
|
|
const resizable = document.querySelector("[class*='resize'], [class*='ResizablePanel]");
|
|
const panels = document.querySelectorAll("[class*='panel'], [data-panel]");
|
|
return {
|
|
hasLeftPanel: !!leftPanel || document.body.innerText.includes("left") || panels.length >= 2,
|
|
hasRightPanel: !!rightPanel || panels.length >= 2,
|
|
panelCount: panels.length,
|
|
resizableCount: document.querySelectorAll("[class*='ResizablePanel'], [class*='resize']").length,
|
|
};
|
|
});
|
|
report.splitPanelVisible = splitPanel.panelCount >= 2 || splitPanel.resizableCount > 0;
|
|
|
|
const twoPanels = await page.locator("[class*='panel'], [data-panel], [class*='split']").count();
|
|
report.twoPanelsFound = twoPanels >= 2;
|
|
|
|
const buttons = await page.locator("button").count();
|
|
const buttonsTopRight = await page.evaluate(() => {
|
|
const btns = Array.from(document.querySelectorAll("button"));
|
|
const viewportW = window.innerWidth;
|
|
return btns.filter((b) => {
|
|
const r = b.getBoundingClientRect();
|
|
return r.right > viewportW * 0.5 && r.top < 200;
|
|
}).length;
|
|
});
|
|
report.buttonsVisible = buttons > 0;
|
|
report.buttonsInTopRightArea = buttonsTopRight;
|
|
|
|
const layoutFillsHeight = await page.evaluate(() => {
|
|
const main = document.querySelector("main") || document.body;
|
|
const h = (main as HTMLElement).offsetHeight;
|
|
return h >= window.innerHeight * 0.8;
|
|
});
|
|
report.layoutFillsHeight = layoutFillsHeight;
|
|
|
|
const overflow = await page.evaluate(() => ({
|
|
bodyScrollWidth: document.body.scrollWidth,
|
|
bodyScrollHeight: document.body.scrollHeight,
|
|
viewportWidth: window.innerWidth,
|
|
viewportHeight: window.innerHeight,
|
|
hasHorizontalOverflow: document.body.scrollWidth > window.innerWidth,
|
|
hasVerticalOverflow: document.body.scrollHeight > window.innerHeight,
|
|
}));
|
|
report.noContentOverflowsViewport = !overflow.hasHorizontalOverflow;
|
|
report.overflowDetails = overflow;
|
|
|
|
await page.screenshot({ path: path.join(SCREENSHOT_DIR, "screen-1053-snapshot.png"), fullPage: true });
|
|
console.log("screen-1053-snapshot.png saved");
|
|
|
|
console.log("\n=== Report ===");
|
|
console.log(JSON.stringify(report, null, 2));
|
|
|
|
fs.writeFileSync(
|
|
path.join(SCREENSHOT_DIR, "screen-1053-report.json"),
|
|
JSON.stringify(report, null, 2)
|
|
);
|
|
} catch (error: any) {
|
|
console.error("Error:", error.message);
|
|
report.error = error.message;
|
|
await page.screenshot({ path: path.join(SCREENSHOT_DIR, "screen-1053-error.png"), fullPage: true }).catch(() => {});
|
|
} finally {
|
|
await browser.close();
|
|
}
|
|
}
|
|
|
|
main();
|