/** * UI 리디자인 검증 스크립트 * 1. 로그인 페이지 스크린샷 * 2. 로그인 * 3. 대시보드 스크린샷 * 4. 사이드바 스크린샷 */ 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() { if (!fs.existsSync(SCREENSHOT_DIR)) { fs.mkdirSync(SCREENSHOT_DIR, { recursive: true }); } const browser = await chromium.launch({ headless: true }); const context = await browser.newContext({ viewport: { width: 1280, height: 800 } }); const page = await context.newPage(); try { // Step 1: 로그인 페이지 접속 및 스크린샷 console.log("Step 1: 로그인 페이지 접속..."); await page.goto(`${BASE_URL}/login`, { waitUntil: "commit", timeout: 30000 }); await page.waitForTimeout(1500); await page.screenshot({ path: path.join(SCREENSHOT_DIR, "01-login-page.png"), fullPage: true, }); console.log(" -> 01-login-page.png 저장됨"); // Step 2: 로그인 console.log("Step 2: 로그인..."); await page.fill("#userId", "wace"); await page.fill("#password", "qlalfqjsgh11"); await page.click('button[type="submit"]'); await page.waitForURL((url) => !url.pathname.includes("/login"), { timeout: 10000 }).catch(() => {}); await page.waitForTimeout(3000); const currentUrl = page.url(); if (currentUrl.includes("/login")) { console.log(" -> 로그인 실패, 현재 URL:", currentUrl); } else { console.log(" -> 로그인 성공, 리다이렉트:", currentUrl); // Step 3: 메인 페이지로 이동 (대시보드) if (!currentUrl.includes("/main") && !currentUrl.includes("/admin")) { await page.goto(`${BASE_URL}/main`, { waitUntil: "load", timeout: 20000 }); await page.waitForTimeout(2000); } // 대시보드 전체 스크린샷 await page.screenshot({ path: path.join(SCREENSHOT_DIR, "02-dashboard.png"), fullPage: true, }); console.log(" -> 02-dashboard.png 저장됨"); // Step 4: 사이드바 포커스 스크린샷 (좌측 영역) const sidebar = page.locator("aside"); if ((await sidebar.count()) > 0) { await sidebar.first().screenshot({ path: path.join(SCREENSHOT_DIR, "03-sidebar.png"), }); console.log(" -> 03-sidebar.png 저장됨"); } } await browser.close(); console.log("\n검증 완료. 스크린샷:", SCREENSHOT_DIR); } catch (error) { console.error("오류:", error); await page.screenshot({ path: path.join(SCREENSHOT_DIR, "error.png"), fullPage: true, }).catch(() => {}); await browser.close(); process.exit(1); } } main();