zellyy-finance/test-app-pages.cjs

/**
 * 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);