import { chromium } from "@playwright/test";

(async () => {
  console.log("════════════════════════════════════════════════════════");
  console.log("        ✅ FINAL TEST - @rendermode InteractiveWebAssembly");
  console.log("════════════════════════════════════════════════════════\n");
  
  const b = await chromium.launch({ headless: true });
  const p = await b.newPage();
  
  p.on("console", msg => {
    const text = msg.text();
    if (text.includes("[") && text.includes("]")) {
      console.log("  📝 " + text);
    }
  });
  
  try {
    console.log("1️⃣  로그인 페이지 로드");
    await p.goto("http://localhost:5265/login");
    console.log("🔄 /Account/Login 리다이렉션 대기 중...");
    await p.waitForURL("**/Account/Login");
    await p.waitForLoadState("networkidle");
    
    console.log("2️⃣  로그인 입력 시도 (JS DOM Injection)");
    await p.waitForTimeout(1500); // 폼 렌더링 대기
    await p.evaluate(() => {
      document.getElementById('username').value = 'admin';
      document.getElementById('password').value = 'admin';
      document.getElementById('loginBtn').click();
    });
    
    console.log("3️⃣  모니터링 (10초)\n");
    let redirected = false;
    for (let i = 1; i <= 10; i++) {
      await new Promise(r => setTimeout(r, 1000));
      const url = p.url();
      if (url.includes("/dashboard") || url === "http://localhost:5265/") {
        console.log(`\n   ✅ [${i}s] 리다이렉트됨!`);
        console.log(`   URL: ${url}`);
        redirected = true;
        break;
      }
      process.stdout.write(`   [${i}s] ${url}\r`);
    }
    
    const finalUrl = p.url();
    
    if (finalUrl.includes("/dashboard") || finalUrl === "http://localhost:5265/") {
      console.log("\n\n✅✅✅ 성공! 대시보드에 도착했습니다!\n");
      
      // 페이지 콘텐츠 및 DOM 확인
      await new Promise(r => setTimeout(r, 3000));
      const content = await p.content();
      
      // MudBlazor Layout DOM 요소 확인
      const hasMainContent = content.includes("mud-main-content") || content.includes("mud-layout");
      const hasQuantEngine = content.includes("QuantEngine");
      
      console.log(`🔍 DOM [mud-main-content/mud-layout] 존재: ${hasMainContent ? '✅ 예' : '❌ 아니오'}`);
      console.log(`🔍 DOM [QuantEngine] 텍스트 존재: ${hasQuantEngine ? '✅ 예' : '❌ 아니오'}`);
      
      if (hasMainContent && hasQuantEngine) {
        console.log("🎉 예측한 대시보드 화면 및 데이터 검증 성공 (DOM 일치)!");
      } else {
        console.error("❌ 예측 데이터와 실제 DOM 결과가 일치하지 않습니다!");
        process.exit(1);
      }
    } else {
      console.error(`❌ 로그인 후 대시보드 리다이렉션에 실패했습니다. 최종 URL: ${finalUrl}`);
      process.exit(1);
    }
    
    await p.screenshot({ path: "./ultimate-test-result.png", fullPage: true });
    console.log("📷 스크린샷: ultimate-test-result.png");
    
  } catch (e) {
    console.error("❌ Error:", e.message);
  }
  
  await b.close();
})();