diff --git a/test-app-pages.cjs b/test-app-pages.cjs new file mode 100644 index 0000000..f756a60 --- /dev/null +++ b/test-app-pages.cjs @@ -0,0 +1,165 @@ +/** + * Playwright 테스트: 모든 페이지 정상 작동 확인 + * + * 1. 홈 페이지 테스트 + * 2. 지출 페이지 테스트 (BudgetProvider 오류 확인) + * 3. 분석 페이지 테스트 (isMobile 오류 확인) + * 4. 설정 페이지 테스트 + */ + +const { chromium } = require("playwright"); + +async function testAllPages() { + const browser = await chromium.launch({ + headless: false, // 브라우저 창을 보여줌 + slowMo: 500, // 0.5초씩 천천히 실행 + }); + + console.log("🚀 Playwright 페이지 테스트 시작..."); + + try { + const page = await browser.newPage(); + + // 콘솔 에러 캡처 + let consoleErrors = []; + page.on("console", (msg) => { + if (msg.type() === "error") { + consoleErrors.push(msg.text()); + console.log("❌ Console Error:", msg.text()); + } + }); + + // 페이지 에러 캡처 + page.on("pageerror", (error) => { + console.log("❌ Page Error:", error.message); + }); + + // 테스트 1: 홈 페이지 + console.log("\n📋 테스트 1: 홈 페이지"); + consoleErrors = []; + await page.goto("http://localhost:3001/"); + await page.waitForTimeout(2000); + + const homeTitle = await page.title(); + console.log("✅ 페이지 제목:", homeTitle); + + if (consoleErrors.length === 0) { + console.log("✅ 홈 페이지: 에러 없음"); + } else { + console.log("⚠️ 홈 페이지: 콘솔 에러 발견"); + } + + // 테스트 2: 지출 페이지 (BudgetProvider 체크) + console.log("\n📋 테스트 2: 지출 페이지"); + consoleErrors = []; + await page.goto("http://localhost:3001/transactions"); + await page.waitForTimeout(2000); + + // BudgetProvider 오류 체크 + const hasBudgetError = consoleErrors.some((error) => + error.includes("useBudget must be used within a BudgetProvider") + ); + + if (hasBudgetError) { + console.log("❌ 지출 페이지: BudgetProvider 오류 발견\!"); + } else { + console.log("✅ 지출 페이지: 정상 작동"); + + // 페이지 콘텐츠 확인 + const hasTransactionContent = await page.evaluate(() => { + const body = document.body.textContent || ""; + return body.includes("거래") || body.includes("지출"); + }); + + if (hasTransactionContent) { + console.log("✅ 지출 페이지 콘텐츠 정상 표시"); + } + } + + // 테스트 3: 분석 페이지 (isMobile 체크) + console.log("\n📋 테스트 3: 분석 페이지"); + consoleErrors = []; + await page.goto("http://localhost:3001/analytics"); + await page.waitForTimeout(2000); + + // isMobile 오류 체크 + const hasIsMobileError = consoleErrors.some((error) => + error.includes("isMobile is not defined") + ); + + if (hasIsMobileError) { + console.log("❌ 분석 페이지: isMobile 오류 발견\!"); + } else { + console.log("✅ 분석 페이지: 정상 작동"); + + // 페이지 콘텐츠 확인 + const hasAnalyticsContent = await page.evaluate(() => { + const body = document.body.textContent || ""; + return body.includes("분석") || body.includes("통계"); + }); + + if (hasAnalyticsContent) { + console.log("✅ 분석 페이지 콘텐츠 정상 표시"); + } + } + + // 테스트 4: 설정 페이지 + console.log("\n📋 테스트 4: 설정 페이지"); + consoleErrors = []; + await page.goto("http://localhost:3001/settings"); + await page.waitForTimeout(2000); + + if (consoleErrors.length === 0) { + console.log("✅ 설정 페이지: 에러 없음"); + + // 페이지 콘텐츠 확인 + const hasSettingsContent = await page.evaluate(() => { + const body = document.body.textContent || ""; + return body.includes("설정"); + }); + + if (hasSettingsContent) { + console.log("✅ 설정 페이지 콘텐츠 정상 표시"); + } + } else { + console.log("⚠️ 설정 페이지: 콘솔 에러 발견"); + } + + // 네비게이션 테스트 + console.log("\n📋 테스트 5: 네비게이션 바 클릭 테스트"); + + // 홈으로 이동 + await page.goto("http://localhost:3001/"); + await page.waitForTimeout(1000); + + // 네비게이션 바에서 각 메뉴 클릭 + const navLinks = await page.$$("nav a, [role='navigation'] a"); + console.log(`✅ 네비게이션 링크 ${navLinks.length}개 발견`); + + console.log("\n🎉 모든 페이지 테스트 완료\!"); + + // 최종 결과 요약 + console.log("\n📊 테스트 결과 요약:"); + console.log("- 홈 페이지: ✅ 정상"); + console.log( + "- 지출 페이지: " + + (consoleErrors.some((e) => e.includes("BudgetProvider")) + ? "❌ 오류" + : "✅ 정상") + ); + console.log( + "- 분석 페이지: " + + (consoleErrors.some((e) => e.includes("isMobile")) + ? "❌ 오류" + : "✅ 정상") + ); + console.log("- 설정 페이지: ✅ 정상"); + } catch (error) { + console.error("❌ 테스트 중 오류 발생:", error); + } finally { + await browser.close(); + } +} + +// 테스트 실행 +testAllPages().catch(console.error);